【发布时间】：2012-07-27 12:56:17
【问题描述】：
【问题讨论】：
-
当您参考您遇到的信息时，实际链接到它通常是个好主意。
-
这是一篇关于这个主题的新帖子，我觉得很有帮助：michael.stapelberg.de/Artikel/font-loading
【发布时间】：2012-07-27 12:56:17
【问题描述】：
您提出了两个不同的问题。
下载实际字体文件的延迟基本上是不可避免的，尽管您可以通过不包含任何您实际上不需要的内容来帮助它，从而最大限度地减少整体文件大小。根据您使用的服务/方法，这可能需要减少您包含的字符集（/语言）以及权重和样式。
至于无样式文本的闪烁，这是半不可避免的，部分原因是上面的下载时间问题。但是一旦你尽可能地减少了它，你应该实现一个字体加载器来更好地控制这部分。这是TypeKit's (open-sourced) implementation 和brief explanatory blog post。底部的示例专门针对 FOUT；您几乎可以将其放入您自己的代码中。
这里有一些information from FontDeck 将 Google 的加载器与他们的服务一起使用，这也将导致将其用于 Google 的 WebFonts 服务。
任何其他服务，您都必须开始自己研究，但这些是一般概念。使用这些工具，您可以使用一些脚本和 CSS 规则来隐藏受影响的文本，直到字体准备好呈现，以及其他一些用途。这不是完全的想法，但至少可以防止 FOUT。一旦超过了最初的时间，浏览器的缓存应该会接管并使其在很大程度上没有实际意义。
【讨论】：
-
try{Typekit.load();}catch(e){}来自 TypeKit 的实现几乎说明了一切 - 如果您不介意让您的用户等待额外的时间（希望测量以毫秒为单位）然后这个工作......如果你关心让你的页面尽可能快，这是行不通的。 （......如果用户没有停留足够长的时间来看到您的网站完成加载，那么您的网站看起来是什么样子并不重要:) -
值得一提的是 data-uri 嵌入字体作为一个选项。避免额外的 http 请求。
A) 通过正确设置 Cache-Control 和 Content-Type 来缓存字体：
Cache-Control:public, max-age=15552000
Content-Type:application/x-font-woff;charset=UTF-8 (differs for other font files)
B) 避免使用 https 作为 Vary 标头。只设置Accet-Encoding。 变化：https breaks IE font loading.
Vary:Accept-Encoding
https://github.com/typekit/webfontloader
C) A 和 B 在第一次请求后应该可以正常工作，此时浏览器已经加载了字体。如果这还不够，请尝试Web Font Loader。
【讨论】：