フォントのテスト

総称フォント

• 利点: どの環境でも使える （指定ができる）
• 欠点: 但し、環境により実際に適応されるフォントは異なる

Webフォント

• 利点:
  • どの環境でも使える
• 欠点:
  • 利用ライセンス
  • 追加ダウンロードが必要
  • 日本語対応フォントが少ない

サンプルとして２つのみを表示。日本語対応フォントがあれば種類は増やせますが、
Webフォントは、複数のフォントを同時に読み込むと、ページ読み込みに時間がかかるようになります。

ローカルフォント (サーバーサイド)

ローカルフォント Font Access API (未対応)

実用できそうになかったので、調査結果のみメモに残します

状態:

• 利点: 使えるフォントが多い
• 欠点: 環境に依存する
• 欠点: 導入設定が難しい

実験的な機能の試用テストの為、様々な制約があります

• ブラウザ側の設定を変更必要あり ⇛ 利用者にとっての導入の敷居
• 実験的な機能を有効にするためには 「利用者側で」 Google への申請が必要
• 申請で得られるトークンと呼ばれる機密情報を伝えて貰う必要があるため、個人情報扱いの観点からもリスク有
• 仕様が予告なく変更される可能性があります。 ⇛ 常に最新の仕様変更に追従しないといけないので保守が難しい

注意点

WARNING: EXPERIMENTAL FEATURES AHEAD! By enabling these features, you could lose browser data or compromise your security or privacy. Enabled features apply to all users of this browser. If you are an enterprise admin you should not be using these flags in production.

ブラウザ全体のセキュリティ・プライバシーのリスクがあるため、
製品環境・実際のアプリケーションでは使うべきではない、と注意書きがあります

ローカルフォントの設定方法

• chrome://flags/#font-access にアクセスして、設定を Enabled にします。
• Google - Origin Traials に申請して「トークン」を得る ※ (2022/10/26現在、該当項目はなくなってました)
• ページ内ヘッダにトークンを設定する