网站标题之字体子集化

有时候想给特定地方的文字使用不同的字体，但正常的字体文件一般都不会太小，加载一个完整的字体文件就没有那么必要，这个时候我们就可以用到字体子集化技术。

什么是字体子集化？

字体子集化是指从完整字体文件中提取特定字符，生成精简后新字体文件的技术。当网站只需使用字体中的少量字符时（如标题文字），这项技术能显著减小字体文件体积，提升页面加载速度。

目前本站标题 威言威语 就使用了字体子集化的操作。当然我又进了一步，重新编辑了字体，其中威字也改用了icon 的设计，这3个字子集化之后大小不超过2k，还是非常值得操作的。

优先建议字体文件使用woff2格式，得到字体之后，在css中自定义字体名称，然后在需要的地方就可以使用这个自定义字体了。

@font-face {
font-family: 'weisay'; /* 自定义字体名称 */
src:url('../weisay.woff2') format('woff2'); /* 字体文件路径 */
}

现在可以子集化的工具很多，一些网站也能轻松实现。

基础使用：字体子集化

Transfonter

官网：Transfonter

虽然界面是英文，但是使用很简单，上传你想要使用的字体，小于15M即可。然后在 Characters 一栏中填写需要的文字，再点击上面的 convert 按钮，等待几秒就生成好字体了。下载的附件还提供了demo，你可以自己修改测试看看你选择的那几个字生效了没有。

效果展示：威言威语

字体使用：锐字潮牌真言简。

Fontmin

官网：Fontmin

将字体拖入，输入要使用文字，点击生成就OK了，不过看着默认生成出来的有woff，没有woff2，可以找个转换网站转换一下，推荐还是使用woff2格式。

FontSmaller

官网：FontSmaller

和Fontmin类似，打开软件选择字体，然后输入要使用文字。不过它只支持ttf格式字体，并且也只导出ttf字体，想要woff2的还要再转化一下，有一点点麻烦。

进阶应用：多个字体合并

假如你不走寻常路，一个标题里面想使用两种字体，同时又希望只用一个字体文件，那么也是可以的。当然有个前提，他们是不同的字，像我博客名字：威言威语，你想在一个字体文件里用两个不同字体的“威”就不行。

Aspose.Font

官网：Aspose.Font

它的功能挺多，字体转换，多个字体合并就需要用到它了，我们可以选择 多个woff2转woff2。

点击“Browse for file(s)” 一次要选择2个字体，然后在各自的 symbols 里输入需要用的子集，点击 merge 合并，等待一会儿就合并好，然后有个倒计时，30s之后就能下载了。

这样，我们就将2个字体合并成一个了。

效果展示：威言威语

字体使用：“威”使用了金山云技术体、“言语”使用了锐字潮牌真言简。

通过合理使用这些工具和技术，可以显著优化网站字体性能，同时实现独特的设计效果。