メインコンテンツにスキップ

Web フォントのサブセット化

Supriya Bisht avatar
対応者:Supriya Bisht
昨日アップデートされました

サブセット化とは?

Web アプリケーションで使用するために Web フォントのデプロイを行う場合、ページパフォーマンスやフォントファイルサイズの最適化が非常に重要になります。サブセット化とは、フォントに必要なものだけを含めるプロセスで、これはフォントのファイルサイズにほぼ 1 対 1 の影響をおよぼします。

プロ仕様にデザインされたフォントは、複数の言語、OpenType 機能、特殊文字やシンボルなどをサポートしています。そのため、例えば Web アプリケーションでサポートする必要があるのが 1 つの言語のみである場合、Web プロジェクトやデジタル広告でフォントのサブセット化を行って、その言語に必要なキャラクターとグリフのみを含めるようにすることで、アプリケーションのパフォーマンスとページ読み込み時間を大幅に改善することができます。


Web フォントのサブセット化

それでは、Web プロジェクトやデジタル広告で、フォントをサブセット化する方法を見ていきましょう。

  1. 最初に、Web プロジェクト(今回の場合はサンプルの Web プロジェクト「Web Project 01」)をクリックして、右のメインビューで開きます。

  2. メインビューで Web プロジェクトを開いたら、右上の[Subset Fonts(フォントをサブセット)]ボタンをクリックします。

    A blue rectangle with text

Description automatically generated
  3. [Subsetting fonts(フォントのサブセット)]ダイアログの左側で、サブセット化を行うフォントスタイルを選択します。すると、以下に示す通り、右側にサブセット化のオプションが表示されます。

A screenshot of a screenshot of a computer

Description automatically generated

All characters(すべてのキャラクター):デフォルトの選択です。この設定にはフォントスタイルによってサポートされているすべてのグリフが含まれます。

All Characters

Common characters(一般的なキャラクター):ラテン系言語で最もよく使用されるグリフとキャラクターが含まれるようにしたい場合、このオプションを選択します。ほとんどの場合、これで問題なく機能します。

Common Character Subsets

Choose languages(言語を選択):サポートする必要がある言語(および関連のキャラクターセット)を正確に指定する場合は、このオプションを選択します。日本語、中国語、韓国語のいずれかを選択した場合、Web フォントには自動的に、ヒューリスティックサブセット化が行われ、これによってパフォーマンスが向上します。

A screenshot of a computer

Description automatically generated

Choose specific characters(特定のキャラクターを選択):キャラクターセットから特定のグリフを選択してフォントに含める場合、このオプションを選択します。

A screenshot of a computer

Description automatically generated

特定のキャラクターを入力します。

Enter specific characters(特定のキャラクターを入力):指定したキャラクターのみをフォントファイルに含める場合、このオプションを選択します。それ以外のキャラクターは除外されます。

A screenshot of a computer

Description automatically generated

Include OpenType features(OpenType 機能を含める):代替キャラクター、合字などの OpenType 機能を含める場合、このオプションを使用します。

Include Open Type Features

注記:サブセット化の選択を行うと、選択したスタイルのファイルサイズの変化の結果を確認することができます。

4.設定が完了したら、[Save(保存)]ボタンをクリックします。

Save_01


ヒューリスティックサブセット化と東アジア言語での操作

ヒューリスティックサブセット化は、言語における文字の使用頻度に基づき、事前にスライスされた文字のサブセットを提供します。これによって、CDN は要求されたグリフを含むサブセットのみを提供するため、ブラウザーはフォントを適切なスタイルでスピーディにレンダリングできます。ブラウザーは、各グリフセットを要求するたびにフォントファイルをリアルタイムでサブセット化する必要がありません。ダイナミックサブセット化を行う場合、ブラウザーがテキストを適切なスタイルでレンダリングするのに時間がかかります。

Monotype Fonts では、ダイナミックサブセット化は廃止されています。すべての日本語、中国語簡体字、中国語繁体字、韓国語の Web フォントは、[Choose languages(言語を選択)]サブセット化オプションでこれらの言語を選択することで、ヒューリスティックにサブセット化できます。


旧 Web プロジェクトとデジタル広告

新世代の Web フォントおよびデジタル広告ホスティングサービスが導入されています。これにより、旧テクノロジは廃止され、現在、古い Web プロジェクトやデジタル広告でできる操作は限られています。詳細はこちらをクリックしてご覧ください

こちらの回答で解決しましたか?