文章摘要
字号层级：构建视觉引导的核心逻辑 UI排版中的字号层级并非简单的字体大小变化，而是信息优先级的视觉翻译。在移动端界面设计中，正文通常维持在14px至16px之间，这是经过大量用户测试验证的舒适阅读区间，既能保证清晰度，又不会因字体过大而占用过多屏幕空间。标题字号则需根据重要性设置梯度，一级标题通常在20px至24px，二级标题在18px至20px，这种严密的等差或等比数列关系，能让用户在扫视页面
字号层级：构建视觉引导的核心逻辑
UI排版中的字号层级并非简单的字体大小变化，而是信息优先级的视觉翻译。在移动端界面设计中，正文通常维持在14px至16px之间，这是经过大量用户测试验证的舒适阅读区间，既能保证清晰度，又不会因字体过大而占用过多屏幕空间。标题字号则需根据重要性设置梯度，一级标题通常在20px至24px，二级标题在18px至20px，这种严密的等差或等比数列关系，能让用户在扫视页面时迅速捕捉核心内容，降低认知负荷。
层级之间的从属关系需要通过严密的数学比例来维持，而非凭感觉随意设定。业界通用的比例系数多为1.25倍或1.33倍，例如当正文为14px时，二级标题设为17.5px或18px，一级标题设为22px或24px。这种严密的数学逻辑确保了视觉节奏的一致性。若完全依赖主观判断，极易导致层级模糊，使界面显得杂乱无章。设计师应建立严密的字号规范表，明确每一类文本对应的像素值，确保跨页面、跨组件的绝对统一。
行距与留白：呼吸感的量化标准
字号的变化必须结合严密的行高设置，才能形成舒适的阅读流。对于中文排版，行高通常设置为字号的1.5倍至1.8倍。若字号为14px，行高设定为21px至24px能提供最佳的视觉缓冲。过小的行高会让文字粘连，产生压抑感；过大的行高则会切断句子的视觉联系，增加阅读时的跳跃成本。这一比例标准在iOS Human Interface Guidelines及Material Design中均有明确的数据支撑，是经过长期验证的最优解。
留白不仅是背景填充，更是划分信息区块的关键手段。段落之间的间距应大于行间距，通常设置为20px至32px，以形成清晰的视觉隔离。在卡片式设计中，卡片内部的内边距（Padding）与卡片间的外边距（Margin）需遵循统一的网格系统。例如，内边距常设为16px，外边距设为12px或16px。这种严密的间距逻辑，使得界面在视觉上呈现出有序的节奏感，用户视线能够顺畅地在不同区块之间移动，避免视觉跳跃带来的断裂感。
字重与色彩：强化层级的从属关系
在确定字号与间距后，字重是区分信息层级的另一大杠杆。正文通常使用Regular或Medium字重，而标题则使用Bold或Semibold。这种粗细对比能在不改变字号的情况下，显著增强标题的视觉冲击力。在深色模式或复杂背景下，字重的选择更为关键，较粗的字重有助于提升文字的可读性。设计师需建立严密的字重规范，明确每一类文本对应的字重值，确保视觉层级的一致性。
色彩在层级设计中扮演着从属与强调的角色。正文通常使用高对比度的中性色，如深灰色（#333333或#1D1D1F），以确保最佳的可读性。辅助信息或次要内容则使用低对比度的浅灰色（#666666或#8E8E93），通过色彩的明度差异，自然地将次要信息推至从属地位。这种基于色彩明度的层级划分，符合视觉感知的基本规律，能有效引导用户的注意力流向。
跨页连贯性：视线流动的无缝衔接
跨页连贯性设计的核心在于减少用户的认知断点。在长列表或分页内容中，页面间的元素对齐、间距一致以及色彩风格的延续，能营造出“单页延伸”的错觉。例如，卡片之间的间距在不同页面中保持完全一致，标题的左对齐位置固定，用户视线在翻页时无需重新寻找视觉锚点。这种设计逻辑基于格式塔心理学中的“连续性原理”，人类视觉倾向于将连续、对齐的元素视为一个整体。
页面间的过渡动效也需服务于连贯性。平滑的滚动过渡或轻微的缩放效果，能暗示内容的延续性，而非割裂感。在技术实现上，确保不同页面的CSS或布局代码逻辑一致，避免因样式差异导致的视觉跳变。设计师需像编辑书籍一样思考排版，关注章节之间的衔接，确保用户在翻阅过程中，注意力不会被突兀的视觉变化打断，从而实现真正的极致流畅。