html 中加载字体太慢,css字体文件包太大无法引入怎么处理？

前端开发的同学，我们经常会碰到需要还原设计稿中的特殊字体。这时，我们可能会采用两种方案：

1、使用photoshop将文本图层单独导出成图片;

2、直接引入改字体的字体库.ttf文件

首先第一种方案的缺点，使用图片代替文字，制作和维护的成本很高,前期切图，合并雪碧图比较繁琐，后期修改和维护更是麻烦。同时使用图片，会带来更多的宽带消耗；用户体验方面，用户无法进行文字的选择，复制等操作，体验也不好。

第二种方案，解决了上述的一些问题，但是由于汉字数量太大，导致中文字体文件也较大，通常都会有几M大小，不适合在项目中使用。尤其是移动端项目，由于字体加载速度很慢，体验会十分不好。

那么如何解决移动端引入的字体文件过大问题？下面本篇文章将介绍两种自动化工具，来实现在移动端愉快的使用特殊字体，分别是Font-Spider(字蛛)和fontmin。

浏览器对字体的支持

不同浏览器对字体的支持不同，所以我们要对不同的浏览器制作不同的字体。下图是浏览器对字体的支持情况，其中N为不支持，P为部分支持，Y为支持。