再谈 Web 字体的现状与未来

前端性能优化:定制字体的现状与未来 本文深入探讨了定制网络字体的性能问题,包括常见的FOIT(闪现不可见文本)和FOUT(闪现无样式文本)问题,及其对用户体验的影响。作者提出了多种优化字体文件大小和浏览器行为的方法,并讨论了未来标准中CSS font-display属性的潜在影响。 阅读详情

随着 CSS3 渐入人心,Web 字体逐渐成为话题,这种即将让未来的 Web 更加丰富多彩的技术(或者说标准)拥有多种可能,虽然 .webfont 即将提交 W3C,然而它的实现仍然遥遥无期,等待是痛苦的,因此,一些公司联合字体设计推出兼容 @font-face 标准的技术,鉴于主流的浏览器都支持 @font-face,这种技术在 .webfont 实现之前不失为一种不错的替代品,参阅关于 Web 字体:现状与未来 。

Web font services join fray as .webfont format gains support
上图是 Typotheque 公司提供的兼容 @font-face 标准的 Web 字体技术示例。

作为 CSS3 的一项改进,尤其是 @font-face 标准的对手 ,.webfont 技术为 Web 设计师提供了更丰富的字体选项。尽管 Firefox 个 Safari 一直积极地推动 Web 中的 TrueType 和 OpenType 技术,然而将商业字体放到服务器供调用会侵犯到字体商的权益,鉴于此,至少有三家公司寻求使用特殊技术,在兼容 @font-face 的前提下,实现对授权字体的访问,多家字体商有意支持该技术,同时,一些大的字体商表示支持 .webfont。

为什么要费这番周折?

几年前,微软购买了10款字体的版权供 Web使用,就是所谓的 Web 字体,我们的 Web 就活在这 10 款字体下,不过老实讲,尽管有10款,但接近98.7% 的 Web 事实上只用其中的4款,Times, Arial, Verdata, 以及 Georgia。其中的原因正象 Web 设计师 Richard Rutter 所说的那样,设计与可访问性问题。

尽管这些字体设计优良,尤其在目前普遍存在的低分辨率显示器上,然而,这些有限的字体显得千篇一律,尤其是公司网站用户,他们更希望实现差异性,比如,他们希望通过定制的字体表达公司的识别信息。Rutter 解释道,最起码,更多字体选项可以能让网站看上去更有个性。

除了美学上的考量,还有一些实践上的考虑,尤其是可访问性。一些 Web 设计师将个性字体转换成 Flash 或图片,这样做有很多问题。真实的字体意味着更少的数据量,尽管对多数宽带用户来说算不上什么,但对一些使用移动设备的用户来说却十分重要,真实的字体还 有更多好处,比如可以缩放,翻译,索引,可以使用读屏软件朗读。另外,诸如希腊文,泰文,中文一类的语言目前没有很好的通用 Web 安全字体,如果能实现自定义字体,将是一种福音。(译者注:作者显然忘记了中文字库庞大的文件尺寸问题)

现状:TypeKit, Fontdeck, 以及 Typotheque 的 Web 字体服务

如今,已经有不少服务商提供基于 @font-face 标准的 Web 字体服务,然而在字体盗用异常简单的今天,如何说服字体商提供在线许可?于是便有了 TypeKit , Fontdeck 一类的服务,他们拥有合法授权的在线字体,通过向 Web 设计与开发者提供一段 CSS 和 JavaScript 代码实现对这些在线字体的访问,除此之外,一些字体商也推出一些类似服务 。

Typotheque 的 Peter Bilak 说,我们的服务使用 TTF 字体,但隐藏了这些字体的真实的地址,因此它们不会被非法复制,我们对字体进行了处理,去掉了浏览器无法识别的部分,然后向用户提供一段代码,这样文件尺 寸只有原始文件的10%到20%大小。

TypeKit Editor interface
以上是 Typekit 的编辑界面

Typekit 和 Fontdeck 的工作方式和 Typotheque 类似,他们按域名签发字体许可,因此别的网站即使得到了这段代码,也无法使用,他们通过使用字体片段来降低数据量。Fontdeck 由 Rutter Clearleft 设计公司开发,可以针对不同浏览器推出不同字体格式,比如 IE 支持 @font-face,但只限于微软自己的 EOT 格式。对于那些不支持 @font-face 的浏览器,他们也有不同的应对措施,比如 Typekit 会使用 sIFR or Cufón 替代方案。

