字体设置进阶指南：从基础参数到隐藏文字的实用技巧

上次帮朋友排一套产品手册，我差点被“字体基础设置”逼疯。微软雅黑默认行距在导出PDF后挤成一团，标题字距怎么调都不对劲，最离谱的是我把一段备注用隐藏文字藏起来，对方打印出来时它又明晃晃出现在纸面上。后来我才意识到，很多人对字体的理解停留在“选个好看的字体”这一步，根本没搞懂字体基础设置、高级设置与隐藏文字之间的关系。这篇内容我就把这些经验梳理一遍，从最基础的字号字重，到OpenType特性、可变字体、字距微调，再到隐藏文字的各种玩法与坑，一次讲清楚。无论你是用Word写报告、做PPT，还是在写网页调CSS，甚至是在PS/InDesign里做设计物料，这些内容应该都能帮上忙。

1. 字体基础设置：先把底子打好

字体基础设置是所有文字排版工作的起点。这里说的“基础”不是让你背几个字体名称，而是要把字号、字重、行距、字距之间的关系真正理顺。我看了很多排版混乱的项目，根子上不是审美不行，而是这几个基础参数在互相打架，比如行距设置成了固定值导致中文字被裁切，或者同一页面里混了七八种字重看起来像补丁。

1.1 字号、字重与字族的选型逻辑

字号这个事，不同场景有不同规矩。常见的中文正文，Word里小四（12pt）是标准起点，印刷物料里正文常用9pt到10.5pt，网页端基准字号一般是16px。需要注意一个细节：中文字形在相同磅值下通常比西文字形视觉尺寸更大，所以要混排中英文时，英文部分适当降1pt或者选择同字族里略微收敛的字重，观感才平衡，比如中文用12pt时，英文可以设在10.5pt到11pt之间，小细节，但效果差异非常明显。

字重方面，常规的中文字体家族通常包含Light、Regular、Medium、Bold这几个档位。正文推荐Regular，标题用Medium或Bold就够了。不少人在正文里用Bold，以为这样“重点突出”，结果整页字面变得又黑又堵。我自己的习惯是：正文和标题之间用字重拉开层级，比如正文Regular，一级标题Bold，二级标题Medium，三级标题用加粗的正文，这样不用增大字号也能做出清晰的信息层级，页面不躁。

字族选型更关键。先分清衬线（serif）和无衬线（sans-serif）两条路线。中文长文阅读，像思源宋体、宋体这类衬线字体更利于视线在字间移动；屏幕展示、演示文稿、网页UI则优先无衬线，也就是微软雅黑、苹方、思源黑体这条线。Windows下默认的微软雅黑在低分辨率屏幕上的抗锯齿表现尚可，但放在印刷物里会显得单薄，所以印刷项目我一般换成思源黑体或方正书宋。记住一个原则：一个项目里字族控制在2到3种以内，正文一种，标题一种，最多再加一个强调字体，再多就像超市打折海报了。

1.2 行距、字距与段落间距的联动关系

行距这块，中文排版我一般用1.4到1.7倍行距，正文在Word里最省事的做法是设置“1.5倍行距”再根据版面微调。要注意的是，Word里“固定值”行距是个坑，如果你把行距固定为20磅，一旦某个段落里出现大字号或公式，文字就会被裁掉一半，切换到“最小值”或“多倍行距”能避掉这个问题。印刷排版中，9pt正文配14pt左右的固定行距比较常见，InDesign里我常用自动行距，它通常是字号的1.4倍左右，配合“罗马字距”选项基本不会出大错。

字距分两种理解，一种是整体字距调整，专业说法叫tracking，另一种是特定字符对之间的调整，即kerning。中文正文的字距平时保持默认0就好，不要为了“透气”去拉大，一拉大满篇中文就像散架一样。标题则相反，尤其是有一定磅值的大标题，适当增加tracking可以让它更有呼吸感，但不建议超过原始磅值的百分之十到十五，比如36pt的标题，整体字距加到2到4之间就差不多了。段落间距要和行距联动考虑：如果行距已经是1.5倍，段落之间的间距不需要再单独加很多，否则页面会失去连续性。中文段落首行缩进两个字符，Word里在“段落-缩进-特殊格式-首行缩进-2字符”设置，这个习惯对长文档非常友好。

还有一个经常被忽略的细节：段距不要用连续回车来实现，要改段落格式里的段前段后值。回车撑出来的“假段距”一旦调整行距或字体大小就会全面漂移，后面改版会非常痛苦。

