大多数字体建议是为散文写的——一行行小写字母,供人从容阅读。高性能应用生活在另一种体制里:按列扫视的数字、扫一眼就必须读对的标识符、有人一盯就是八小时的屏幕上的十一像素标签。一款在随笔里赏心悦目的字体,放到交易屏幕上可能是切实的危险。以下才是应该审问的问题。
数字优先,字母其次
在数据密集型界面里,干大部分活的是数字,所以先审计数字,再看其他一切:
- 等宽数字(tabular figures)没有商量余地。 每个数字同宽,列才能对齐,一个跳动的数值才不会晃动它的邻居。CSS 只需一行——
font-variant-numeric: tabular-nums lining-nums——但前提是这款字体拥有该特性。许多时髦字体并没有。 - 要齐线数字,不要旧式数字。 带升部与降部的旧式数字在散文里是美,在表格里是混乱。
- 跨字重宽度稳定。 如果粗体数字比常规体更宽,每一个被强调的单元格都会撑破它所在的列。最好的界面字体把所有字重画在同一宽度上——而可变字体的字灰度(grade)轴(改变字重却不改变宽度)是最干净的解法,《Universal Web》讲可变字体的章节对此有详细讨论。
界面字母表
界面里满是必须一次读对的字符串:订单号、git 哈希、API 密钥、金额。对它们而言,易混淆字符集就是全部战场——0/O、1/l/I、5/S、8/B。在看任何一页字体样张之前,先在生产字号下测试它们。能通过的字体往往会主动宣示:斜线零或点式零、带尾的 l、开放的字怀。这与《Universal Web》为低视力读者所做的字形易读性解剖是同一套论证——一个 11px 的界面让每个用户都处于低视敏度状态。
清单
一款候选字体在进入应用之前,我实际会让它过这几关:
1. 排一张真实的表格——真实数据,开启 tabular-nums——盯着一个数值跳动。除了数字本身,什么都不许动。
2. 字母表测试:0O 1lI 5S 8B rn/m,在最小的生产字号下,两种主题都要测。
3. 11–13px 下的 x字高。 x字高偏小的字体,恰好会在界面所处的字号区间里溃散。慷慨的 x字高等于白赚有效字号。
4. 深色主题下的字重。 深底浅字读起来会显得粗半档字重;如果字体没有字灰度轴或更细的字重来补偿,每个标签都会发虚。(深色模式章节解释了其中的物理原理。)
5. 特性排查:tnum、lnum、zero、case——检查实际存在的 OpenType 特性,而不是营销页面暗示的那些。
6. 性能重量级。 以上一切必须装进一两个 WOFF2 文件里,小到不至于堵住它所标注的数据——这是下一篇文章的主题。
这份清单里的模式,就是这整门学科的模式:在应用里,衡量排印的标准是每像素预防的错误数,而不是每页样张的美感。选择那款在一万次连续读取中都未被注意到的字体。