字体与版式基础

衬线体在笔画末端有装饰性的小脚，源于石刻与活字传统，笔画粗细变化丰富，长文阅读时衬线能引导视线横向移动，传统上用于书籍、报刊正文，气质经典稳重。无衬线体去掉装饰，笔画粗细相对均匀，结构简洁几何，在小尺寸与低分辨率屏幕上识别度更稳定，因此成为界面设计的默认选择，气质现代、中性、工业。需要说明的是屏幕分辨率提高后衬线体在移动端长文阅读并不必然更差，选择更多是品牌调性问题：金融、法律、奢侈品偏好衬线的信任感与历史感，科技、工具类产品偏好无衬线的干净利落。中文字体对应的是宋体与黑体之分，道理相同。实际项目还要考虑字重家族是否完整、授权范围与加载性能，而不只是风格好看。

字号层级是通过有规律的字号差异来传达信息重要性的系统。层级的作用是让用户扫视时先看到什么、后看到什么一目了然，如果字号随意设定，页面会失去阅读秩序。一个典型界面通常需要五到七级：一级页面标题、二级区块标题、三级小节标题、正文、次级说明文字、辅助标签与角标。层级之间要有明确的跳跃感，相邻层级差异太小则拉不开，通常正文字号十四到十六像素，小标题加粗放大到十八到二十，大标题二十四以上。除了字号，层级还由字重、行高、颜色与留白共同完成，只靠字号会显得笨拙。最佳实践是把这些字号定义成设计令牌，全产品统一调用，避免出现同一个层级七八种字号的失控局面。面试时能说出层级与令牌的关系，会显得有系统思维。

行高即一行文字的垂直间距，行宽是一行能容纳的字符数。行高太小时上下行文字互相干扰，视线容易串行；行高太大则行与行失去归属感，回行费力。经验值是正文行高为字号的约一点五倍，中文因字形方正可略高，取一点五到一点八，而大标题用一点一到一点二即可紧凑有力。行宽方面，理想范围是每行中文约二十五到四十个字、英文约四十五到七十五个字符：过宽导致视线移动距离长、回行找不准下一行开头；过窄则频繁换行打断阅读节奏。移动端窄屏应适当放宽行高补偿。此外段落间距应大于行高间距以区分段落，左对齐优于两端对齐（中文两端对齐可接受但要处理标点悬垂）。这些细节叠加起来，就是长文页面舒适与否的差异所在。

中英混排的细节主要有六类。一是间距规范，中文与西文、数字之间应有约四分之一到三分之一字宽的间隙，可以用排版引擎自动加空或手动半角空格，完全贴在一起会显拥挤。二是标点规则，中文用全角标点，避免中英标点混用，引号与省略号要统一；遇到行首行尾的标点应遵循避头尾规则，句号逗号不能出现在行首。三是字体回退，西文与数字应优先使用西文字体渲染，直接用中文字体的内嵌西文通常偏宽难看，可设定西文字体优先、中文字体兜底的字体栈。四是基线协调，两种字体默认基线与字面高度不一致，混排可能高低不齐，需要微调。五是数字与单位之间留空，如百分之二十与二十公斤的写法统一。六是全角半角冲突，括号破折号用错宽度会破坏节奏。这些细节是中文设计师的基本功，面试时常被拿来考察专业度。

可变字体是 OpenType 的一项规范扩展，它把一个字体家族的多个变化轴打包进单个字体文件，通过字重、字宽、倾斜甚至光学尺寸等轴的参数连续插值出任意中间形态。它解决的问题有三层。一是文件体积，传统方式需要在网页加载三百、四百、五百等多个字重文件，可变字体一个文件覆盖全部，网络开销显著降低。二是设计自由度，设计师不再被固定的五到七个字重限制，可以用五百五十这样的精细字重做微调，也能做字重随滚动渐变的动效。三是响应式排版，光学尺寸轴可以让同一字体在小字号更开放、大字号更紧凑，提升不同设备的阅读质量。使用时注意浏览器兼容性已经很好，但部分设计工具对轴的支持有限，需要在工作流中验证。面试中谈到性能与排版精度的平衡时，这是一个能体现技术视野的话题。