2. 字体高级设置：从“能用”到“好用”

基础设置解决的是“看得清、不难受”，高级设置追求的才是“精致、专业”。在Word的“字体”对话框里，“高级”选项卡常年被人忽略；PS/InDesign的字符面板里，右上角菜单还藏着大量OpenType选项。这部分我分成两条线讲：一条是排版软件里的字距与OpenType特性，另一条是Web端字体的高级控制。

2.1 OpenType特性与连字开关

OpenType是一个字体格式规范，它不只是把字形轮廓包在文件里，还内置了很多排版特性，需要软件主动调用才能生效。最常用的几个特性包括标准连字（liga）、等宽数字（tnum）、旧式数字（onum）、小型大写字母（smcp）等。

标准连字在英文排版里非常关键。像fi、fl这类字母组合，如果直接用原始字形，f的顶部钩子会和i的点打架，视觉上很糟心。开启liga后，字体会自动替换成连字字形，阅读更顺滑。很多人第一次在Word里看到fi连在一起，以为是乱码，其实是连字在起作用。如果你或你的领导觉得这个“不对劲”，可以在字体高级设置里关掉“OpenType功能”里的连字选项。

再说数字：表格里的数字推荐用等宽数字tnum，它会强制每个数字占同样宽度，这样一列数字上下对齐才整齐。在正文叙述里，反而可以用比例数字，也就是默认模式，看起来更自然。InDesign里切换很方便，选中文字后打开字符面板右上角的菜单，在OpenType子菜单里勾选就行。CSS里对应的是font-feature-settings: "liga", "tnum";，但要注意，这个属性的取值在不同浏览器里兼容性有些差异，建议结合font-variant-numeric等更语义化的属性一起使用。

再补充一个小技巧：英文标题里想用小型大写字母，直接在Word的“高级-OpenType功能”里选“小型大写字母”，比手动把小写字母调成小字号再改大写更专业，而且字体换了也不会错位。

2.2 可变字体与字距微调（kerning）

可变字体是这几年比较值得关注的趋势。一个可变字体文件可以包含从细到粗、从窄到宽的多套字形，用一条连续的“轴”来控制，比如weight轴从100到900任意取值。这样设计网站时，同一字体家族里不同字重可以共享一个文件，加载速度提升非常明显。如果你在做Web项目，可以在Google Fonts上找一些支持可变字体的中英文字体，用font-weight直接设一个中间值，比如wght=500.5，传统静态字体做不到这种精度。

字距微调方面，需要区分kerning和tracking。tracking是“全局字距”，作用于一段文字的所有字符；kerning是“特定字符对间距”，针对AV、To、Va这类字母组合。大部分排版软件的默认字距已经经过设计师调校，日常正文不需要动。但在大字号标题里，我会把字距模式调到视觉字距（optical kerning），让软件根据字形轮廓计算间距，再手动检查几个明显不协调的字组。比如Av这个组合，很多字体默认的负间距不够，放大后显得空洞，我就手动把这两个字符的字距调小2到4个单位。中文大标题我一般不用kerning，直接拉整体tracking，控制在0到50之间，超过这个数会有松散感。

这里要特别提醒：在中文段落中，千万不要为了“居中好看”而用tracking把所有字符强行拉宽。全角标点被拉宽后，逗号句号的视觉重量会异常，整段文字读起来非常累。

2.3 在Web CSS里的高级字体设置

网页字体设置和办公排版最大的区别在于，你要考虑加载失败、系统差异、屏幕渲染三个问题。最基础的做法是给body设置一组“系统字体栈”，尽量用操作系统自带的字体，避免额外加载字体文件。比如：

body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang SC", "Microsoft YaHei", sans-serif; font-size: 16px; line-height: 1.6; font-feature-settings: "liga", "tnum"; }

这样写的好处是：Mac优先用苹方，Windows优先用微软雅黑，都没有就退到通用无衬线，无论在哪个平台打开都不会出现“字体很丑”或者“变成方框”的尴尬。

如果你坚持要用某个品牌字体，就需要引入Web Font。中文Web字体文件往往好几兆甚至十几兆，不建议整包引入。更稳妥的做法是使用字库服务商提供的按需子集化方案，或者只截取用到的文字做成子集字体文件。另外，字体授权问题要提前确认，商业项目使用非免费字体要特别谨慎。CSS里的font-feature-settings属性可以开连字和等宽数字，但建议用font-variant组合替代，因为后者更符合未来规范，可读性也更好。

