未分類

JINの初期フォントは遅くて重いので、変更してみてもいいかも。

WordPressのテーマ「JIN」はSEO対策が盛り込まれた有料テーマです。しかし、初期設定で使用されるフォントのままだと記事を表示させる為に必要なデータ量が大きく、表示速度に影響することが分かりました。

初期フォントから変更した場合の速度を検証した結果も記載します。表示速度が遅く不満を感じている方は、ぜひご参考ください。

スマートフォンなどのモバイル端末のアクセスを主としたい場合は、知っておくと良いですよ!3GB程度の少ない容量で回線を契約している方も多いので、配慮したWebサイトにしていきたいですね。

初期設定のフォントとデータ量や表示速度

JINを初期設定のままで使用する方は多いです。SEO対策のカスタマイズやチューニングを行わなくても良いことが売りなJINですが、初期設定のフォントや速度について確認してみましょう。

初期設定フォント

初期に設定されているフォントは「角ゴシック(Noto Sans)」。Googleからリリースされており、柔らかい印象とお洒落なデザインのフォントです。

外部からフォントを読み込んで表示する仕様なので、表示速度は遅そうですね。

データ量や表示速度を確認してみよう

記事を表示するために必要なデータ量や表示速度の計測に利用したツールは次の2つ。うまくリンク先に遷移できない場合は、カッコ内のURLを直接指定してください。

測定したい記事のURLを貼り付けるだけで簡単に速度を確認することができるのでオススメです。データ量や速度以外も確認できますが、今回は割愛します。

GTmetrix

パフォーマンスのスコアは悪くさそうですが、データ量が「8.5MBという結果に…。1記事表示するのにこれだけの容量が必要だとは全く思っていなかったので、驚きました。

 

Pingdom Tools

こちらもGTmetrixと同じ程度のデータ量です。ツール毎に仕様が異なるので多少のサイズ差は誤差と考えています。 

分析結果を細かく見ていくとフォントに関する項目が上位を占めており、データサイズや表示速度に関係していることが分かります。

デフォルトのフォントに変更

初期設定の「角ゴシック(Noto Sans)」では、外部からフォントを読み込むため、データ量が大きいことを確認しました。負荷の軽いフォントに変更することで、データ量が変化するか検証してみたいと思います。

変更するフォント

変更先のフォントはWebサイトで広く使われている「デフォルト(sans-serif)」。外部からフォントを読み込む動作ではないので、データ量や表示速度の改善が見込めそうです。

フォントの変更方法

フォントの変更は簡単に行うことができます。変更手順は、JINのマニュアルを参考ください。

JINでフォントを変更する方法

https://jin-theme.com/manual/font/

フォント変更後のデータ量や表示速度

性能が変化するか検証して確認していきましょう。

GTmetrix

なんとデータ量が「8.5MB」→「736KBまで大幅に減少しました!およそ11分の1のサイズです。表示速度も「1秒」ほど短縮ていました。

 

Pingdom Tools

こちらも同様にデータ量と表示速度が大幅に改善されていますね!

詳細な分析結果を確認してみましょう。

フォント変更前の結果より、大幅にフォントの割合が減少しています。順位が上位の項目も存在しますが、値自体が小さいので問題はありません。

まとめ

初期設定のフォントを負荷の低いフォントへ変更することで、データ量を「11分の1」、表示速度を「1秒」も改善させることができました

検証結果サマリ
フォントGTmetrixPingdom Tools
データサイズ表示速度データサイズ表示速度
角ゴシック(Noto Sans)8.5 MB3.5 秒9 MB2.69 秒
デフォルト(sans-serif)736 KB2.3 秒750 KB2.13 秒

データ量や速度でお悩みの方は、フォントを変えてみることで性能が改善するケースもありますので、試してみていただければと思います。