使用在线字体有何优点和弊端?

周良粥凉
  • 888

请问各位大大,怎么看在线字体的使用,你认为有什么优点弊端?

本来问题标题准备写《使用在线字体有何弊端?》的,但是考虑这样不方便大家畅所欲言,所以把优点也加进来了。想看看大家是怎么看待在线字体的。

回复
阅读 19.3k
4 个回答

你的问题也没说清楚, 不知你是把在线字体和什么比较 , 是和“本地字库” , 还是和“图片”比较,因为“本地字库”没啥好说的,假设你问的是与“图片”比较。

优点们:

  • 显而易见的好处是更多的字体,给了设计更多选择。同时字体文件是矢量的,单纯放大缩小理论上对显示效果没有影响,我们使用CSS去约束它的尺寸总比设计完图片再改变大小要方便。值得一提的是字体文件在retina屏幕上如此完美,圆滑细腻的边线简直比图片都好看。使用字体,还可以方便用户点选文字,对搜索引擎也更友好。
  • 使用在线字体去增强web显示效果,有许多在线服务提供字体CDN的,例如Google Fonts。目前集中在拉丁语系,英语为主,其它语种字型数量多,例如汉语动辄几千,一套字体文件囊括这些字型之后体积十分大,不方便在线传输,这里也有很多解决方案,例如把你要加载的文字以query形式传给后台,动态语言接到指令之后命令行调用一些开源项目,把需要的字从字库中切割出来合并成小字库传出来,不多传任何一个用不到的字符。
  • 我观察最近两年web设计的一个趋势是基础框架中尽可能的少使用图片(这一点在流行的CSS框架Bootstrap 3中已经得到体现),聪明的人早就已经开始使用字体文件去代替站点里的一个个小图标,他们称作“icon font”,兼容绝大多数的终端、更快的开发速度(不用写CSS sprite了)等很多优点。具体自己看阿里的阿里iconfonticomoon,类似站点很多。

可以分场景绕过的弊端:

  • 网络开销,不过对于英文字体那极小的体积和客户端缓存来说根本没啥。
  • 纯色字体对设计的限制,即便是结合CSS3的特性,也只能做到一些简单的渐变、透明度,对于色系比较多的小图标来讲,使用字体文件限制还是很大。 幸运的是最近似乎许多人对纯色渐渐情有独钟、微软的Metro风格、iOS的扁平化等等不一而足,如果设计理念类似,那么使用字体文件对设计也没什么影响。
  • 在线项目都涉及到版权问题,不管你是提供还是用,最好搞清楚授权协议再去操作,尊重作者成果。

我自己非常喜欢在线字体,无论是做web还是native、无论是设计还是内容,都是非常好的补充,如果你知道该怎么用,什么时候用的话。

优势:

  • 不再需要大量的图片来解决字体问题:Google Fonts等
  • 能提供无限放大的基础图标集合

弊端:

  • 对于如中文这种非拉丁语系的支持还比较蛋疼,至少目前的解决方案都无法通过静态服务器的方式解决
  • 文字或图标只能是单色,不过对于现在流行的极简设计而言,大概不是什么问题
孙晓龙
  • 1
新手上路,请多包涵

目前我觉得最大的弊端就是用的最多的fonts.googleapis.com的速度在国内实在不敢恭维.
一些国内网站使用了以后,导致整个网页几十秒到几分钟内就完全是空白.什么都不会显示出来.
尤其是一些本地设备也用上以后,更坑,明明瞬开的页面,那么久打不开...

其他的话,就是增加了网页的体积,可能会影响网页的速度(去掉上面提到的fonts.googleapis.com的速度影响的话.).

对于渲染速度的影响倒是不算大.

不是很看好在线字体……毕竟加载上代价不小。
而且中文在线字体就是个坑,因为中文字符太多,根本找不到方案一次性的全部加载。
现在的方案基本上是将你需要的几个字转化为一个特殊的库,然后你再在线加载……
icon font很棒……应该还能有更好玩的发展

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