3. 隐藏文字：看不见却有大用途

隐藏文字听起来像小把戏，实际上用好了是效率放大器。它的核心机制一句话就能说清楚：文字内容依然存在于文件里，只是被设置为不可见。基于这个机制，你可以实现很多微妙的需求，比如在文档里塞备注而不影响正式内容的阅读，在网页里实现折叠展开，在PDF里保留可以被检索和复制的文本层。但如果不了解它的行为细节，也很容易踩坑。

3.1 隐藏文字的本质与实现方式

先说Word里的实现。选中文字，按Ctrl+D打开字体对话框，在“字体效果”里勾选“隐藏”，文字会直接从屏幕上消失。想让它重新显示有两种方式：一种是用快捷键Ctrl+Shift+H再次切换，另一种是在“文件-选项-显示”里勾选“始终在屏幕上显示这些格式标记-隐藏文字”。这里有个关键区别：取消“隐藏文字”勾选只是让文字可见，并不会把你套用的隐藏格式删掉；如果你想要彻底恢复普通文字，需要选中后再按一次Ctrl+Shift+H或者取消勾选。我经常看到有人把整段内容设置了隐藏，后来又忘了哪些是隐藏的，导致文档里凭空多出几段看不见的文字，最终打印时全部冒出来。

CSS里隐藏文字的花样就更多了。display:none是把元素彻底移出渲染层，就像文档里不存在一样，但这种做法对屏幕阅读器也不友好。visibility:hidden只是隐藏视觉，元素还在布局里占位。无障碍优化里最推荐的是“裁剪到1像素”方案，也就是所谓的sr-only，它让视觉读者看不到，但屏幕阅读器仍然能读到，同时不会影响布局。下面这组样式是业界通用做法：

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

在PDF和设计软件里，隐藏文字的形态更特殊。OCR过的PDF通常会包含一个隐藏文本层，视觉上你看到的可能是扫描图片或有版式的文本，实际可供复制检索的内容在这个隐藏层里。InDesign里想藏文字，可以放到一个不打印的图层，或者把文字颜色改成纸色，但这些方式一旦导出PDF就要非常小心。

3.2 隐藏文字的实战场景

最实用的场景之一是文档备注。你可以把给团队看的说明、解释性注释放在正文旁边并设成隐藏文字，正式交付版本中看不见，但你自己打开“显示隐藏文字”就能看到当时的思考痕迹。对于审核流程比较复杂的项目，这种备注比单独写一份说明文档更不容易丢。

第二个场景是网页的折叠展开。比如文章太长需要默认隐藏部分内容，点击“展开全文”再显示，这时候用_display:none配合一个状态切换JavaScript就能实现。要注意的是搜索爬虫对display:none内容的收录态度并不统一，如果这段被折叠的内容包含关键信息，建议让它在默认渲染中可见，再通过交互去改变，而不是一开始就隐藏。

第三个场景是无障碍优化。图标按钮、图片链接用户看不见文字含义，但屏幕阅读器需要读出相对应的说明文字。常见的做法是给这类元素加一个sr-only的文本，比如“关闭窗口”“回到顶部”，视觉上干干净净，读屏软件可以正常播报。这个做法也是很多无障碍标准里明确推荐的。

第四个场景是版权信息与防伪。在设计稿里，把水印文字放在底层并降低透明度，或者在元数据里嵌入版权信息，本质上都可以算“隐藏文字”的一种应用。不过在印刷物中，如果你把文字颜色设置成纸张的白色来达到隐藏目的，很多印刷商在色彩分色时还是会印出一个“淡淡”的灰影，这个坑我已经踩过好几次。

这里必须提一个反面案例：不要在网页里为了堆关键词把大量隐藏文字铺在页面底部，也就是常说的白色文字堆词。搜索引擎对这种操作非常敏感，有成熟的反作弊体系识别隐藏文本，一旦命中轻则关键词排名消失，重则整站降权。如果你是做正经内容和正规渠道推广，完全没必要。”隐藏文字“的设计初衷是辅助功能、注释、折叠交互，而不是钻空子。

3.3 隐藏文字的坑：导出、打印、兼容性

最常见的坑来自Word打印。你把隐藏文字设置好了，在屏幕上确实看不见，但是同事那台电脑的文件选项里勾选了“打印隐藏文字”，他按Ctrl+P打印，隐藏文字全部出现在纸面上。所以要交付打印版文件时，如果你不想暴露隐藏内容，不要仅仅依赖隐藏文字格式，最稳妥的方法是直接把这段文字删除或者在打印前检查一遍打印选项。

