本页面借助 AI 辅助翻译。英文原文为权威版本。
本章 2005 年的版本做了那个时代每一本指南都做的事:点名推荐。Verdana、Georgia 及其同侪——微软为屏幕委托设计的核心网页字体——在设计师只能依赖用户机器上预装字体的年代,是站得住脚的推荐。二十年后,这一约束已不复存在。网页字体加载可靠,可变字体成为主流,可用字体的目录从十几款增长到数万款。开列一份短名单不再有用;传授选择标准才有用。
这一转变也更诚实。旧的短名单之所以好,并非因为那些字体有魔力,而是因为它们体现了具体的、可检验的属性:宽裕的x字高、开放的字腔、略松的字距,以及为经受粗糙渲染而绘制的字形。这些属性——大体上就是原章节引用的 Boyarski 时代的标准——仍是正确的检验方法,而且几分钟内就能应用于任何候选字体。
2005 年以来的变化
三件事。首先,投送问题消解了:@font-face 与 WOFF2 压缩让交付选定字体成为常规操作,"默认屏幕字体"与"嵌入字体"不再是有意义的不同类别,原章节担忧的授权问题也在很大程度上被网页授权规范与开源字体所化解。
其次,出现了一类专门打造的"无障碍字体"。其中有些是严肃的努力:受 Braille Institute 委托设计的 Atkinson Hyperlegible,为低视力读者夸大了常被混淆字符之间的区别。Lexend 的设计基于这样一个假说:更宽的间距与特定的比例能改善阅读流畅度。APHont 由 American Printing House for the Blind 开发,用于低视力的印刷与屏幕场景。Luciole 在法国专为视障读者设计。这些都是研究过问题的人做出的真实项目。
第三——这是必要的告诫——证据基础没有跟上营销的步伐。对阅读速度和理解力的独立研究普遍发现,读者之间的个体差异淹没了合格字体之间的差异,而熟悉度本身就是一个易读性因素。尤其是围绕阅读障碍专用字体的高调宣称,在受控研究中屡次未能复现:这类研究中的阅读障碍读者使用专门的阅读障碍字体时,阅读速度普遍并不比使用普通疏朗字体更快,而且往往更偏爱熟悉的字体。"为无障碍而设计"是一种设计意图,不是结果保证。要依据可见、可检验的属性来选择,而不是依据标签。
真正重要的标准
第一版的清单经受住了时间的考验;以下是更新并使之可检验的版本。
- 字符区分度。 输入字符串 Il1,再输入 0O,再把 rn 与 m 并排、cl 与 d 并排。大写 I、小写 l 与数字 1 必须一眼可辨——通过衬线、带尾的 l 或平顶的 1。这是最快的单项淘汰标准,许多流行的几何无衬线体都过不了这一关。
- 开放的字腔。 a、c、e、s 的开口应当宽阔。封闭的字腔会让 e 在模糊、小字号或低视力条件下向 o 塌缩。
- 宽裕但有度的x字高。 较大的x字高放大了承载字母大部分特征的部分。走极端会适得其反:当x字高挤压升部时,h 与 n 开始趋同,d 与 a 失去区分。
- 舒适的字距。 正文字号下略松的间距,胜过时髦的紧排。还要验证该字体能承受用户增加字母间距(WCAG 1.4.12)而不至散架。
- 适中的笔画对比与结实的连接处。 高对比的现代衬线体在小字号和低分辨率下会丢失细笔画。中等、近乎等线的字重渲染更可靠。
- 双层 a、可辨识的 g、无歧义的字形。 字形应在构造上有别,而不仅是细微差异。镜像字母对(b/d、p/q)受益于不对称的细节。
- 真正的意大利体和可用的粗体。 如第 1.3 与 1.4 章所述,你会需要诚实的强调样式;缺少它们的字体家族会迫使软件合成。
系统字体栈与熟悉度红利
现代系统字体栈——Apple 平台的 San Francisco、Windows 的 Segoe UI、Android 的 Roboto,经由 font-family: system-ui 调用——值得专门称赞。这些字体为其平台的渲染而精心打造,随附完整字重与真正的意大利体,加载零成本(这一性能优势在慢速网络上本身就是无障碍优势),而且是读者整天都在看的字体。熟悉度是可以衡量的易读性资本。系统字体栈从来不是令人兴奋的选择,但对于应用界面和实用性文本,它几乎无可指摘。
至于编辑气质的表达,诚实的立场是:许多普通而精良的正文字体——人文主义无衬线体与结实的正文衬线体皆然——都能满足上述全部标准。前面点名的无障碍取向字体也是合理的候选,尤其是在低视力读者是主要受众时的 Atkinson Hyperlegible。关键在于,这一选择要对照标准、对照你实际的渲染目标、在你实际使用的字号下经过检验。
CSS 实践
/* Criteria first, then names: distinct Il1/0O, open apertures */
body {
font-family: "Atkinson Hyperlegible", Seravek, Verdana,
system-ui, sans-serif;
font-size-adjust: 0.53; /* keep fallback x-heights consistent */
}
建议
- 按标准选择,而不是按名字或"无障碍"品牌宣传:亲自测试 Il1、0O、rn/m、字腔开放度与字距。
- 把专门的无障碍字体当作必须通过同样测试的候选——有几款(Atkinson Hyperlegible、Lexend、APHont、Luciole)是可信的;没有一款是灵丹妙药。
- 对阅读障碍字体的宣称保持怀疑;受控研究并未支持其阅读速度上的益处,而疏朗的普通字体表现相当。
- 衬线还是无衬线不是问题所在;构造质量才是。
- 放心地将系统字体栈用于界面与实用性文本——熟悉度和渲染质量是实实在在的优势。
- 任何你采用的字体家族都必须有真正的意大利体和至少一档扎实的粗体。
- 在最终确定之前,验证你的选择能经受 WCAG 文本间距调整、200% 缩放以及你在生产环境中的最小字号。
- 当字体、渲染环境或受众发生变化时重新测试——标准是稳定的,但通过名单不是。