不过他们也受到了一些质疑,比如,这样的机制依赖第三方服务,受限于他们的在线时间,另外一个问题就是费用,字体许可加上带宽的占用不是一个小费用,另外,还有人指出,这些方案并不能真正阻止字体盗用,仅仅是让盗用更难了一些。

针对这些质疑,Rutter 表示,依赖第三方服务的系统到处都是,想想 Google 地图或 Amazon S3,人们没必要担心其可靠性。而价格问题不同服务商各不相同,不过让更多的公司参与进来会让价格降低到市场能够接受的水平,关于字体盗用,字体商们并不 喜欢 DRM,他们希望字体很容易部署使用。Typekit 的 Jeffery Veen 在其公司博客中解释 道,我们的目的是消除通常意义上的滥用。

未来:我们自己的 Web 字体

虽然上面说的这些 Web 字体方案有诸多缺陷,他们在目前至少是已经可以使用了的。不过人们还是提出了一些专门的 Web 字体提议,微软最近再次向 W3C 提交 EOT 提案,不被仍被拒绝,这次提交的 EOT 方案命名为 EOT Lite,似乎意味着一种妥协,不过 Readable Web 的 Richard Fink 解释到,EOT Lite 比 TTF 文件略有不同,包含调整过的文件头以及不同的文件后缀。Font Bureau 的 David Berlow 则提议在标准 OpenType 字体中加入一个许可表 ,以便浏览器查验某个字体是否允许用于某个网站。

而由字体设计师 Tal Leming 与 Erik van Blokland 提议的 .webfont 方 案则受到了多数字体商乃至 W3C 的关注。.webfont 是一种经过 Zip 打包压缩的文件包,包含两个文件,info.xml 以及真正的字体文件,前者包含了 XML 格式的许可信息,受益于其 Zip 压缩格式,这种字体文件尺寸至少减少了40%,不过字体公司应该提供转换工具,实现字体片段机制,这样,文件尺寸还会降低。(译者注:这或许会解决中文字 体文件尺寸庞大的问题)

目前,支持这一提议的字体公司包括 House Industries , FontShop, Hoefler & Frere-Jones 等,甚至 Typotheque 自己也支持这一提议,Bilak 说,这不是一个非常理想的方案,是一种妥协,虽然仍不能消除字体商的所有疑虑。

而浏览器设计商似乎也愿意参与到这个技术中,尤其当 W3C 接纳该技术成为标准时,不过浏览器设计商至少要等待 W3C 完成系列工作才能提供支持。.webfont 是一种未来的方案,也许要两年或四年,Bilak 说,也有人认为这一过程需要五年或更长时间。

延伸阅读

关于 Web 字体:现状与未来

本文国际来源:http://arstechnica.com/web/news/2009/08/web-font-services-join-fray-as-webfont-format-gains-support.ars
中文翻译来源:COMSHARP CMS 官方网站

从实验室到生产线:Qwen3-Omni后训练技术在实际业务中的落地挑战 本文探讨了Qwen3-Omni后训练技术在实际业务中的落地挑战,重点分析了多模态AI在工业应用中的关键问题与解决方案。通过金融风控、跨境电商等场景案例,揭示了通用模型与垂直需求的矛盾,并提供了知识蒸馏、语音合成优化等实战经验,助力企业实现技术到业务的转化。 阅读详情

相关推荐

基于 SpringAI 整合 DeepSeek 模型实现 AI 聊天对话

很多云平台都提供了一键部署大模型的功能,这里不再赘述(阿里云百炼平台、火山方舟-火山引擎等)Ollama。

📜一个热爱探索的人 1280

关于 Web 字体:现状与未来

