多个@ font-face格式是否会减慢下载速度？

我正在开发一个网站，并使用@ font-face进行排版（因为所需的确切字体不可用作webfont）。我以前Font Squirrel's @font-face generator创建自己的推荐格式，其中包括最大的跨浏览器兼容不同的格式，并使用其样本CSS：多个@ font-face格式是否会减慢下载速度？

@font-face { 
font-family: 'playfair_displayregular'; 
src: url('playfair-display-webfont.eot'); 
src: url('playfair-display-webfont.eot?#iefix') format('embedded-opentype'), 
    url('playfair-display-webfont.woff') format('woff'), 
    url('playfair-display-webfont.ttf') format('truetype'), 
    url('playfair-display-webfont.svg#playfair_displayregular') format('svg'); 
font-weight: normal; 
font-style: normal; 

}

我的问题是，浏览器将尝试下载所有的不同的格式，或每个浏览器是否只加载一个供它使用？

来源

2012-12-28 velvetkevorkian

根据我的经验，浏览器一旦成功下载并解析一种格式或停止选择，就会停止下载一个字体。还没有看到一个足够愚蠢的浏览器下载同一个font-face的多种格式，除非第一次尝试的格式证明是损坏的。 – DCoder

http://stackoverflow.com/questions/13609119/if-multiple-sources-are-listed-in-an-font-face-are-all-of-them-loaded-on-the-c和http://stackoverflow.com/questions/10338152/do-more-formats-in-font-face-determine-more-http-requests，其中包括 – BoltClock

@BoltClock在这个重复的问题接受的答案是错误的，基于保罗爱尔兰在[Bulletproof @ font-face语法]（http://paulirish.com/2009/bulletproof-font-face-implementation-syntax/）上的研究。 – 2012-12-28 16:23:22

在某些情况下，某些浏览器会下载同一个font-face的多种格式。

详细的解释可以在Bulletproof @font-face syntax找到，但它的要点是FontSquirrel为你做了所有的辛苦工作，它们的语法实现了最好的语法，并防止下载多个资源。

该文章值得一读，并提供了更多信息的链接。

来源

2012-12-28 16:20:19

用于FontSquirrel。 – Plummer

@Plummer：这似乎是upvote问题而不是答案的原因，因为OP使用了FontSquirrel，这引起了这个问题的开始。 – BoltClock

@Ghodmode，我做到了，foo。 – Plummer

多个@ font-face格式是否会减慢下载速度？

回答

相关问题