21

通常,我"Helvetica Neue"在某些网站中使用字体,虽然在查看其他网站时,我看到了一些带有"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue".

有任何理由以这种方式引用 Helvetica Neue 吗?还是我应该坚持我使用的正常方式?

4

3 回答 3

38

我推荐 Chris Coyier 在 CSS Tricks 上写的这篇题为 Better Helvetica 的文章:

http://css-tricks.com/snippets/css/better-helvetica/

他基本上建议使用以下声明来涵盖所有基础:

body {
    font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
    font-weight: 300;
}
于 2012-08-22T09:46:46.573 回答
19

他们正在采用“shot弹枪”方法来引用字体。浏览器将尝试将每个字体名称与用户机器上安装的任何字体进行匹配(按照它们被列出的顺序)。

在您的示例"HelveticaNeue-Light"中,将首先尝试,如果此字体变体不可用,浏览器将尝试"Helvetica Neue Light"最后"Helvetica Neue"

据我所知"Helvetica Neue",它不被视为“网络安全字体”,这意味着您将无法依赖为您的整个用户群安装它。"serif"定义或"sans-serif"作为最终默认位置是很常见的。

为了使用不是“网络安全”的字体,您需要使用一种称为字体嵌入的技术。嵌入字体不需要安装在用户的计算机上,而是作为页面的一部分下载。请注意,这会增加整体有效负载(就像图像一样),并且可能会影响页面加载时间。

具有开源许可证的免费字体的一个很好的资源是Google Fonts。(在使用它们之前,您仍应检查各个许可证。)每种字体都有一个下载链接,其中包含有关如何将它们嵌入您的网站的说明。

于 2012-08-22T09:42:46.783 回答
0

假设您已经引用并正确地将您的字体集成到您的网站(可能使用@font-face 工具包),那么按照您的方式引用您的字体应该没问题。大概是这样的,所以如果某些浏览器无法正确呈现字体,它们会后退

于 2012-08-22T09:41:32.603 回答