本文へスキップ

フォント形式変換

Font Converter

TTF・OTFとWOFFをブラウザ内で相互に変換して@font-face規則まで書き出します(WOFF2はBrotliが要るため扱わず、デスクトップの道具を案内します)。

sfnt系の形式とWOFF 1.0を双方向に変換し、どちらの向きに進むかは置かれたファイルから判断します。どちらの向きも情報を失いません。WOFFは容器なので、包んで解けば同じテーブルが戻り、`head.checkSumAdjustment`は再計算されるので結果は検証を通ります。WOFF2は受け付けず、黙って失敗する代わりに理由を説明します。

🔒 ブラウザの中だけで動きますfontconvertwoff2webfont

TTF · OTF → WOFF、または WOFF → TTF · OTF

ファイルを一つ置けば、向きはこちらで決めます。すべてこのタブの中で行います。

できることと、できないこと

  • · TTF · OTF ⇄ WOFF 1.0:WOFF 仕様(W3C, 2012)のとおり、テーブルごとに zlib 圧縮をかけ、44 バイトのヘッダーとディレクトリを書きます。圧縮はブラウザーの CompressionStream('deflate')、展開のときは元のチェックサムのまま sfnt を組み直すので head.checkSumAdjustment まで正しく出ます。どちらの向きも無損失です。
  • · WOFF2 は作ることも展開することもできません。Brotli が必要ですが、ウェブプラットフォームは Brotli をページに公開していません。WOFF2 がどうしても必要ならデスクトップの道具を使ってください。ふつう WOFF よりさらに 20–30% 小さくなります。
  • · TTF ⇄ OTF(CFF) のように輪郭の形式を変えるのは、変換ではなく描き直しなので扱いません。拡張子が .otf でも中身が TrueType のフォントは、ふつうに扱えます。
  • · フォントのライセンス(OS/2 の fsType)は変換しても変わりません。サーバーに載せる前に配布条件を確認してください。

容量を減らすなら、形式の変換よりフォントのサブセット化のほうがはるかに効きます。ハングルのフォントは 2,350 字に絞ると 90% 以上小さくなります。

使い方

  1. ファイルを1つ置きます

    TTFかOTFならWOFFに包み、WOFFなら中身のアウトラインに応じてTTFかOTFに解きます。向きの切り替えがないのは、先頭4バイトの署名がすでにどちらの向きかを語っているからです。

  2. 前後のサイズを確かめます

    WOFFにすると40〜50%ほど減るのがふつうで、これはテーブルごとのzlibであって、気の利いたことは何もしていません。ほとんど動かないなら、そのフォントはおそらくすでに圧縮されたデータです。たとえば、詰め込まれたチャーストリングを多く持つCFFのフォントです。

  3. ファイルと@font-faceを取ります

    宣言はファイルがスタイルシートの隣にある前提で書かれていて、ウェイトとイタリックの値はファイル名からの推測ではなく、フォントのOS/2とpostのテーブルから読んでいます。

よくある質問

WOFF2に対応しないのはなぜですか。

WOFF2はBrotliで圧縮されているうえに、グリフのテーブルを並べ替えて変換もしています。ウェブのプラットフォームがページに渡す`CompressionStream`にはdeflateとgzipしかなく、Brotliがないのでどちらの向きもブラウザでは不可能です。デスクトップならfonttools(`pyftsubset --flavor=woff2`)か`woff2_compress`が行い、WOFFよりさらに20〜30%ほど減ります。

TTFを本物のOTFに変えられますか。

変えられませんし、正直な道具ならどれも変えられません。TrueTypeは2次曲線、CFFは3次曲線を使い、そのあいだを行き来するのは許容誤差を伴う曲線の当てはめで、アウトラインが変わります。それは変換ではなくフォントを描き直すことです。扱えるのは、拡張子だけが紛らわしい、中身がTrueTypeのアウトラインである`.otf`というよくある場合です。

今もWOFFは要りますか。TTFのままで十分ですか。

サーバーがgzipやbrotliを付けて配るTTFはWOFFに近いところまで縮むので、形式の重みは昔ほどではありません。それでもWOFFは持っておく価値があります。サーバーが圧縮しないときでも縮みますし、意味のあるブラウザはどれも10年前から対応しています。ただし、はるかに大きい効き目があるのは容器ではなくサブセット化です。

変換するとライセンスの許す範囲は変わりますか。

変わりません。OS/2のfsTypeも、すべてのnameレコードもそのまま通るので、埋め込んではいけないフォントはWOFFになっても埋め込んではいけないフォントのままです。サーバーに置く前に配布条件を確かめてください。フォント情報ビューアーがそれらのレコードを表示します。

ここから渡せます

次の一手

このツールが出したものをそのまま受け取れる道具です。