MacOS Safariでは
游ゴシックは使えない？！

游ゴシックはその美しいデザインと高い可読性から、多くのデザイナーやクリエイターに愛用されWebページだけではなく、印刷物にも多く登場していました。

しかし、MacOS Safari・Brave・Firefox（プライベートウィンドウ）ではもう游ゴシックが正しく表示されないという問題が報告されています。

今回は、コーダーさんに依頼する時のaiデザイン注意点シリーズとして游ゴシックが正しく表示されない原因をシェアしていこうと思います。

文字をWeb上に表示させるには

游ゴシックの話の前に、Web上に文字を表示させるプロセスについてを知る必要があります。

まず、Web上で文字情報を表示するためには、HTMLタグ内に文字情報を流し込んで表示するのが最もシンプルな方法です。（文字を画像化して表示させる方法もありますが今回は割愛します）

その時に、表示させるフォントを「システムフォント（デバイスフォント）」と「Webフォント」の2種類から選択します。

デバイスフォント

このデバイスフォントとは、もともとのコンピューターのOS（オペレーティングシステム）にインストールされているフォントを指します。

サーバーにあるフォントデータを読み込む必要がないため、その分表示が速くなる特徴があります。

しかし、ユーザー端末のOSやそのバージョン、iOSやAndroidなどでもデバイスフォントはそれぞれ異なっているため、特定のフォントを表示させるようCSSで指定していても、ユーザーがそれをインストールしていない場合、指定したフォントでは描写されません。

webフォント

「Webフォント」は、あらかじめサーバー上に置かれたフォントやインターネット上で提供されているフォントを呼び出し、Webページ上に表示する仕組みです。

Googleフォントがその代表格で和文・欧文ともに多種多様のフォントを提供しており、違うデバイスでも同じフォントが表示されることが大きな特徴です。

MacOS Safariで游ゴシックが表示されない原因

フィンガープリントの問題

フィンガープリントとは、ウェブサイトがユーザーのデバイスやブラウザの設定を収集して、ユーザーを特定する技術です。

フィンガープリントにはいくつもの種類がありますが、そのなかには各コンピュータにインストールされたローカルフォントの一覧の情報を利用して、あなたのブラウザを特定する「フォント フィンガープリント」と呼ばれるものも存在します。

個人を特定するため、プライバシー保護の観点から懸念されることがあり、Safari • Brave • Firefox はインストール済みのローカルフォントに関しては表示させないという強力な保護対策を講じています。

MacOSではデバイスフォントではない

実は、游ゴシックはMacOSの追加ダウンロードフォント扱いで、標準では搭載されていません。

よく見るフォントなので、デバイスフォントだと思いきや、搭載されていませんでした。

結論

以上、2つの原因を踏まえると、Macでは游ゴシックがデバイスフォントではないため、仮にデバイスにインストールされていたとしても、ローカルフォント扱いとなり、フィンガープリントの観点から表示されない、ということになります。

ユーザー数の多い Chrome はというと、こちらは現在もユーザーがインストールしたフォントもローカルフォントとして扱い、ブラウザで表示が可能な仕様になっており、引き続きMacでも游ゴシックの表示が可能です。

まとめ

フォント選びはWebサイトを構築する上で重要な役割を果たします。

日々アップデートされるOSやサービスの情報を追いかけ、サイトの要件にあわせた最適なフォント選びを心がけていきたいです。