滅多にない症状かもしれませんが、もし同じ不具合で苦しんでいる方もいらっしゃるかもしれないので参考になれば幸いです。
突然サイトのフォントが狂う
なぜか私がメインで使用しているWindowsパソコンでは、WEBサイトの英字・数字が筆記体になってしまいめっちゃ読みにくい状態に。この症状、Chrome、Firefox、Microsoft Edgeなどどのブラウザを使用しても同じように表示されますし、もちろんサイトが適用しているフォントはこれとは違うフォントです。
他のWindowsパソコンでは普通にWEBサイトが指定しているフォントで表示されているため、メインパソコンだけの問題だということが分かります。(サブパソコンであるWindows10ノートパソコンでも同様の不具合が発生しました)
データクローンでシステムが壊れた?
メインパソコンはストレージを何度か交換しているのですが、ストレージ交換の度にデータを新しいストレージにクローンしており、もしかしたらそれが原因でシステムデータが一部破損し今回のような不具合が起きてしまった可能性があります。
こうなったらクリーンインストールすれば手っ取り早いのですが、クリーンインストール前の状態に復旧させるのが面倒なので他に何か手は無いか探ってみることに。
別のパソコンでも起こった
主にWEBサイト制作の仕事で使っているWindows10ノートパソコンでも同様の不具合が起こりました。
原因判明
取り敢えず英字フォントの時だけおかしいので適用されているフォントが何かWordなどでフォントを一つ一つ探してみることにしました。
すると「Font Easy Street Alt EPS」というフォントがなぜかNoto Sansフォントと誤認識されていることが判明。
パソコンにインストールされているフォントは「C:\Windows\Fonts」の中に入っているので、「Font Easy Street Alt EPS」を取り敢えずUSBメモリとかにバックアップし削除。そして再インストールしてみた所、上記画像のように正しいフォントが適用されました。
Chat GPTにも聞いてみた
より具体的な原因や解決方法が無いか2023年話題のChat GPTにも質問してみました。
WEBサイトのフォントが筆記体に入れ替わってしまう問題は、通常、次のような理由によって発生します。
- ユーザーのコンピューターにフォントがインストールされていない。
- ユーザーのブラウザーが、サイトが使用するフォントを正しく読み込めていない。
- サイトのCSSに不具合がある。
以下の手順を実行することで、この問題を解決できます。
- フォントがインストールされているか確認する。
- 「スタート」メニューから「設定」を選択し、「詳細設定」をクリックします。
- 「フォントと言語の設定」を選択し、「フォント」タブを選択します。
- インストールされているフォントのリストが表示されます。必要なフォントがインストールされていない場合は、インターネットからダウンロードしてインストールしてください。
- ブラウザーキャッシュをクリアする。
- ブラウザーを開きます。
- 「設定」または「オプション」を選択します。
- 「プライバシーとセキュリティ」を選択します。
- 「キャッシュ」または「履歴」を選択します。
- 「クリア」または「削除」をクリックして、ブラウザーキャッシュをクリアします。
- サイトのCSSを確認する。
- ブラウザーでサイトを開きます。
- ページの右クリックをし、「検証」を選択します。
- 「Elements」または「要素」タブをクリックし、CSSを確認します。
- サイトのCSSに問題がある場合は、Webサイト管理者に問い合わせて修正してもらうか、自分で修正する必要があります。
これらの手順を実行することで、フォントの問題を解決することができます。
Chat GPTは、OpenAIが開発した人工知能システムで、自然言語での応答を生成します。ただし、提供される情報は最新ではなく(2021年9月までの情報)正確性を保証するものではないため、当ブログでは参考程度に使用しています。
専門分野の問題については、専門家に相談することをおすすめします。
まとめ
今回は「Font Easy Street Alt EPS」が原因でしたが、別のフォントでも同じ症状が起こる可能性があるので、もしWEBサイトのフォントがおかしいと感じた場合は、怪しいフォントを探して、見つけたら該当フォントをバックアップし削除。バックアップしたフォントを再インストールしてみてください。
ノートパソコンの場合
ノートパソコンの場合、「Font Easy Street Alt EPS」と後「Edwardian Script ITC」を削除+ブラウザのキャッシュクリアを行うことで改善しますが、これらのフォントを入れ直すと、再び筆記体フォントになってしまう問題がありました。