MODULE 04 / LESSON 02
字号阶梯:建立稳定的文字角色
用有限的字号表达页面、章节、正文和辅助信息。
先理解这个概念
字号阶梯是一组可复用的文字角色。可以用比例生成候选值,再根据中文阅读与产品密度调整。字号比例是起点,不是标准答案。正文必须在目标设备上可读,也要尊重用户放大设置。
字号阶梯首先是角色系统,然后才是比例计算。正文、辅助说明、卡片标题和页面标题各自承担不同职责;同一角色应稳定,同样大小的文字也可以通过字重和位置区分。机械地按比例无限生成字号,会产生难以维护的样式,却不一定形成清楚层级。
像枚举类型:把随意的数字收敛为 title、heading、body、caption 等语义角色。
记住这三个原则
- 01
先设正文,再决定标题与辅助信息。
- 02
不要为每个卡片发明新字号。
- 03
搭配字重和间距建立层级,不只依赖字号。
实际设计时,分三步做
- STEP 01
先列实际文字角色,为每种角色定义字号、行高、字重和用途。不要只交付一列数字。
- STEP 02
在最常见页面组合这些角色,检查标题是否压过正文、辅助信息是否太弱,以及相邻层级是否真的可区分。
- STEP 03
为窄屏设置必要变化,优先让大标题缩小或换行,保持正文的可读基础,不把整套字号按屏幕比例缩放。
一个容易理解的例子
一个页面出现 15、17、19、21、23、26、29 等大量相近字号。
收敛为正文 16、章节 24、页面标题 36 等少量角色,次要标签保持可读。
差异更明确,维护时也不必逐个猜测数值。
展开看:从场景到设计决定
假设正文采用 17px,卡片标题 21px,章节标题 26px,页面标题 40px,这是一组练习起点而非标准答案。长课程名在手机上可以降低页面标题字号并允许多行,正文继续保持阅读尺寸。日期不应因为“层级低”被压到难读;可以减少字重、移到辅助位置。先验证角色,再微调数值。
适用边界与取舍
营销海报的大幅字号差异未必适合高密度工具。阶梯应覆盖任务所需层级,不必让每一级都出现在每一页。
把这个原则用一次
先做一个小判断
在排版实验里调整比例,比较文章页与工具页。
再完成一份设计练习
为设置页和文章页共用一套五种文字角色,说明哪些角色共享、哪些只在文章页出现。
不要机械地把整套黄金比例应用到所有文字。
继续查阅
本课为原创教学解释。具体平台规则与标准可查阅官方资料。
Apple Human Interface GuidelinesMaterial Design 3