サイトの表示速度が改善した４手順！初心者でもPage Speed Insightsが７倍に！
ブログやサイト運営に、表示速度の改善は欠かせません。表示速度が速いほど、多くのPVに結びつくからです。逆に、サイトの表示速度が遅いと、PV低下の原因になります。まずはPageSpeed Insightsでサイトの表示速度を計測し、遅い場合は改善していきましょう。
サイトの表示速度を改善する方法は、意外と簡単です。特に、あまり手を加えていないサイトほど、飛躍的に表示速度がアップする傾向があります。この記事では、サイトの表示速度を改善する4つの手順を紹介します。実際に同じ対策をほどこした本ブログでは、最大7.4倍も表示速度がアップしました。ぜひ参考にしてください。
目次
PageSpeed Insightsで現在のサイト表示速度を計測
まずはGoogleの表示速度計測ツール「PageSpeed Insights」にアクセスして、改善したいサイトの表示速度を計測してください。下の画像は、改善する前の当ブログのページを計測したときのスコアです。
- モバイル：5
- パソコン：39
この記事で紹介する手順を行ったところ、以下のスコアまで改善されました。
- モバイル：37（7.4倍UP）
- パソコン：66（1.6倍UP）
モバイルでの表示速度が7.4倍も改善していることがわかります。PageSpeed Insightsの「改善できる項目」にのっとって対策しました。なお、PageSpeed Insightsはスコアの算出基準が随時更新されるため、表示される数値や項目は計測時期によって変わります。大切なのは数値そのものより、指摘された項目を一つずつ改善していくことです。
PageSpeed Insightsの「改善できる項目」
PageSpeed Insightsの「改善できる項目」には、サイトの表示速度を改善するヒントが一覧で表示されます。表示速度を改善するには、これらの項目にひとつずつ対策していく必要があります。
今回は、「改善できる項目」のなかでも、特に効果が大きい次の4項目に注目しました。
- レンダリングを妨げるリソースの除外
- テキスト圧縮の有効化
- オフスクリーン画像の遅延読み込み
- サーバー応答時間の短縮（TTFB）
これらの項目は、対策の手間が少なく難易度も低いため、初心者でも手をつけやすい特徴があります。以下でひとつずつ解説するので、ぜひ参考にしてください。
「レンダリングを妨げるリソースの除外」で表示速度を改善する
「レンダリングを妨げるリソースの除外」は、CSSやJavaScriptによってサイトの表示速度が遅くなる現象を解決する方法です。これらはプラグインやテーマによって発生するため、WordPressでサイトを構築している場合に高い効果を発揮します。詳しい解決手順は、「レンダリングを妨げるリソースの除外」をCSSとJSの遅延読み込み処理で解決する方法で解説しています。
「テキスト圧縮の有効化」で表示速度を改善する
Webコンテンツの大部分を占めるテキスト。「テキスト圧縮の有効化」は、容量が大きくなりがちなテキストコンテンツを圧縮して通信することで、サイトの表示速度を改善する方法です。具体的な手順は、「テキスト圧縮の有効化」をhtaccessで解決する方法【コピペ可】をご覧ください。
「オフスクリーン画像の遅延読み込み」で表示速度を改善する
「オフスクリーン画像の遅延読み込み」は、サイトを読み込むときに、まだ画面に表示されていない画像を後から読み込む改善策です。わかりやすさのために画像を多用しているサイトでは、必須の処理だといえるでしょう。WordPressでサイトを構築している場合、プラグインで簡単に対策できます。詳しくは、「オフスクリーン画像の遅延読み込み」をWordPressプラグインBJ Lazy Loadで解決した結果で紹介しています。
「サーバー応答時間の短縮（TTFB）」で表示速度を改善する
ブログサイトなどは、アクセスされたときに複雑な処理をしてブラウザにページを表示しています。そのためサーバーとの応答時間が長くなり、結果としてサイトの表示速度が遅くなってしまうのです。「サーバー応答時間の短縮（TTFB）」では、キャッシュという技術を使って読み込み時間を短縮します。WordPressの場合、プラグインで対応可能です。具体的な方法は、「サーバー応答時間の短縮（TTFB）」をWP Super Cacheで解決【WordPressキャッシュ系プラグイン比較】で解説しています。
なお、TTFBはキャッシュプラグインである程度改善できますが、根本的にはサーバーそのものの性能に大きく左右されます。プラグインで対策しても応答が遅いままの場合は、サーバー環境の見直しも検討してみてください。サーバーごとの速度の違いは、レンタルサーバー速度比較｜WordPressが速いサーバーおすすめ5選で詳しく比較されています。
サイト表示速度の改善は簡単で効果も高い
ブログサイトなどは、表示速度が速いほどユーザーの満足度が高くなります。そのため運営者は、表示速度を改善するための対策をしておきたいところです。この記事で紹介した4つの改善方法は、初心者でも手をつけやすい簡単な内容です。まずは手始めに試してみてはいかがでしょうか。
