13.2 在哪里能找到Web字体

在网站上使用Web字体有两种方式:自托管和Web字体服务。这两种方式都是完全有效的选项,不过二者差异很大,各有利弊。当你权衡这些利弊的时候,你会发现并非所有的Web字体都是随处可见的。你可能会发现,即便你想采用自托管的方式,你需要的字体也只能来自Web字体服务。这时,你可能需要寻找一种接近的替代方案,或者重新考虑你的方法。在作出决定之前,需要花费一些精力权衡所有的选项并灵活处理。

  1. 自托管

自托管Web字体是一种更为传统的方式,也是本章将逐步进行讲解的方式。字体来源于你自己的服务器,就像其他的资源(如图像、CSS文件)一样。如果需要与字体相关的花费,通常也是一次性的购买支出,是否将字体文件上传到网站上并将其包含到代码中取决于你自己。

寻找可以自托管的字体是比较容易的,因为它们的数量很多。它们的质量和价格差异很大(有的甚至是免费的)。其中一些流行的自托管字体来源如下。

  1. Web字体服务

Web字体服务通常提供订购Web字体的方法。这种方式是指按月或按年支付使用字体的版权费用,而不是彻底买断字体。这些服务托管字体,为用户提供一小段代码放在其网页中。这段代码可能是JavaScript,也可能是CSS,这取决于服务自身。它包含了从远程服务器获取字体文件并将其显示在网站上这一过程所需的全部代码。很多人主张使用这种方式,因为这种方式通常比单独购买字体更便宜,而且它让用户有机会尝试很多种不同的字体。

一些流行的Web字体服务包括:

按理说,Web字体服务可以提供比自托管更多的特性。所有的东西都存放在服务器上,包括字体文件。如果出现了更好的字体文件或代码,服务便可以很容易地将它们提供给用户。

此外,在这类服务中,很多都使用JavaScript嵌入获取Web字体的代码。这样做有一些好处,也有一些不好的地方。在这一过程中,JavaScript做了不少工作,包括探测加载页面的浏览器,为字体本身的加载提供额外的控制。这种控制可以产生更好的体验,因为它让Web字体服务可以自定义字体格式和提供字体的代码。例如,Typekit近期宣称,它们将在一些服务中使用基于PostScript的轮廓(仅针对Windows浏览器)显示的字体,从而让笔画更为平滑(http://blog.typekit.com/2011/09/15/improvedwindows-rendering-for-more-typekit-fonts/)。如果没有JavaScript,这类特性就失效了。

这种奢华的代价当然是你必须百分之百地依赖JavaScript。如果用户在其浏览器中禁用了JavaScript,他们就无法看到你的Web字体。此外,JavaScript会影响页面的性能。在Web字体呈现在页面上之前,用户必须等待JavaScript加载完成。这是你决定如何在网站上加入Web字体时需要记住的事情。

  1. Web字体的质量与显示

不幸的是,并非所有的Web字体都是一样的。对于在不同浏览器中Web字体显示的效果,它们具有很明显的差异。一些字体在Internet Explorer较早的版本中显示效果并不太好,这一点尤为明显。

当你选择字体时,要尽量检查你即将选择的字体在各种浏览器中显示的效果(如图13.2.1所示)。现在,由于很多Web字体公司提供Web字体的实时示例,有的公司提供字体在不同浏览器和平台中的截图,因此上述工作就变得容易多了。

13.2 在哪里能找到Web字体 - 图1

图13.2.1 这张合成的截图显示的是相同的代码在Internet Explorer 6(上)和Chrome 15(下)中显示的效果。可以注意到,在Internet Explorer中,字母的笔画更细,且不太平滑

提示 如果你坚持自己测试,可以尝试Web Font Specimen(http://webfontspecimen.com)提供的工具。这个工具可以让你查看Web字体在不同环境和不同字号下显示的效果。