Coockar

公開日: 約1分

Web フォントを 23KB までサブセットする

可変フォントから Latin グリフだけを抜き出して自前ホストするまで。pyftsubset の実行例と、確認すべき三つの落とし穴を記録する。

見出し用の欧文フォントを一書体だけ導入したい。しかし配布版の woff2 は 59KB あり、和文フォールバックと混植する前提なら大半のグリフは使われない。fonttools の pyftsubset で Latin 領域だけを残したところ、23KB まで縮んだ。

実行したコマンド

pyftsubset Font-Variable.woff2 \
  --output-file=font-latin.woff2 \
  --flavor=woff2 \
  --unicodes="U+0000-00FF,U+2000-206F,U+2190-21FF" \
  --layout-features='*'

範囲は基本ラテンとラテン補助、約物、矢印まで。--layout-features='*' を付けないとリガチャやカーニングの OpenType 機能が落ちるので注意する。

確認した三つの落とし穴

  • 可変フォントの weight 軸が残っているか（fvar テーブルの確認）
  • font-display: swap にして FOUT を許容し、読み込み失敗時もテキストが出ること
  • ライセンスがサブセット配布を許すか。OFL は改変版の同梱配布にライセンス全文の同梱を求める

まとめ

サブセット化は一度やれば終わりの作業で、59KB→23KB の削減が全ページに効く。ライセンス表記だけは省略せず、リポジトリ直下の NOTICE に全文を置いた。