有关 Web 字体的话题正在增多,对 Web 设计师来说,他们并不关注技术细节,不管是 TrueType 的 Hinting 技术,还是 OpenType 的 Permissions Tables,他们关心的是我如何在网页中使用某款字体。7月14日至19日,于 Atlanta 召开的 TypeCon 2009 上,人们讨论了如何在 Web 中嵌入字体(Web Font Embedding:

COMSHARP CMS 专栏 1796

MacOS Intel芯片实战:Docker Compose一键部署Dify全流程解析

本文详细解析了在搭载Intel芯片的MacOS系统上,使用Docker Compose一键部署开源LLM应用开发平台Dify的全流程。内容涵盖环境准备、Docker配置与镜像加速、代码拉取与配置初始化、服务启动与问题排查,以及访问验证与初步探索,旨在帮助开发者快速在本地搭建私有化AI应用开发环境。

ik678901234的博客 620

颠覆传统:Unbounded 字体如何重新定义开源字体的未来

在数字设计的世界里,字体不仅仅是文字的载体,更是情感的表达、品牌的延伸。然而,高质量字体的高昂授权费用常常成为设计师和开发者的痛点。Unbounded 字体项目的出现,正在彻底改变这一现状。作为全球首个通过链上资金支持的开源字体,Unbounded 不仅提供了六种字重和可变字体,更重要的是它开创了字体开发的新模式。Unbounded 字体项目由 Web3 基金会支持,采用 SIL 开放字体许可证,

gitblog_01107的博客 901

STM32项目分享:智能家居语音系统

(资料分享见文末)基于STM32的智能家居语音系统温湿度采集:系统通过DHT11模块采集温湿度烟雾监测:通过MQ-2模块采集环境中烟雾浓度光照强度采集:通过BH1750传感器采集环境光照强度窗帘控制:通过步进电机转动模拟窗帘控制风扇控制:通过继电器和指示灯模拟风扇驱动照明控制:通过继电器和指示灯模拟照明驱动蜂鸣器报警:环境烟雾异常情况下蜂鸣器报警OLED显示:显示温湿度、光照强度和烟雾浓度APP功能:使用机智云APP,包括功能有控制照明灯和风扇开关、显示当前温湿度信息。

qq_44016222的博客 4147

别再傻傻分不清了!Anaconda和Miniconda到底选哪个?附保姆级安装与镜像源配置(Windows/Mac)

本文详细解析了Anaconda和Miniconda的核心差异,包括体积、预装内容、系统资源占用等关键维度,并提供了针对不同需求的决策框架。附有Windows和Mac双平台的详细安装与配置指南,帮助用户根据实际需求选择最适合的conda工具,提升开发效率。

weixin_30315723的博客 426

Geist字体未来路线图:从当前版本到未来发展的全面展望

Geist字体家族是Vercel与Basement Studio合作开发的现代字体系统,以其极简几何设计和像素化美学在开发者和设计师中迅速流行。作为一款专为数字时代打造的字体,Geist在代码编辑器、Web界面和品牌设计中展现出独特优势。本文将深入探讨Geist字体的当前状态、技术架构以及未来发展蓝图。 ## 🎯 Geist字体家族的当前成就 ### 现有字体变体概览 Geist字体家族目

gitblog_01028的博客 765

HR离职预测模型实战:可解释、可干预、可落地的三层架构

员工离职预测本质上是组织健康度的早期诊断技术,其核心原理在于从行为、心理与结构数据中识别稳定性衰减信号。该技术的价值不仅在于提升预测准确率,更在于将模糊的‘人才风险’转化为可归因、可干预的具体因子,如工龄阶段、满意度落差、薪酬分位数等。典型应用场景覆盖HRBP主动留任、业务部门梯队预警及HRIS系统智能升级。本文聚焦于构建具备业务可解释性与操作闭环能力的离职预警模型,深度融合HR工作流与机器学习工程实践,尤其强调逻辑回归基线、特征业务化重构及三层递进式架构设计。

赵士杰的博客 388

前端主流技术现状与未来趋势分析

开发者需在追赶趋势的同时,建立对底层原理的深刻理解,才能在高复杂度项目中游刃有余。前端领域的技术迭代不会放缓,但核心逻辑始终围绕。

来了波,兄嘚 1749

CondaHTTPError: HTTP 404 NOT FOUND for url

用conda创建新环境时出现问题了。

qq_40713201的博客 1270

国科大作业考试资料-人工智能原理与算法-2024新编-第十一次作业整理

1、有一位教授想知道学生是否睡眠充足。每天,教授观察学生在课堂 上是否睡觉,并观察他们是否有红眼。教授获得如下的领域知识: (1)没有观察数据时,学生睡眠充足的先验概率为0.7。 (2)给定学生前一天睡眠充足为条件,学生在晚上睡眠充足的概率是0.8;如果前一天睡眠不充足,则是0.3。 (3)如果学生睡眠充足,则红眼的概率是0.2,否则是0.7。 (4)如果学生睡眠充足,则在课堂上睡觉的概率是0.1,否则是0.3。 将这些信息形式化为一个动态贝叶斯网络,使教授可以使用这个网络从观察序列中进行滤波和预

MatsumotoChrikk 1056

Web字体的运用与前景

引自 http://www.font5.com.cn/font.php?id=4 熟悉WEB开发的朋友都明白一个现状:想在网页上显示一种字体,该字体文件本身必须存在于用户的电脑中,由于这个限制,加上 Web 用户可能分散于各种操作系统,只有那些在各种环境都普遍存在的字体才会被用于网页。 目前各种操作系统默认安装的英文字体有 arial、verdana、tahoma 等多种字体,而中文字体仅有宋...

u011927449的博客 162

企业级AI平台架构设计:AI应用架构师的未来趋势

企业级AI平台是AI从“实验室”走向“生产线”的关键,而AI应用架构师就是这条“生产线”的总设计师。未来,随着生成式AI、边缘计算、自治式AI的发展,架构师的角色将越来越重要——他们不仅要构建技术平台,还要连接技术与业务,让AI真正创造价值。“不要做‘只会调模型的工程师’,要做‘能解决业务问题的架构师’。因为,真正有价值的AI,从来不是“最先进的模型”,而是“能落地、能复用、能创造业务价值的平台”。愿你在企业AI转型的浪潮中,成为那个“搭建桥梁的人”——连接技术与业务,连接现在与未来。

小程序开发 973

css 排版_Web排版的未来:CSS字体4级

Web字体为设计注入了生命,帮助我们避免了在Web设计初期广泛使用的系统默认设置。 当今有许多可用的选项,因此我们有很多技巧可以提供和设置自定义字体。 CSS字体模块的第4级概述了您会喜欢的更多有趣的选项,包括一些令人兴奋的属性,例如font-min / max-size。 本文不会揭示第4级的所有细节,而是将重点介绍仍处于起步阶段的有趣部分。 冒险从现在开始! 现状 目前,我们位于两个...

Web design 教程小屋 405

VB摄像头监控

该VB模块可对摄像头捕获的画面进行录像等,可在创建的窗口进行控制

TMS_WebGMaps_1.9.8.0_Full_Source

TMS_WebGMaps_1.9.8.0_Full_Source 全源码 delphi cbuilder

Fontsource未来发展规划:字体生态系统的演进方向和机遇

Fontsource作为一个开源的自托管字体库,正在重新定义现代Web开发中字体资源的管理方式。通过将开源字体打包成独立的NPM包,Fontsource为开发者提供了更高效、更安全、更灵活的字体解决方案。🚀 ## 当前生态现状与核心优势 Fontsource目前已经构建了完整的**字体生态系统**,包含多个核心模块: - **CDN服务** - 通过全球分布式网络和对象存储提供高性能字体分

gitblog_00516的博客 724

汉书HE8,好用的汇编代码编写工具

汉书HE8,好用的汇编代码编写工具早期编写汇编代码所用功能强大

Web字体加载策略解析:自定义字体不影响首屏渲染的终极方案

自定义字体就像是给网页穿上了一件个性化的外衣,能让网页在众多竞争对手中脱颖而出。想象一下,一个电商网页用上了独特的手写风格字体,是不是瞬间就有了温度和故事感?或者一个科技感十足的网页,用上未来感的字体,立刻就能抓住用户的眼球。自定义字体的多样性和独特性,为网页设计带来了无限可能。但美好的事物往往伴随着挑战。自定义字体的加载速度就是一个让人头疼的问题。当网页加载时,浏览器需要先下载字体文件,然后才能渲染文字。如果字体文件太大,或者网络环境不好,这个过程就会变得很漫长。

2501_91889873的博客 1138

pscad IEEE标准系统搭建说明

pscad IEEE标准系统搭建说明,包含典型的IEEE 9节点、14节点、30节点、39节点和118节点系统。内含标准测试系统的原始数据和潮流结果。

ComfyUI中文支持现状与字体显示问题解决办法

本文分析ComfyUI中文乱码的根本原因,指出其前端Canvas渲染机制绕过字体回退策略,导致中文字体无法正常显示。提出从系统安装Noto等开源字体、修改CSS指定font-family、Docker镜像集成字体到嵌入字体文件等多种解决方案,并强调多语言支持对用户体验的重要性。

weixin_33239721的博客 818

Flet 字体实战指南:系统字体、自定义字体导入与可变字体处理

本文是 Flet 官方 Cookbook 中 [Fonts 指南](https://link.gitcode.com/i/50d01974a1bbf75749913ff443dd37d8) 的深度展开,讲解如何在 Flet 应用中直接使用操作系统已安装的字体,以及如何通过 `page.fonts` 属性从外部 URL 或本地资源目录导入自定义字体并应用到整个应用或单个控件。读完本文,你将掌握 Fl

gitblog_01027的博客 424

Google Chrome 将支持 Web 开放字体格式

近日,Chrome 浏览器项目的一条 BUG 跟进消息显示,Google Chrome 浏览器有意部署 Web 开放字体格式,不过,该消息并没说明 Chrome 何时推出该功能。Web 开放字体格式由 Mozilla 发起,旨在让设计者在 Web 中使用自己的个性字体。Web 开放字体格式允许设计者象链接图片那样链接自己的字体文件,并使用该字体显示文字。Web 开放字体格式

COMSHARP CMS 专栏 1441

字体性能优化:Web字体加载的最佳策略

字体性能优化:Web字体加载的最佳策略 【免费下载链接】Front-End-Performance-Checklist ???? The only Front-End Performance Checklist that runs faster than the others ...

gitblog_00979的博客 581

Web 的现状 :网页性能提升指南

技术人员经常会发现自己处于特权状态。随着最新的高端笔记本电脑、手机和快速有线互联网连接 ,很容易让我们忘记 ,这些并不是每个人都有的条件 (实际上 ,真的很少 )。 如果我们从特权和缺乏同情的角度来构建网络平台 ,那么将导致排他性的糟糕体验。 考虑到设计和开发的性能 ,我们怎样才能做得更好 ? 1. 优化所有资源 理解浏览器如何分析和处理资源 ,是显著提高性能的最强大但未充分利用...

xiao_shutong的博客 890

[译] Web 流式文字排版的现状

原文地址:The State of Fluid Web Typography原文作者:Matej Latin译文出自:掘金翻译计划本文永久链接:github.com/xitu/gold-m…译者:Jenniferyingni校对者:smilemuffie, mymmonWeb 流式文字排版可以提升用户的网站阅读体验,但与此同时,它也带来了字体不受控制变大的问题和对浏览器无障碍访问功能使用的影响。那...

weixin_30663471的博客 754

PingFangSC字体:解决中文Web排版难题的完整技术方案

在中文Web开发领域,字体渲染一致性一直是困扰开发者的核心痛点。不同操作系统、浏览器和设备对中文字体的处理方式各异,导致同一网站在不同环境下呈现效果参差不齐。PingFangSC字体包提供了一个开源、免费且专业的技术解决方案,通过提供完整的六种字重和双格式支持,帮助开发者构建视觉统一的中文界面体验。 ## 问题诊断:中文Web排版的三大技术挑战 在深入技术实现之前,我们需要先理解当前中文Web

gitblog_00150的博客 922

软件测试中的人工智能现状:未来会怎样?

人工智能 (AI) 目前是影响和改变许多部门、影响我们日常生活的支柱。 医疗保健、教育、金融、技术和零售等行业正在采用人工智能来高效工作、降低成本和自动化任务。 不仅在这些领域,而且在我们的家中,人工智能正在控制电视、手机、数字助理、家庭自动化和安全摄像头。 由于 AI 不断竞争对我们的生活施加更多控制,因此必须安全可靠地创建和验证所有系统。 这就是用于软件测试的人工智能出现的地方。 本文将讨论如何在软件测试中使用 AI。 随后,我们将了解 HeadSpin 平台及其独有的功能如何帮助实现卓越的软件..

HeadSpinDante的博客 1191

Web 打印在 Firefox 与 Safari:分页与样式差异实录

同一份单据在三个内核下出纸,逐项记录分页和边框差异。本文结合具体场景讲清做法、常见问题与可复用的实现思路。

一天拉了7遍的博客 211
上一篇: Web 设计与开发者必须知道的 15 个站点
下一篇: 开源项目越来越青睐 JavaScript
comsharp
博客等级 码龄20年 1475粉丝 41原创
评论 2
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值