前言

作为一个博客的发烧友，最喜欢给自己主题diy各种花里花哨的字体

因为默认的字体微软雅黑总差点意思，但是一般的字体大都很大

有的甚至大到7mb，10mb的，都有，这对于小水管服务器十分的不友好

特别是一些国外的小鸡且带宽不理想的小鸡，可能访客文章都看完，博客字体还没加载完

前段时间有博友私聊我，博客的字体怎么压缩，那时候在准备四级，简单的回复了一下

今天考完，写一下方法给有需要的朋友，很简单

感谢fontspider作者

项目地址：https://github.com/aui/font-spider

准备node和npm环境

这个可以在nodejs官网下载

nodejs.org https://nodejs.org/en/download ↗

安装的时候选择add to path 这样就可以直接安装node和npm环境

因为程序化，基本上一直默认勾选就可以安装了，很简单

但是如何自己校验自己的win系统是否安装了这两个环境了，只需要win+R输入cmd

召唤出自己的pc端的cmd控制台，输入node-v和npm-v，就如下图我这样，就表示安装完毕

全局安装 font-spider

这里我们还是老样子 win + R 输入cmd，输入

npm install font-spider -g

如果提示这个，就代表搞定了

开始压缩字体

我们首先在桌面创建文件夹，注意尽量是英文，例如ziti

然后在文件夹里面把自己需要压缩的字体放在该ziti文件夹

因为考虑到一些朋友不会css，所以这里我已经给各位朋友压缩好了，直接下载解压就可以了

wwi.lanzoup.com https://wwi.lanzoup.com/iM6ur0695bcj ↗

我们将自己需要压缩的字体ttf文件拖入该文件夹即可，然后将该字体ttf文件的文件名改为font.ttf

注意：这里需要解压成文件夹放在桌面上哦，否则无法执行字体压缩

这里我原字体的大小是15mb，这里我把它拖到ziti文件夹里面，将该字体命名为font.ttf

然后打开cmd 控制台输入以下代码

cd ziti

然后再输入以下代码，这样就可以了

font-spider index.html

然后你会发现自己ziti文件夹会多出一个font-spider文件夹，此文件夹里面的font.ttf就是压缩前的字体

根目录则是已经压缩后的字体，还有其他格式字体，该工具全部帮你压缩，直接应用到网页即可，非常方便

再看看被压缩的ttf字体大小，居然不到几kb

是不是很方便！