使われないWebフォント

フォントAとフォントBの2つのWebフォントを定義したCSSファイルをlink要素や@importで読み込むとする。もちろんそのCSSファイルは読み込まれるが、Chrome 28では定義されたフォントが実際に本文で使われている場合にしかフォント・ファイルの読み込みは行われないようだ。url()で参照される画像ファイルが遅延読み込みされるのと一緒。

Demo: Unused Web Font and HTTP Request on Chrome 28

デモではGoogle FontsのSource Sans Proファミリーのうち400・400italic・700・700italicの四種を定義しているが、Source Sans Proが使われるセクションでは400と700しか使っていない。この場合、Chrome 28では400italicと700italicへのHTTPリクエストが行われない。確認した限りではFirefox 23はChrome 28と同じで、Internet Explorer 10では常に四種を読み込んでしまう。

The @font-face rule is designed to allow lazy loading of font resources that are only downloaded when used within a document.

仕様でも文書で使われた場合にのみダウンロードするようにと書かれている。Chrome 28の挙動が正しそう。