在应用自定义字体到网页时,CSS中是否需要备用字体?

7
在CSS中,如果我上传了自定义字体供网页使用,为什么建议使用备用字体?我以为备用字体只在客户端没有安装第1/2/3..等选择时才需要。
例如,如果您有以下代码:
@font-face {
    font-family: MyCustomFont;
    src: url('../fonts/MyCustomFont.ttf');
}

为什么这是必要的?
body {
    font-family: MyCustomFont, Arial, Helvetica, sans-serif;
}
2个回答

12

指定字体堆栈并非必需,但在某些情况下有助于优雅降级,例如当浏览器无法使用字体时(例如HTTP请求超时,字体文件本身损坏或无法使用,浏览器不支持任何给定的字体格式等)。

当然,您应尽力确保自定义字体被正确下载和使用。但有时会发生一些事情超出您的控制范围,因此仍有必要有备用字体以便妥善处理。这就是为什么它们被称为备用或回退字体的原因 :)


5
此外,浏览器设置可能会禁用可下载字体的使用,尽管这些设置可能相对难以发现。另一方面,一些浏览器插件(如NoScript)可能会在不让用户知情的情况下执行此类操作。 - Jukka K. Korpela
@Jukka:作为一个每天使用NoScript的用户,经常遇到这种情况,我很惊讶在我写这个答案时没有想到这一点。 - BoltClock

0

DaveRandom,这些都是计算机编程中唯一涉及嵌套while循环的部分。

我找到了一种集成Google字体而不出现通常在使用第三方字体时出现的问题的方法。

首先,我们知道我们的Google字体文件是.woff格式的,可能无法在所有浏览器中正常工作。

其次,如果Google Cloud或其他干扰程序由于缓存限制或其他网络限制阻止从我们的服务器下载字体文件,我们知道这种伪连接状态可能支持来自Google字体的.woff字体。

为了归功于Google,我们可以以某种其他方式加载我们的图像,那么为什么不尝试使用我们终端产品的Google字体版本。所以这里是为什么不:

为了确保添加Google字体时字体保持不变,我建议不要删除自托管字体,除非经过验证的原告请求您出于权利所有权原因这样做。

不要删除真正实现跨浏览器兼容性的自托管字体,而是在CSS中创建同一字体条目,将其字体标题指定为第三方,例如:“ArialVanityGoogleFonts”。 使用浏览器内置字体回退.csv,并如下包括字体:ArialVanity、ArialVanityGoogleFonts、Arial


“Google Cloud或其他某些干扰阻止了下载…”的意思是什么? - kmiyashiro

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接