Webフォントのサブセット化
Webフォントのサブセット化
そのWebフォント良いけど重くない？
前回Webフォントの事について触れましたが、フォントによっては容量が大きいため読込後表示されるまでに時間がかかることが判明しました。
そこで、必要な文字だけフォントにして軽量化（サブセット化）して使おう。というお話です。
ただし、サブセット出来るのはダウンロードしたもの。かつ、ライセンス的にOKなものです。
事前準備するもの、すること
GoogleWebFontなどダウンロード出来るものの場合はまずはフォントをダウンロードしてください。
M+WebFontの場合はM+Web FONTS Subsetter というとても親切なものがあります。
ダウンロードしたら、次は武蔵システムさんのサブセットフォントメーカーをダウンロード
こちらから→http://opentype.jp/subsetfontmk.htm
その次にまた武蔵システムさんのWOFFコンバータをダウンロード
こちらから→http://opentype.jp/woffconv.htm
これらをダウンロードしてインストールするときに警告が出ますが気にしなくても大丈夫です。
（正しくは大丈夫でした。ここは自己責任でお願いします。）
サブセット方法
サブセットフォントメーカーを起動させます。
作成元フォントファイルを選びます。この時に使いたいダウンロードしたフォントファイルを選択します。
次に、作成後フォントファイルは適当な名前をつけておきます。
フォントに格納する文字を選ぶもしくはコピペします。
この時に選択出来るファイルはテキストファイルです。
GoogleWebフォントのサブセット化についてと、アスキー文字・非漢字文字・第一水準漢字が一覧になっているサイトがありました。
Qiita→http://qiita.com/nowri/items/1c69b9b25f2958bd9f97
ここから文字それぞれをコピペして貼り付けるなり、テキストファイルにして読み込ませるなりがいいと思います。
作成終了後WOFFコンバーターを起動するにチェックを入れて作成開始を押下
WOFFコンバーターが起動しますので、そのままEOTファイルを作成するにチェックを入れて変換開始を押下
これで作成完了です。
あとは作成したフォントをサーバーにアップしてCSSの@font-faceにURLを書き込むだけです。
書き方は前回の記事を参考にしてみてください。
もしくは先ほどのリンク先(Qiita)の方が詳しいかもしれませんのでそちらをチェックしてみてください。
くれぐれも、フォントのライセンスには注意してください。