本文章所述方法均效仿博文:网页中文字体压缩(woff2)、拆分、去繁体字库,提高加载速度 - iMaeGoo's Blog,本篇仅作为个人记录使用,自行压缩建议参阅原文,以免遗漏步骤。
缘由
最近把博客和导航页字体改成了「霞鹜文楷」和「点点像素」。开始就是直接源文件丢到根目录,然后在 CSS 内引入。但是这俩源文件都不小,每个网页相当于多加载了10MB。并且由于博客首页的音乐播放器的加载顺序是在字体后,极大的影响了博客的使用体验(虽然并没有人看,但是自己看也不爽。遂于网上搜索字体压缩的教程,现学现做。
大致步骤
总体来说分为两步,第一步是删去中文字体中不需要的部分,第二步是将其压缩为更小体积的 woff2 格式。详见下文。
删去中文字体中不需要的部分
我们主要使用字体的简中部分,所以删去字体的繁中内容(当然,也可以删除一些不常用字,原理一致)。
使用 fonttools 完成该步骤(其环境要求及安装见引文链接),下载简体字的 unicode 表(点击下载,该表为引文链接文章的作者提供) 。键入命令:
pyftsubset <字体文件> --unicodes-file=<下载的 unicode 表>
效果如图:

然后可以看见路径下多出了一个带有 .subset
后缀的字体文件,即为需求的输出结果。
压缩为更小体积的 woff2 格式
编译安装 woff2 ,具体过程参考引文链接中的讲述,我使用的是 Ubuntu 1804 环境。
编译结束后,在目录中应有可执行程序 woff2_decompress
,输入命令:
./woff2_compress <字体文件>
输出的 .woff2 即为所求。
Comments 1 条评论
这是一条私密评论