表示されるフォントが異なる一因

エディタで設定したフォントと異なるフォントがPCやスマホなどで表示される場合、テキストにシステムフォント（System Fonts）が設定されている可能性があります。

この記事では、フォントの設定状況確認から対処方法までをご紹介します。

Tips：システムフォント（System Fonts）とは

システムフォント（System Fonts）は、Studioで設定できるフォントの種類の1つです。システムフォントは、MacやWindows、iOSなどのデバイスにあらかじめインストールされています。

システムフォントをStudioのエディタで設定すると、サイトを閲覧するデバイスやブラウザにそのフォントがインストールされている場合は指定通りに表示されます。

一方、そのフォントが存在しない場合は、デバイスやブラウザで利用可能な別のフォントが自動的に使用されます。

そのため、サイトを見る環境（Mac、Windows、iOSなど）によって指定したフォントとは異なるフォントが表示される場合があります。ただし、設定を工夫することで表示フォントをある程度コントロールすることが可能です。

1. フォント設定状況の確認

問題のテキストにシステムフォントが設定されているか、次の手順で確認します。

検索結果に同じフォント名が表示されれば、問題のテキストにシステムフォントが設定されています。

問題のテキストにシステムフォントが設定されている場合は、 1. システムフォントが原因である場合の対処方法を、そうでない場合は2. システムフォントが原因でない場合の対処方法をご覧ください。

問題のテキストにシステムフォントが設定されている場合の対処方法は、下記の通りです。

システムフォントを利用する場合でも、デバイスごとに最適なフォントを代替え（サブフォント）として指定することで表示をコントロールすることができます。

設定方法は下記記事をご覧ください：

Webフォントを設定すると、どの閲覧環境でも同じフォントが表示されます。システムフォントから、別のWebフォントへ置換してください。

Webフォントは下記サービスから選択できます：

注意：Webフォントに切り替えると、フォントの読み込みが発生します。

サイトの表示速度に影響を与える可能性があるため、システムフォントとWebフォントの違いをあらかじめ把握した上で切り替えを行ってください。