衬线与非衬线Serif & Sans
你可能会说
标题想要那种笔画带小装饰的字体,正文用干净点的。
衬线与非衬线是按笔画末端是否带有装饰来区分的两类字体风格Georgia 和中文宋体属于常见衬线字体,系统黑体属于常见非衬线字体;两类都可用于标题或正文。选择时要测试中文和西文覆盖、正文可读性、品牌需求与加载性能,不能只凭“衬线优雅、非衬线现代”的固定印象。
什么时候用
- 为标题与正文分别测试:衬线可用于展示性标题,前提是语言覆盖、尺寸和品牌语境合适设计的气质衬线大标题,自带编辑感
- 需要正式或编辑感时,用样张对照:字体不会天然证明可信,信息层级、内容和品牌同样重要恒丰私人银行金融、律所:衬线 = 可信赖
- 为界面与正文选可读字体:非衬线常见,但衬线同样可能适合;重点测试字号、行高、字重和语言覆盖项目名称负责人界面用非衬线:干净、高效、读得快
- 引文或强调内容可用不同字族形成层级,但要保持规则一致并验证可读性“好的设计是尽可能少的设计。”引文可用不同字体形成对比,但仍需匹配语言与语境
什么时候不用
- 长正文使用小字号衬线:细节容易模糊,影响阅读这是一段用小字号衬线字体排版的长正文。在当前屏幕和字重下,笔画细节不够清楚。
- 效率工具使用衬线大标题:应先确认它与产品调性和阅读效率相符服务器监控大盘正常告警 3工程工具硬凹优雅,气质错位
- 衬线只写 Georgia 未提供中文 fallback:中文会回退为浏览器默认字体Vibe 设计指南
- 同级标题混用衬线与非衬线:应建立明确的使用规则本月目标数据看板团队成员同级标题两种字体混用,气质分裂
组成结构 · Anatomy
Ag衬线字体:横细竖粗,末端带小脚Ag
笔画末端的小装饰,优雅感来自这里
衬线字体横细竖粗,有书写感
去掉装饰、粗细一致,干净现代
常见变体 · Variants
衬线大标题Serif Display
品牌故事
品牌页、内容站要优雅编辑感
非衬线正文Sans Body
界面正文用系统字体,干净高效读得快。
界面正文,现代干净又高效
衬线点缀引文Serif Quote
“细节里藏着气质。”
引文格言做点缀,少量提神
典型使用场景
品牌官网大标题
杂志与内容平台
巷口那家面包店,为什么排队十年
美食周刊 · 林小满 · 12 分钟前
编辑部精选
凌晨四点的城市档案馆
手冲咖啡的黄金两分钟
产品界面与正文
项目设置
项目名称
负责人
引文与格言点缀
我们做工具的人常忘记:用户要的不是功能清单,而是把事情做完的确定感。
“好的设计是尽可能少的设计。”
—— Dieter Rams
添加按钮前,先确认它是否对应用户需要完成的明确操作。
延伸阅读 · 权威出处