第三期：中文网页字体实作与挑战
内容概要：CJK 网页字体的现状；中文网页排版技术细节；中西混排要点；总结与展望。
中文有四大印刷字体：宋体、黑体、仿宋和楷体。而我们现在的网页排版很少能看到仿宋和楷体，这是因为我们以往的网络基础设施是从国外引进的，衬线体和无衬线体可以很好地对应到宋体和黑体。
我们在CSS调用字体的时候经常使用 generic-family，目前字体规范正在开发的是第四级，虽然还不太稳定，但正在加入更多的功能来满足需求，后续还需进行测试。
从有需求，到经过检验，到最终应用，是一个漫长的过程。因此我们可以来看一看现在能做什么，在此基础上展望未来。
1 中西混排要点
1.1 最好能定制：安心、放心
蒙纳字体创意总监小林章先生创作的翔鹤黑体，就是在 Neue Frutiger 的风格和字形基础上演绎而出，因此这样的定制是最适合中西文混排的，可以放心使用。
1.2 落实回落机制
如果没有专门定制的中西文搭配字体，就会面对两个难题。一是需要搭配中西文，合适度需要考量；二是网页字体会根据用户的环境和设备发生变化，作为开发者很难预测用户看到的视觉效果。下面介绍一些控制回落的方法：
- 西文优先：在写 font-family 的时候，尽量把西文写在前面，因为往往一些老的中文字体包里所搭配的西文效果并不理想。
- 系统字体比特定字体优先
- Mac 比 Win 优先：也要考虑到不同的平台。针对于桌面端而言，Mac系统的用户可能会更希望看到特定的字体，因此大家可以考虑优先写 Mac 系统字体。
- 注意向后兼容：一定要有通用字体家族兜底，避免字体最终无法显示
1.3 特别注意中西共用标点
标点对中文的易读性有非常关键的影响，而因为前面提到了西文优先，所以有些中西文共用的标点可能就会影响到中文版面的展示。因此，需要进行微调或者定制，例如苹果官网的所有中文标点都是半宽。对于一些中西文共用码位，要注意好搭配。
1.4 实作配置的要点：从单位到字距到网格
西文没有「格」的概念，因为字母是比例宽度；而中文是有「格」的，因此理论上来说行长宽度是必须字号的整数倍。中式网格所有元素以正文字号为基础，例如行长、缩进、行高、标题等元素。
而字号基础单位有绝对单位和相对单位，例如绝对的 pt、mm，和相对的 px。更适合中文汉字的相对单位是 em 和 rem。如果我们以 em 为基础单位，那么段首空两格就可以写作 2em。
对于现在跨设备的网页展示，需要考虑到响应式设计。苹果的网页文字并非随着窗口宽窄可以无极变化，而是间断性变化，以此来控制行长，定好在特定尺寸下重点宽度的排版，就能够实现比较理想的效果。因此我推荐大家在进行响应式设计时，抓住阶段性的宽度，来提升视觉可控性。
另一个需要强调的是中西文行距问题。西文可以行距是 0，密排也可以阅读；但如果直接转换成中文，易读性就会降低很多，要注意中文的行距应当大于西文，更换语言后要主动调节合适的行距，正文至少要 1.5 倍行距。
2 所谓的中文「高级排版特性」
此外，还有一些所谓的高级排版特性。
- 换行控制：最好是实现按照语义换行
- 中西间距：一段中文中如果有西文单词，空格如何设置是一个长久以来讨论的话题。其中一个关键是，这个空格应当是样式，而非用户强行敲出的空格内容。目前已经有一些浏览器能够自动添加空格，并略过已经手工加上的空格。
- 标点宽度调整：有行头行尾的标准，也有行内「连续标点」的调整。
3 我能做什么？
- 多思考：需求、资源、优先度
- 多沟通：设计师、工程师、用户
- 多选择：靠谱的字体、靠谱的服务
- 多测试：设备、平台、环境
