この記事の対象: 日本語Webフォントの導入・選定を行うWeb制作者
読了時間: 約12分
コーディングに入る前に「フォントどうする？」という話が出て、Google Fontsでいいのか、有料サービスを入れるべきか迷った経験はないでしょうか。
書体のデザイン比較なら他にいくらでも記事があります。この記事ではそこには踏み込まず、調達方法の違い・料金体系の構造・納品後の契約主体に絞って整理します。「あのフォント良いよね」で終わらない、実務で避けて通れない判断軸の話です。
Googleフォントとの線引き
まず前提を整理します。Googleフォントで間に合う案件に、わざわざ有料フォントを入れる必要はありません。
Noto Sans JP・Noto Serif JPをはじめ、M PLUS 1pやZen角ゴシックなど、Google Fontsに収録される日本語書体はここ数年で着実に増えています。無料・CDN配信・導入が簡単という三拍子が揃っており、書体にこだわりの指定がないコーポレートサイトであればこれで十分です。
有料フォントが選択肢に入るのは、主に次のような場面です。
- ブランドガイドラインで書体が指定されている（新ゴ、リュウミン、筑紫書体など）
- 印刷物やパッケージと書体を統一する必要がある
- Google Fontsにはない書体でデザインの方向性を出したい
- クライアント側に「フォントにコストをかける」判断がある
この境界線を見誤ると、不要なコストを積むか、逆にデザインの幅を狭めることになります。案件の初期段階で「Googleフォントで行くか、有料を入れるか」を決めておくと、見積もりも制作もスムーズです。
有料日本語Webフォントの調達方法は3つ
有料の日本語Webフォントを使う方法は大きく3つに分かれます。同じ書体でも調達方法によってコスト構造がまったく異なるため、ここを理解しないまま選ぶと後悔します。
サブスクリプション型（定額制）
月額または年額の固定料金で、対象フォントが使い放題になるタイプです。
Adobe Fonts はCreative Cloudのサブスクリプションに含まれています。PhotoshopやIllustratorを契約していれば追加費用なしで使えるため、制作者にとっては最もハードルが低い選択肢です。日本語書体も年々充実しており、モリサワやフォントワークスの主要書体がカバーされています。
Morisawa Fonts はモリサワが提供する年額制のサブスクリプションで、デスクトップとWebの両方で使えます。モリサワ書体を本格的に使う案件では有力な候補です。
定額制なのでPV（ページビュー＝ページが表示された回数）が増えてもコストが変わらない安心感があります。一方で、解約するとフォントが使えなくなるため、納品後に誰が契約を維持するかが問題になります。
PV課金型（従量制）
月間のページビュー数に応じて料金が変動するタイプです。
TypeSquare（モリサワ）とFONTPLUS（SBテクノロジー）がこの方式の代表です。国内フォントメーカーの書体を幅広くカバーしており、日本語Webフォント専業サービスとしての実績があります。プランごとにPV上限が設定されており、超過時の挙動はサービス・プランによって異なります。
小規模サイトなら低コストで始められる反面、PVが伸びるとコストも上がるという構造的なリスクがあります。
買い切り型
フォントのWebライセンスを一度購入すれば、継続的な費用がかからないタイプです。
ただし、日本語Webフォントを買い切りで入手できる選択肢は限られています。多くのメーカーがサブスク型やPV課金型に移行しており、買い切りライセンスを提供している書体は少数です。特定の1書体だけを長期間使い続けることが確定している場合には検討の余地があります。
3方式の比較
| サブスク型 | PV課金型 | 買い切り型 | |
|---|---|---|---|
| 代表例 | Adobe Fonts、Morisawa Fonts | TypeSquare、FONTPLUS | 各メーカー個別販売 |
| 料金の動き方 | 月額/年額で固定 | PV数で変動 | 購入時のみ |
| PV増加の影響 | なし | コスト増 | なし |
| 書体の選択肢 | 多い | 多い | 限定的 |
| 解約時 | フォント使用不可 | フォント使用不可 | 影響なし |
※料金体系・収録書体は各サービスで随時変更されます。導入前に公式サイトで最新情報を確認してください。
定額型（サブスク）
- PV増でもコスト一定
- CC契約者は追加費用なし
- 大規模サイトに向く
従量型（PV課金）
- 小規模なら低コスト
- 日本語書体の品揃えが広い
- PV増でコスト増リスクあり
PVが安定して少ない小規模サイトならPV課金型のコスト効率が良く、PVが読めない、または成長を見込むサイトなら定額型が安全です。
案件の条件から逆算して選ぶ
「どのサービスが良いか」より先に、案件の条件に当てはめて消去法で絞るのが実務的です。
この順番で確認すれば、最初のステップで選択肢がかなり絞り込めます。
Creative Cloud契約者なら、まずAdobe Fonts
制作者側でCreative Cloudを契約しているなら、Adobe Fontsが追加費用ゼロの最初の選択肢です。収録されている日本語書体の中にクライアントの要件を満たすものがあれば、それ以上の検討は不要です。
ただし注意点が一つ。Adobe Fontsは契約者のアカウントに紐づく仕組みです。制作者のアカウントでWebフォントを設定したまま納品すると、そのアカウントを解約した時点でフォントが表示されなくなります。この引き継ぎ問題については後述します。
書体指定があるならサービスは自動的に決まる
「新ゴを使いたい」「筑紫明朝を入れたい」のように書体が決まっている場合、その書体を配信しているサービスを選ぶしかありません。比較の軸は「定額と従量のどちらが安いか」に絞られます。
モリサワ書体ならTypeSquareかMorisawa Fonts、フォントワークスの書体ならFONTPLUSが候補です。同じ書体でも料金体系が違うため、案件のPV規模に合わせて選びます。
PVの多いサイトでは定額型を選ぶ
PV課金型のサービスでは、月間PVが増えるほど上位プランが必要です。PVが月間数十万を超えるメディアサイトやECサイトでは、フォントの年間コストが無視できない金額になることがあります。
PVの大きなサイトでは定額型を選ぶか、あるいは見出しだけ有料フォント・本文はGoogleフォントという組み合わせでコストを抑える方法もあります。全文に有料フォントを適用する必要があるかどうか、デザインの段階で検討する価値があります。
見積もりの段階でフォントの年間コストをどう扱うかは、費用の内訳と比較の考え方を参考にしてください。
PV課金型の落とし穴
PV課金型は小規模サイトでは手軽ですが、想定外のコスト増が起きやすい構造を持っています。制作時に把握しておかないと、運用フェーズでトラブルになります。
見積もり時と運用時のPVは一致しない
制作時点ではサイトが公開されていないため、月間PVは予測でしかありません。「月5万PVくらいだろう」と見込んでプランを選んだのに、広告出稿やSNSでの拡散で一時的にPVが跳ね上がることは珍しくありません。
上限を超えたときの挙動はサービスによって異なります。フォント配信が停止してシステムフォント（端末にインストールされている標準フォント）に切り替わるケース、超過分を追加請求されるケースがあり、契約前に必ず確認が必要です。
クライアントに説明しにくい料金体系
「ページの閲覧数が増えるとフォントの料金が上がる」という仕組みは、Web制作に詳しくないクライアントには直感的に理解しにくいものです。見積もり段階でこの仕組みを伝えないまま進めると、運用開始後に「聞いていなかった」と問題になります。
対策は単純で、見積書にフォントの料金体系と想定PV帯を明記することです。「月間○万PVまでは月額○円、超過時は△△になる」と書いておけば、後のトラブルを防げます。
納品時に見落としがちな「契約の引き継ぎ」
日本語Webフォントの導入で最も問題になりやすいのが、納品後の契約主体です。制作中は自分のアカウントでフォントを設定するのが楽ですが、そのまま納品すると後で必ず困ります。
制作者アカウントで入れたフォントの末路
Adobe FontsでもTypeSquareでも、フォントは契約者のアカウントに紐づいています。制作者が自分のアカウントで設定したまま納品し、その後アカウントを変更・解約すると、クライアントのサイトからフォントが消えます。
CSSにフォールバック（代替フォント）が書いてあれば文字自体は表示されますが、デザイン上の意図からは外れたものになります。クライアントから見れば「デザインが崩れた」という認識になり、信頼に関わります。
レンタルサーバー付属のWebフォント機能
エックスサーバーやさくらのレンタルサーバーなど、一部のレンタルサーバーではTypeSquareのWebフォント機能がサーバー契約に付属しています。
この方法の利点は、契約の引き継ぎ問題がほぼ発生しないことです。フォントの契約がサーバー契約と一体になっているため、サーバーを使い続ける限りフォントも維持されます。使える書体やPV上限に制限はありますが、特定の書体指定がない案件では真っ先に確認する価値があります。
引き継ぎで確認すべきこと
- フォントサービスの契約主体は誰か（制作会社か、クライアントか）
- クライアント側でアカウントの作成と支払い設定を済ませたか
- 配信用のタグやAPIキーをクライアントのアカウントのものに差し替えたか
- サーバー付属のWebフォント機能で代替できないか検討したか
- フォントが切れた場合のフォールバック指定（font-family）は適切か
制作会社を乗り換える際にも、前の会社のアカウントに紐づいたWebフォントが使えなくなるケースは多くあります。引き継ぎ時のチェック項目として忘れずに含めてください。
乗り換えコストと、後から効いてくる制約
一度導入したWebフォントを別の書体に切り替えるのは、想像以上に手間がかかります。「フォントを変えるだけ」では済まない理由を知っておくと、最初の選定が慎重になります。
フォント変更は全ページに波及する
Webフォントはサイト全体のCSSで指定されているため、書体を変更するとすべてのページに影響が出ます。
- 行間（line-height）の再調整が必要になる。フォントごとに文字の高さや上下の空きが異なるため、同じ数値でも見た目が変わります
- 字間（letter-spacing）のバランスが崩れる。特に見出しで目立ちます
- 改行位置がずれる。文字幅の違いにより、意図した位置で折り返されなくなることがあります
ページ数が多いほど確認と修正の工数がかさみます。フォントの変更は「差し替え」ではなく「全ページの表示調整を含む改修作業」と見積もるべきです。
フォールバックの設計は導入時にやる
将来フォントサービスを切り替える可能性を考えて、CSSのfont-familyにはフォールバックを適切に指定しておきます。
font-family: "指定フォント名", "Noto Sans JP", "Hiragino Kaku Gothic ProN", sans-serif;
有料フォントが外れてもNoto Sans JPやヒラギノに落ちるよう設計しておけば、表示の崩れを最小限に抑えられます。これは導入時のひと手間で済むので、最初にやっておくのが鉄則です。
よくある質問
Googleフォントと有料フォントで見た目の差はどれくらいありますか？
書体のデザインが異なるため比べれば違いはわかりますが、Noto Sans JPなど品質の高い無料書体もあり、有料が常に優れているわけではありません。有料フォントが必要になるのは、特定の書体がブランドで指定されている場合や、Googleフォントにはないデザインの方向性が求められる場合です。
Adobe Fontsで設定したWebフォントを、クライアントにそのまま引き渡せますか？
そのままでは引き渡せません。Adobe Fontsは契約者のアカウントに紐づくため、クライアント自身がCreative Cloudを契約し、クライアントのアカウントでフォントを設定し直す必要があります。制作者のアカウントのまま納品すると、解約時にフォントが消えます。
PV課金型で上限を超えたらどうなりますか？
サービスやプランによって異なります。フォント配信が停止してシステムフォントに戻るケースと、超過分が追加課金されるケースがあります。導入前に公式サイトで超過時の挙動を必ず確認してください。
レンタルサーバー付属のWebフォント機能で十分ですか？
使える書体や月間PVに制限はありますが、基本的なゴシック体・明朝体が揃っていれば多くのコーポレートサイトでは十分です。サーバー契約に含まれているため追加コストがなく、契約の引き継ぎの心配も不要です。特定の書体指定がない案件ではまず確認する価値があります。
日本語Webフォントで表示速度は遅くなりますか？
日本語フォントはファイルサイズが大きいため、英語フォントより読み込みへの影響は出やすくなります。Google FontsやTypeSquare、FONTPLUSなどの主要サービスではサブセット配信（使用する文字だけを抽出して配信する仕組み）が標準で行われており、影響は軽減されています。font-displayプロパティの設定やPreloadによる先読みと組み合わせれば、体感速度への影響はさらに小さくなります。
まとめ
日本語Webフォントの選定は、書体の好み以前に調達方法と契約構造の問題です。
- Googleフォントで要件を満たせるなら、それが最もシンプルで確実
- Creative Cloudを契約しているなら、Adobe Fontsを最初に検討する
- 書体が指定されていれば、その書体を配信しているサービスから料金体系で選ぶ
- PV課金型は小規模サイト向き。PVの増加が見込まれるなら定額制が安全
- 納品後に誰が契約を維持するかを、制作開始前に決めておく
「どのフォントが綺麗か」だけで選ぶと、あとから契約やコストの問題で苦労します。調達方法と引き継ぎの段取りまで含めて「選ぶ」ことが、実務では何より大事です。
