可变字体和增量字体传输
适合谁看:关注网页字体新技术、想知道哪些现在能用、哪些还要等的开发者。
可变字体:现在就能用
可变字体(Variable Font)把一个家族的多个字重(以及宽度、倾斜等)放进一个文件,用「轴」连续调节。连续调节[1]。
- 浏览器支持已经很普遍;
- CSS 里用
font-weight: 100 900声明范围,页面里可以用任意中间值,如font-weight: 450; - 也可以用
font-variation-settings调节字体自定义的轴。
中文可变字体的取舍:
- 思源黑体、
思源宋体等都提供可变字体版本;思源宋体等都提供可变字体版本[2][3]; - 一个可变字体文件通常比单个字重大,但比多个字重加起来小;
- 页面只用一两个字重时,单独的静态字重分片往往更省流量;用三个以上字重,或需要动画、细调时,可变字体更有优势;
- 可变字体同样可以拆子集、分片。
字重的设计知识见《多字重家族和可变字体怎么挑》。
增量字体传输(IFT):还在路上
增量字体传输(Incremental Font Transfer,IFT)是 W3C 正在制定的标准。正在制定的标准[4]。它的思路是:浏览器先下载字体的一小部分,页面需要更多字符时,再下载「补丁」扩展同一个字体文件。
和今天的 unicode-range 分片相比,它的好处是:
- 字体始终是一个完整的字体,连字、上下文替换等排版功能不会因为分片而失效;
- 能更精细地按需下载,对中日韩字体意义很大。
现状(截至 2026 年 10 月):W3C 已发布候选推荐草案(2026 年 10 月 13 日版);Chrome 已表示有意开始原型开发,主流浏览器尚未正式支持。现阶段中文网页字体仍然用 unicode-range 分片。
OFL 常见问题也专门讨论了 IFT:用 IFT 这类按需子集技术提供 OFL 字体是可以的,前提是达到足够的「功能等价」,不能破坏字符覆盖和排版功能(OFL-FAQ 2.9)[5]。
参考资料
参考资料(5)
- MDN:
可变字体指南:https://developer.mozilla.org/zh-CN/docs/Web/CSS/Guides/Fonts/Variable_fonts可变字体指南 W3C:思源黑体(Source Han Sans)项目仓库,GitHub:adobe-fonts