2.

OTF(.otf)|OpenType の CFF アウトラインと feature tag・Variable Fonts

編集
この記事の要点
  • OTF(OpenType Font)は Microsoft と Adobe が 1996 年に共同策定し、TrueType の SFNT コンテナを継承しつつ PostScript の CFF アウトライン を扱えるように拡張した形式
  • 拡張子は .otf(CFF 系)または .ttf(TrueType アウトライン使用時)。後者を「TrueType-flavored OpenType」と呼ぶ
  • CFF(Compact Font Format)は三次ベジェ曲線で、二次ベジェの TTF より曲線表現が滑らか。Adobe のフォント遺産がそのまま使える
  • OpenType LayoutGSUB / GPOS / GDEF)により、合字(liga)・スワッシュ(swsh)・小型大文字(smcp)・カーニング(kern)など高度なタイポグラフィ機能を実現
  • feature tag 4 文字コードで機能を指定:liga(標準合字)dlig(任意合字)kernonum(オールドスタイル数字)など 100 以上
  • OpenType Variable Fonts(OpenType 1.8, 2016)でひとつのファイルに複数ウェイト / 幅 / イタリックを連続的に格納可能。wght/wdth/ital/opsz
  • 事実上の業界標準。Adobe Fonts / Google Fonts / モリサワパスポート のほぼ全フォントが OpenType

概要

OTF(OpenType Font)は、Microsoft と Adobe が 1996 年に共同策定したフォント形式です。当時、Apple の TrueType(TTF)と Adobe の PostScript Type 1 という二大規格が併存しており、OS ごとに対応が分かれて混乱していました。これを終わらせるために両社が手を組み、TrueType の SFNT コンテナをそのまま流用しつつ、Adobe の PostScript 遺産である CFF(Compact Font Format)アウトライン も内部に格納できるように拡張したのが OpenType です。2007 年には ISO/IEC 14496-22(Open Font Format)として国際標準化されました。

OpenType フォントは内部のアウトライン形式によって 2 種類に分かれます。CFF 系は三次ベジェ曲線で字形を表現し(Adobe フォントの伝統)、拡張子は通常 .otfTrueType 系は二次ベジェのまま OpenType の拡張機能を載せたもので、拡張子は .ttf のまま使われ「TrueType-flavored OpenType」と呼ばれます。Windows / macOS / Linux ともに両方を透過的に扱えるため、利用者はあまり区別を意識する必要がありません。

OpenType の真価は OpenType Layout と呼ばれる高度な組版機能にあります。GSUB(Glyph Substitution)テーブルでグリフを別のグリフに置換(合字・装飾文字・縦組み専用字形)、GPOS(Glyph Positioning)テーブルでグリフ位置を微調整(カーニング・マークアタッチ)、GDEF でグリフ分類を定義します。これらは feature tag と呼ばれる 4 文字コードで管理され、liga(標準合字)kern(カーニング)smcp(小型大文字)onum(オールドスタイル数字)swsh(スワッシュ)など 100 を超える機能が標準登録されています。

2016 年の OpenType 1.8 では Variable Fonts(可変フォント)が導入されました。これはひとつのフォントファイルに複数のウェイト・幅・斜体を 連続的な軸 として格納する画期的な仕組みで、wght(重さ 100〜900)wdth(幅)ital(イタリック)opsz(光学サイズ)といった軸を CSS の font-variation-settings から自由に補間できます。Web 配信のサイズ削減と、デザイン自由度の向上を同時に実現する技術です。

内部構造(OpenType 固有テーブル)

テーブル名役割
CFF / CFF2PostScript アウトライン(三次ベジェ)。CFF 系 OTF で glyf の代わり
GSUBグリフ置換(合字・装飾・スクリプト固有)
GPOSグリフ配置(カーニング・マークアタッチ)
GDEFグリフ分類定義(基底字・マーク・合字)
BASEベースライン情報
JSTFジャスティフィケーション
fvar / gvar / HVARVariable Fonts 用:軸定義・グリフ変形・メトリック変形
COLR / CPALカラーフォント(パレット + レイヤー)
SVGSVG ベースカラーフォント

