我在Rails项目中,我使用的是/ assets / fonts文件夹中的两种字体.
@font-face {
font-family: FuturaStd-Light;
src: url("/assets/fonts/FuturaStd-Light.otf");
}
@font-face {
font-family: HelveticaNeue;
src: url("/assets/fonts//HelveticaNeue.dfont");
}
这些字体是非常大的文件(特别是第二个),它们需要永远加载它们.在每个页面中,文本都显示在其他所有内容之后.
有没有更好的方法来加载字体?有没有办法缓存它们?有任何想法吗?
最佳答案
@ font-face是一种很棒的技术,但是大字体文件肯定会减慢你的网站速度.您可以使用许多技术来解决这个问题:
>使用像google fonts或typekit这样的字体托管服务
>在CDN上托管您的字体文件
>使用像fontsquirrel这样的服务优化您的字体文件
特别需要注意的是,如果在样式表之前有一个SCRIPT元素,IE将阻止整个页面的呈现.因此,请确保所有样式表链接都在您正在加载的任何javascript文件之上.
进一步阅读:
> Web Font Performance: Weighing @font-face Options and Alternatives
> @font-face and performance
> fighting the FOUT