跳到正文

衬线与非衬线

Serif & Sans

初级通用

衬线与非衬线(Serif & Sans)是按字形笔画末端是否带有附加笔形来区分字体的两类形式。了解这个区别,能帮你向 AI 说清界面的文字气质,也能检查中英文字体搭配是否符合预期。

你可能会说:「我想让网站正文读起来稳一些,按钮和导航保持利落,该怎么跟 AI 说清楚字体区别?」

动手看看

SUNDAY NOTES · 周日来信
城市里的慢生活
The Art of Slowing Down
从一杯早茶开始,重新发现街角熟悉的风景。
继续阅读
字体类别

切换字体类别,对照中英文标题的笔画末端和整张卡片的气质;也可以拖动字号,放大观察字形。

衬线字体的笔画末端有额外的收笔形状;英文标题尤其容易看出来。中文则会优先使用设备上可用的宋体类字体。

要点

  1. 1

    先看笔画末端有没有附加笔形

    拉丁字母的衬线常出现在笔画末端,像伸出的小横线或收笔;非衬线没有这类结构。你可以放大看字母的脚和顶端,而不是只凭「古典」或「现代」的感觉判断。

  2. 2

    中文字体只能作近似对应

    中文界面里,宋体、明朝体常被拿来与衬线字体搭配,黑体常与非衬线字体搭配,因为它们的笔画处理有相似之处。但中文笔画结构不同,别把「宋体等于 Serif」当成严格定义。

  3. 3

    选择之后还要检查实际呈现

    字体类别只能帮你缩小方向,不能保证易读。做中英混排时,我们还要看字号、字重、行距和字体回退:如果指定字体缺少中文字形,浏览器换用别的字体,页面可能就和设计稿不一样。

容易混淆的地方

衬线与非衬线说的是字形结构,不是「正式」与「轻松」两种固定风格;同属非衬线的字体,看起来也可能差很多。它也不等于排版:字体选对了,段落太宽或行距太挤,阅读仍会吃力。我们可以先用它确定字体方向,再用排版调整阅读体验。

什么时候用

适合用

  • 做内容较多的网站时,用衬线与非衬线说明标题、正文各自的字体方向,再检查长段文字的阅读效果。
  • 做中英混排的 App 时,用这组术语和 AI 讨论字体搭配,并检查缺字后的回退效果。
  • 给后台界面建立字体规范时,先确定常用界面文字的字体类别,让页面保持一致。

不适合用

  • 页面的问题只是文字太小、行距太密时,先调整字号和行距;换字体类别解决不了尺寸问题。
  • 图标按钮让人看不懂用途时,先补文字标签或提示;衬线与非衬线帮不了用户辨认图标含义。
  • 中英文显示成乱码或方框时,先查字符编码与字体覆盖范围;这不是选衬线还是非衬线的问题。

练一练

你让 AI 给一款中英混排的阅读 App 选字体。它提议「中文用宋体,英文用衬线字体」,但手机上部分英文看起来像另一套字。你下一步怎么判断?

让 AI 帮你做

请为这个中英混排的阅读页面选择字体:正文优先考虑中文宋体或明朝体与英文衬线字体搭配,导航和按钮优先考虑非衬线字体。请列出实际字体、回退顺序,并检查字号、字重和行距;如果项目现有字体不支持,请说明替代方案。

接下来学什么