PageSpeed Insights(ページスピードインサイト)とは
SEOやWebマーケティング関連の仕事に就いている方であれば、PageSpeed Insightsをご存知の方は多いかと思います。
Googleが提供しているサービスの一つで、Webサイトの表示速度の改善をサポートしてくれるツールです。
Webページの表示速度は、SEOの検索順位決定の要因としてはわずかなものと言われていますが、ページ表示速度が遅いことはユーザーに与えるストレスを増加させ、離脱率などを高めてしまいます。
ですから、表示速度はSEOというよりは、ユーザビリティの面から改善が必要になります。
PageSpeed Insightsを活用することで、自社サイトの表示速度がどうなっているか、また改善するならどのポイントかを調べることが可能です。
ページスピードインサイトの使い方
以下にアクセスして、表示速度を調べたいURLを入力し、分析ボタンをクリックしてください。
https://developers.google.com/speed/pagespeed/insights/?hl=ja
こちらのツールはPCとモバイルページを同時に分析することが可能です。
表示速度改善のための施策がどれだけできているか、100点満点で結果が算出されます。
今回は、PageSpeed Insightsの分析結果で「ブラウザのキャッシュを活用する」の項目が出る理由と、改善方法についてお話しします。
「ブラウザのキャッシュを活用する」が問題点になる理由
この項目が表示された時は、ファイルのキャッシュを許可する設定になっていないことが代表的な理由として挙げられます。
また、キャッシュの有効期間が短すぎる場合にも、こちらが表示されることがあります。
つまり、同じページにアクセスした際に、毎回同じ情報をサーバーにリクエストしダウンロードを行っている分だけ、表示速度が遅くなっているということです。
キャッシュを有効にしておけば、次回アクセスした際はキャッシュの情報を使用できるため、読み込み時間を短縮して表示させることができます。
改善策について
キャッシュを有効にさせる問題の具体的な改善方法には、.htaccessにディレクティブを追加することが挙げられます。
=============== ExpiresActive On ExpiresByType text/javascript "access plus 1 months" ExpiresByType text/css "access plus 12 hours" ExpiresByType image/gif "access plus 1 weeks" ExpiresByType image/jpeg "access plus 1 weeks" ExpiresByType image/png "access plus 1 weeks" ===============
上記は、画像やjavascriptやcssのキャッシュ期限を設定する場合です。
期間の設定期日に関して、Googleは1週間以上・最大1年間に設定するよう推奨しています。
それでも頻繁に変更されるようなファイルについては、短い有効期間の設定でも構わないとしています。
たとえば、htmlは一般的にキャッシュの設定をしないのが一般的です。
修正した.htaccessファイルをサーバーに適用後、再度PageSpeed Insightsで調査してみてください。
再度の分析結果で“ブラウザのキャッシュを活用する”が表示されなければ解決となります。
ブラウザキャッシュ活用についての注意点
Webサイトを運営していると、頻繁に画像やCSSを変更する場合があるかと思いますが、短期間変更されるなど、キャッシュファイルを参照されると問題があるケースでは長期間のキャッシュをさせないようにします。
また、Googleanalyticsや広告等のサードパーティーのjavascriptの場合、ファイル自体が外部サーバーに置かれているためにキャッシュの設定ができないことも併せて覚えておきましょう。
ユーザーのための施策
表示速度の向上は、ユーザビリティ向上のための施策と言えます。
昨今はAMP(Accelerated Mobile Pages)が実装されるサイトが増えるなど表示速度向上の動きが強まっていることもあり、相対的に表示速度が遅いページからはユーザーがすぐに離脱してしまうことも考えられます。
順位に直接影響が少ないとはいえ、しかるべき改善を行うことで、ユーザーを離脱させない、ユーザビリティの高いサイトを運営していきましょう。
AMPついては別の記事で詳しく解説していますので、参考にしてみてください。
AMP(Accelerated Mobile Pages)とは~対応HTMLを作ってみてわかったこと~
ページスピードについて記事を追加しています。こちらも合わせてご確認ください。
【検証!】ページスピードインサイト(Page Speed Insights)のスコア改善施策と結果を公開!使い方とまずやるべき施策を徹底解説!