不需要Sprite，易于修改

省去了使用Sprite的麻烦，很容易修改更换

iconfont只能是纯色或者渐变色，复杂图标无法使用该技术（虽然也有方法可以实现多色iconfont，但兼容性，成本都无法接受）

FOUT（Flash of Unstyled Text）问题

浏览器先用默认字体渲染，待字体文件下载完毕后再对文字内容进行部分渲染，文字就会出现 不可避免 的闪烁

IE会阻塞页面渲染

如果在 @font-face 声明之前有script标签的话，IE将不会渲染任何东西，直到字体文件完成下载

IE问题比较多，IE和FF下@fontface会阻塞window.onload，IE下用不用都会加载，字体加载出错（长时间未返回结果）时，IE会等待10分钟（期间白屏），其它浏览器会用默认字体渲染或者暂时不显示内容，在等待下载期间忙指示器会一直被触发（状态栏、进度条、图标、鼠标指针）

二.制作生成

[步骤可选]PS, 从png导出路径

AI，填色，闭合路径，存为svg

在线字体生成器

http://www.iconfont.cn/icons/uploadShow

http://fontello.com/

IE：从IE4开始支持eot格式，IE9开始支持woff

webkit/safari：支持TrueType/OpenType(.ttf)，OpenType PS(.otf)， iOS4.2+支持.ttf，iOS 4.2以下只支持SVG字体 ， Safari5.1+ 开始支持woff格式

Chrome：除webkit支持的以外，从Chrome 6开始，开始支持woff格式

Firefox：支持.ttf和.otf，从Firefox 3.6开始支持woff格式

Opera：支持.ttf、.otf、.svg。 Opera 11开始支持woff

iPad, iPhone and Android 3.0+ 支持SVG fonts

此处 与caniuse结论有差异

五.性能优化原则

将你的@font-face定义在所有的script标签前

如果你有许多字体文件，考虑将它们分散到几个域名下

不要包含没有使用的 @font-face声明——IE将不分它使用与否，通通加载

Gzip字体文件，同时给它们一个未来的过期头部声明

考虑字体文件的后加载（放在body结束标签前），起码对于IE（IE留10分钟下载字体，在此期间，页面阻塞）

关于@fontface性能问题的详细信息请查看 【翻译】@font-face与性能

六.注意事项

1.FF不加载异域字体

放到同域或设置服务器头

2.safair和chrome下字体被加粗

把半像素锯齿渲染成了1px，设置css规则： -webkit-font-smoothing: antialiased;

3.PC的Chrome下严重锯齿

对边缘模糊处理即可，设置css规则： -webkit-text-stroke-width: 0.2px;

iconfont优点 > 缺点，复用性与维护性上的便利很诱人

生成字体库的主要工作量在于png转svg

如果UI肯配合就很容易了，而且字体库建好后对UI也有好处，做设计稿更方面，有 PS插件 可以直接使用iconfont，不用切出icon

（亲测不支持cc，cs6，对插件质量保持怀疑， 如果插件不可用，UI设计稿图标与iconfont的对应是个小麻烦 ）

字体库管理不是问题

http://www.iconfont.cn/users/project 非常方便

兼容性不是问题

4种格式都放上，兼容性足够了

性能不是很好

但和图片Sprite相比足够好了