中文WebFont探索
本文主要讲中文webFont的相关知识，包含了业界现状、WebFont优势、实现方案等。
一 业界使用WebFont现状
1.1 英文WebFont使用现状
英文版已使用非常广泛。比较有名的字体库：GoogleFonts ：https://fonts.google.com/
1.2 中文WebFont使用现状
中文版字体库正在起步，目前各种图标使用已经很普遍了，例如华为云字体图标库。汉字库在部分大公司页面中有使用，效果还是很好的。例如：苹果、沃尔沃、汽车之家等。
案例1：苹果公司的pingfang字体，在window操作系统中没有集成，但是在windows中打开苹果中文官网，看到的字体效果还是一样，其使用的就是一套webfont字体。苹果官网地址：https://www.apple.com/cn/。
案例2：沃尔沃公司的中文官网用的是Volvo Sans Regular字体系列，实际也是webfont字体，是一套沃尔沃公司专门定制的webfonts。沃尔沃中文官网地址：https://www.volvocars.com/zh-cn。
注意：分析这两个网站webFont的实现方案，都是讲页面用的的中文字，全部转成对应的webFont，通过@fontFace功能实现。
二 业界中文字体库现状
2.1 目前中文字体库有不少，但只限于提供字体库，没有配套的web使用方法。例如：方正、汉仪。
2.2 目前做的比较好的webfont服务公司很少，其中有字库还不错，提供了字库服务：https://www.youziku.com/。
三 使用WebFont的好处
主要有三方面的好处：
3.1 视觉体验提升
好的webfont字体比目前使用的微软雅黑，在很多方面都有比较大的视觉提升。例如：思源（google和Adobe推出）、平黑等。
3.2 各个操作系统、PC端、移动端视觉体验一致性提升
使用webfont，可以确保mac、windows、Andorod等操作系统下字体显示效果都一致。而不是目前的：mac和ios手机是pingfang、widows是雅黑、Android手机是东青。
3.3 WebFont是业界趋势
英文版网站已大量采用WebFont；
苹果的移动端、PC端等字体都是统一的，体验效果很好；
好些大公司的网站都采用了WebFont。
四 使用中文WebFont需要解决的问题
需要解决两个核心问题：
4.1 中文字体库来源
有两种方式：使用已有的字体类型（方正、思源）；开发一套自己的字体库。
4.2 如何应用到页面中
中文字非常多（基础字库6000个），不可能一次性将所有字的源文件加载到页面中，只能是按需加载。这样又存在大量问题：如何实现按需加载、各个页面需要适配。
五 业界使用中文webFont的方案
主要有两种使用方案：
方案一： 手动将页面用到所有与汉字转换为webFont。
只适用于静态页面。工作量大，页面内容变更后需要手动补充新增汉字的webfont。
方案二：采用字体服务，动态实现汉字webFont化。
采用国内目前做的比较好的webFont的字体服务（https://www.youziku.com/）。
有三种使用场景和方式：
JS方式：解决静态页面场景，例如官网；
编辑器方式：解决表单提交等东西数据场景；
后端方式：解决后端大量数据场景。
参考资料&内容来源：
有字库：https://www.youziku.com/help/MF95ems.html
博客园：https://www.cnblogs.com/best/p/6132612.html
W3ctech：https://www.w3ctech.com/topic/669
最新文章
- git 和 github 关系？
- w-BIG TABLE-view+where-small table
- mysql 索引过长1071-max key length is 767 byte
- block extends include三者的差别跟用法
- datawindow.net 动态按条件汇总字段值
- [Everyday Mathematics]20150219
- wiegand 问题
- HDFS 的可靠性
- unity中的mesh合并
- 指尖上的电商---(12)SolrAdmin中加入多核的还有一种方法
- 笑谈ArcToolbox (2) 开启ArcToolbox的钥匙
- Python基础题
- live555工程建立与调试
- 菜鸟系列docker——docker仓库(2)
- 满血复活--来自世一大的WAR
- C++有关 const & 内敛 & 友元&静态成员那些事
- 20155237 第十一周java课堂程序
- 神奇的bug，退出时自动更新时间
- HTML5播放器 MediaElement.js 使用方法
- Vue SPA 首屏加载优化实践