@font-face

“@font-face is essentially the ultimate solution for fonts on the web.” @font-face基本上是网页中字体的最终解决方案。
在所有的字体替换方法中,@font-face可能是受到关注最多的。但这是有充分原因的。@font-face基本上是网页中字体的最终解决方案,在它被真正的实现之前,其它技术都想替代它的位置。其实在CSS2特性中就包含了@font-face,但直到今天它才被广泛地采用。
@font-face在网页上实现自定义字体,使用的技术无非是CSS——这意味着不再依赖于Flash,PHP甚至Javascript。当使用@font-face时,渲染的是真正的字体,而不是向量对象或图片,因此文本可以被选择、放大,使用CSS修改样式。
不幸的是,就像其它和网页有关的事情一样,首先阻碍@font-face发展的就是浏览器(还有使用授权,我们会在下文中讨论)。每一种主流浏览器的字体格式是不同的。Internet Explorer使用.EOT(Embedded Open Type),而近期的Firefox、Chrome、Safari和Opera都支持.ttf(True Type Format)。一些浏览器也支持开放字体格式(Open Type Format),iPhone和iPad则需要SVG(Scalable Vector Graphics)。这些很让人费解,有时会令很多人望而却步。谢天谢地,还有一线曙光。网页开放字体格式(即.WOFF)被定为网页字体的标准格式,W3C正在对其进行标准化。3.6以上版本的Firefox和5.0以上版本的Chrome已经支持这个格式,根据近期的声明,IE9也支持这个格式。让我们期待Opera和Safari也尽快参与进来。
关于@font-face,唯一还要提出的小问题是,因为它呈现的是真正的字体,不同的浏览器和操作系统的渲染效果会有细微的区别。一些网页字体服务会使用字体微调来协助修正这些细微的差异,字体微调会在浏览器中平滑字体的轮廓,创造出更好看的字体。我们会更深入地探讨这些服务。
如果你需要更多关于如何在网站中实现@font-face的信息,Jeffrey Way又一次提供了一篇非常有用的教程。
优点:
- 保持了可用性——这意味着它能优雅降级
- 支持Unicode
- 支持CSS字体样式
缺点:
- 一些字体文件下载起来比较大
- 不同浏览器之间没有统一的格式
- 不允许发布(据我们所知)——在确认你的发布许可之前,不能在模板或主题中使用。
接下来的解决方案依赖于@font-face来实现——每一个多少都算是一种服务——这意味着:它们都使用同样的基本技术,但是它们提供不同的字体库,授权选项,以及支付计划;是的,大部分是需要付费才能使用,但这可能就是所有网络字体的未来。
出处:Seemeloo西米露
责任编辑:bluehearts
上一页 网页设计师的字体替换方法指南 [2] 下一页 网页设计师的字体替换方法指南 [4]
|