Google Font APIでフォントのファイルサイズを大幅に削減する方法

2011/5/11 13:14

Googleは「Google Web Fonts」というWebフォントをホスティングしていて、これらのフォントはGoogle Font APIを介して利用することができます。

Google Web Fontsのフォントデータのファイルサイズは1フォントあたり大体30KB程度あります。それほど大きなサイズではありませんが、複数のフォントを利用する場合や、ナローバンド環境などでは気になるサイズかもしれません。

そこでGoogle Font APIでは、あらかじめフォントを適用するキャラクタ(文字)を指定してフォントデータを取得できるオプションを用意しているそうです。これにより、ダウンロードされるフォントデータのファイルサイズを大幅に削減できます。

» Streamline your web font requests: introducing “text=” – The official Google Code blog
» Streamline your web font requests. Introducing “text=” – Google Web Fonts

方法は簡単で、Webフォントを指定するURLに「text=フォントを適用したい文字」というオプションをつけるだけです。

試しに次のようなHTMLで試してみました。下記の例では「&text=fkoji」と指定しているので、「Tangerine」フォントは「f」「k」「o」「j」「i」の5文字に対してのみ適用されます。

<html>
<head>
<link
  href="http://fonts.googleapis.com/css?family=Tangerine&text=fkoji"
  rel="stylesheet" type="text/css">
<style>
  body {
    font-family: 'Tangerine', serif;
    font-size: 36px;
  }
</style>
</head>
<body>
abcdefg hijklmn opqrstu vwxyz
ABCDEFG HIJKLMN OPQRSTU VWXYZ
fkoji
</body>
</html>

これをブラウザで表示すると次のようになります。