写作

论字体排印与 Web

·4 min read

本页面借助 AI 辅助翻译。英文原文为权威版本。

文字的恒久

字体排印是 Web 上最根本的设计决策。在色彩之前、版式之前、动效之前——先有文本。而文本的排布方式决定了是否有人会去读它。

这不是什么新观点。但它总是被一层层抽象所掩埋。设计系统给了我们 token。工具类框架给了我们 class。AI 工具给了我们版式。而在这层层堆叠之中,排字这门真正的手艺——带着意图去选择字号、字重、行宽、行距和层级——被简化成了套用默认值。

默认值并不坏。但没有理解支撑的默认值只会产出平庸的结果。

好的网页排印需要什么

好的网页排印需要在为数不多的几件事上持续用心:

  • 行宽——行的长度比多数开发者以为的更重要。每行 45–75 个字符不是一条建议;它是阅读变得舒适的区间。超出它,理解力就会下降。
  • 行距——行高需要响应行宽。更长的行需要行与行之间更大的间距。短行可以排得更紧。不存在唯一正确的数值。
  • 字号比例——一套排印比例尺无需嘶喊便能建立视觉层级。正文、小标题与标题之间的关系应当让人觉得理所当然,而非随意为之。
  • 字重——加粗不等于强调。它只是强调的工具之一。斜体、字号、颜色、间距和位置都在起作用。一遇到层级问题就伸手去拿 font-bold,是一个值得改掉的习惯。
  • 留白——文本周围的空间与文本本身同样重要。慷慨的页边距、经过考量的内边距,以及段落章节之间的呼吸空间,传递着品质感,也在邀请阅读。

排印即无障碍

好的字体排印就是无障碍的字体排印。足够的对比度、可读的字号、充分的行距、合适的行宽——这些不是审美偏好。它们是决定人们能否使用你所构建之物的功能性要求。

"好看"与"人人可用"之间的重叠,比多数人想象的要大。当你为易读性做优化时,几乎总会同时改善视觉设计。

手艺长存

框架会更迭。设计潮流会轮回。但优秀排印手艺的原则几个世纪以来一直稳定。投入精力去理解它们——不只是应用它们,而是理解它们为什么有效——是网页设计师或开发者所能做的杠杆率最高的事情之一。

Web 在其内核上是一种排印媒介。以这种方式对待它,既是一种设计立场,也是对阅读你所发布内容的人的一份敬意。