主な用途

  • DTP・出版:Adobe InDesign / Illustrator / Photoshop は OpenType 機能(合字・スワッシュ・小型大文字)をフル活用できる。商業印刷の事実上の標準。
  • Web フォント:Google Fonts / Adobe Fonts の配信はすべて OpenType(多くは WOFF2 でラップ)。font-feature-settingsfont-variation-settings で OT 機能を CSS から制御。
  • 多言語組版:アラビア語・ヒンディー語・タイ語など、文脈で字形が変わるスクリプトは OpenType Layout が不可欠。
  • カラー絵文字フォント:Microsoft の Segoe UI Emoji(COLR/CPAL)、Apple の Apple Color Emoji(sbix)、Google の Noto Color Emoji(CBDT/CBLC)など、いずれも OpenType 拡張。
  • 可変フォント:Roboto Flex、Inter、Source Sans Variable など、Web 配信サイズと表現力を両立。

feature tag の代表例(CSS から制御)

/* 標準合字 (fi, fl) を有効化 */
.text {
  font-feature-settings: "liga" on, "kern" on;
}

/* オールドスタイル数字 + 小型大文字 */
.elegant {
  font-feature-settings: "onum" 1, "smcp" 1;
}

/* 可変フォント (Variable Font) */
.heading {
  font-family: "Roboto Flex", sans-serif;
  font-variation-settings: "wght" 650, "wdth" 110, "opsz" 24;
}
tag機能
liga標準合字fi → fi、fl → fl
dlig任意合字(装飾用)ct → ct(書道風)
kernカーニング(字間調整)AV → 詰める
smcp小型大文字hello → HELLO(小さい大文字)
onumオールドスタイル数字1234567890(高さがバラバラ)
tnum等幅数字表組み用
swshスワッシュ(装飾末尾)Q の長い尾
loclロケール固有字形セルビア語の и

関連形式との比較

項目OTF(CFF)TTFType 1(廃止)
アウトライン三次ベジェ(CFF)二次ベジェ三次ベジェ
合字・カーニングGSUB/GPOS(高度)OpenType 拡張で同等限定的
可変フォント○(CFF2)×
OS 対応全 OS全 OSAdobe が 2023 終了
主な配布元Adobe Fonts, Google FontsNoto, IPA 等歴史的

編集ツール

  • Glyphs 3(macOS):プロのフォントデザイナーの主流。OpenType 機能を GUI で組める。
  • FontLab 8(Win/Mac):商用フォント制作の老舗、Variable Font に強い。
  • FontForge(OSS):無料で OTF 編集できる定番。
  • fonttools(Python):otf2ttf / ttf2otf / pyftsubset / fontmake など CLI 群。CI / 自動化と相性が良い。
  • Adobe Font Development Kit (AFDKO)makeotf を含む Adobe 公式ツールチェイン。

注意点・落とし穴

  • CFF と TrueType のヒンティング差:CFF OTF はヒンティングが弱いとされてきたが、近年の DirectWrite / CoreText では差は小さい。古い Windows GDI ではぼやけることがある。
  • feature tag は実装依存:フォントに swsh が定義されていなければ CSS で指定しても何も起きない。fonttools ttx でテーブルを確認する。
  • Variable Font の対応:IE / 古い Edge / 古い Safari は非対応。フォールバックを用意する。
  • サブセット化:日本語可変フォントをそのまま Web で読ませると数 MB になる。pyftsubset でグリフを絞り、unicode-range で分割配信する。
  • ライセンスの粒度:「Web フォントとしての利用」「アプリへの埋め込み」「PDF 埋め込み」「サブセット化」が個別に許諾される EULA が多い。商用は必ず確認する。

関連リンク

編集
Post Share
子ページ

子ページはありません

同階層のページ
  1. TTF(.ttf)
  2. OTF(.otf)
  3. WOFF(.woff)
  4. WOFF2(.woff2)
  5. EOT(.eot)
  6. TTC / OTC(.ttc / .otc)
  7. PFB / PFM / Type 1(.pfb / .pfm)
  8. AFM / BDF / PCF(.afm / .bdf / .pcf)

最近更新/作成されたページ