第二个坑是Word导出成PDF。隐藏文字在转PDF时，不同版本、不同转换器的处理方式不一样。我自己做的一个测试结果：Microsoft Office 2016后，Word转出的PDF默认不渲染隐藏文字的视觉内容，但隐藏文字对应的文本层是否保留并不一定，取决于具体导出设置和第三方转换器。这就意味着，你原以为是绝密的备注，可能在PDF里被人用文字工具直接搜出来。要验证很简单：导出后用PDF阅读器的全文搜索功能搜一个备注里的生僻词，如果搜到了，说明隐藏文字正在某个层里躺着。

第三个坑是字体兼容性。无论是不是隐藏文字，只要项目里引用了不常见的字体，到了别人机器上就可能被替换成默认字体，版面完全变样。特别是中文环境中，某些商用字体在他人电脑上不存在，系统会临时用宋体或黑体代替，间距全乱。解决办法是嵌入式字体，Word里通过“文件-选项-保存-嵌入字体”来做，输出印刷文件时InDesign里勾选“PDF导出-包含字体-子集”。但要注意字体授权，有些字体不允许嵌入，这点在商务合作时一定要提前确认。

4. 常见问题与排查技巧实录

这部分我整理了这几年反复遇到的问题，做成一个快速排查的索引，按“问题-原因-解决办法”来看，能少走不少弯路。

展开讲几个重点。中文字体变方框，八成是字体代换导致。比如一个西文字体并不覆盖中文字符，系统找不到对应字形就只能回退到系统的“notdef”方框。这时你在Word里全选文字，切换成一个明确包含中文的字体，比如“思源黑体”“微软雅黑”“宋体”，基本能当场解决。如果是Web环境，检查font-family里是否在字体栈最后有无衬线兜底，不要只写“NotoSerifSC”这种需要联网才能加载的字体名，否则断网就全变方框。

网络类的问题，我遇到过最无语的一种是：CSS加载了明明正确的woff2，但浏览器显示的是系统字体。排查方式是打开浏览器开发者工具，切到Network面板，刷新，看那个字体请求返回的HTTP状态码。如果返回404，多半是路径拼写错误；如果返回200但显示字体没有应用，检查一下是不是font-weight或font-display配置把字体“饿死”了，比如你只引入了weight 500的字体，但CSS里写的是font-weight: bold，浏览器会补造一个假粗体，效果和预期完全背离。

压缩包传输导致的选字问题也值得提一句：传给别人的压缩包中，字体文件没包含在内，对方打开工程文件就会提示缺失字体。很多设计师习惯把设计稿和字体文件一起打包，可有些办公者发Word文件时完全不记得把字体带上。Word里嵌入字体后文件会变大很多，十几兆都正常，需要权衡。我自己在交付重要文档时会在文件名后面加一个“嵌入字体版”后缀，这样对方如果遇到字体问题，至少知道这个文件是自带字体的。

最后一类影响比较大的问题是隐藏文字与文档协作的冲突。多人协同编辑时，有人开着一份“显示隐藏文字”的视图，有人关着，结果两人在沟通“这段到底要不要保留”时会出现信息错位。我处理这类情况的方法特别简单：在文档顶部的批注区用文字明确写出“文档中采用了隐藏文字，共X处，如需查看按Ctrl+Shift+8”，避免同事在不知情的情况下打印出隐藏内容，也方便对方自行选择可见性。

这一个习惯建议你也试试：每次做完一份文档或页面，导出PDF后用全文搜索“的”“是”“了”这类高频字，再随意点几处文字复制粘贴到记事本，确认没有多余的隐藏文本层，再交付出去。花不了两分钟，但能避免很多让人社死的尴尬。

最后再分享一个和字体加载相关的小技巧。做Web页面时，如果必须使用远程字体，且你担心加载过程中文字不可导致切换闪烁，要给font-display设置一个合适的取值。默认auto可能在字体下载完成后突然替换文字，观感跳变；改成font-display: swap会让文字先用系统字号渲染，字体加载完成后再平滑替换，虽然有一点闪烁，但至少用户不会盯着空白页面发呆。中文Web字体由于体积大，优先推荐swap，更激进的做法是用localStorage缓存字体文件，不过这已经属于性能优化范畴了，下次有机会再单独讲。字体这个领域水很深，你能耐心看到这里，说明至少已经愿意把文字排版当回事了，这比用什么字体本身要重要得多。