サイトスピード改善！Google Search Consoleが役立つレポート公開！
2019.11.27
2019.11.29
Googleが提供している「サーチコンソール」。サイトの検索ワードの分析やクロールエラーのチェックなどができる非常に便利なサイトですが、今回そのサーチコンソールにさらに便利な新機能が追加されました。
今回公開された「スピードレポート」という新機能は、サイトの表示速度を測定し、より良いサイト運営に役立つデータを提供してくれます。今回は新機能であるスピードレポートの使い方や、サイトの速度改善の方法などを解説します。
Google Search Consoleでサイトスピード計測可能
Googleサーチコンソールから「拡張」というメニューを開くと、新たに「速度（試験運用版）」という項目が追加されています。
この項目を選択することで、サイトの表示スピードを測定することができます。
詳細の説明・見方
では、測定したレポートの結果はどのように読めばよいのでしょうか。項目ごとに解説していきます。
First Contentful Paintの略称で、閲覧者がサイトにアクセスしてからブラウザに最初に表示されるまでの時間を表しています。3秒以上かかると低速、3秒未満で表示されると中速、1秒未満で表示されると高速という判定になります。
First Imput Delayの略称で、サイトが表示されてから閲覧者がリンクやボタンをクリックするなどの動作をしたときの初回の反応にかかる時間を表しています。300ミリ秒以上で低速、300ミリ秒未満で中速、100ミリ秒未満で高速という判定になります。
また、高速、中速、低速の分類に判定されたURLを個別に確認することが可能です。同じ判定になっている類似のURLも見ることができるので、共通点を探したり、原因を探ったりする際の参考にすることができます
従来の方法 PageSpeed Insights
従来は、サイトの表示速度の測定に同じくGoogleが公開している「PageSpeed Insights」という機能を利用していました。
サーチコンソールで似たような機能であるスピードテストが公開されましたが、こちらも廃止になったということはなく従来通り利用することが可能です。
サーチコンソールとの違いとして、サーチコンソールがChromeのユーザーデータを元に計測しているのに対して、PageSpeed InsightsはGoogleChromeの拡張機能である「Lighthouse」を使用しています。サーチコンソールのスピードテストとPageSpeed Insightsは評価基準が異なるので、合わせて使ってみるのも良いでしょう。
モバイル、PCでの仕様
スピードテストは、モバイルの検索結果とPCでの検索結果を個別にレポートにして報告してくれます。サイトによっては、PCでの結果は良好なのにモバイルでの結果はあまり良くなかった、ということもあるかもしれません。
モバイル、PC共に「レポートを開く」という項目から詳細な結果を確認することができます。スピードテストを実施したら、必ず両方チェックして原因を突き止めることが大切です。
修正を検証
スピードテストによって指摘された問題点を解決したら、診断結果の「修正を検証」というボタンを押しておきましょう。
「修正を検証」ボタンを押しておくと、問題点が本当に修正されているかどうかをGoogle側が検証してくれます。まだ修正が終わっていなかった問題点に関しては「不合格」という指摘を返してくれますので、改善点探しに役立てましょう。
サイトスピードはペナルティになる？
結論から言うと、サイトスピードが遅いからといってペナルティを受けるということはありません。
ただし、Googleは2018年の7月から、モバイル検索のランキングを決定するときの要因の一つとしてページの読み込み速度を参考にする「Speed Update」を導入しています。サイトスピードが遅い状態を放置していてもペナルティにはなりませんが、検索順位にはマイナス要素になってしまうことがありますので注意が必要です。
ページ速度の重要性
サイトスピードを計測する手段は色々ありますが、サイトの表示スピードが速いことで具体的にどのようなメリットがあるでしょうか。表示速度が速いことで得られる大きなメリットとして、「直帰率の減少」が挙げられます。
表示速度が与える影響
サイトの表示速度が与える影響のなかでも重大なのは、サイト閲覧者の「直帰率」です。
直帰率とは、そのサイトにアクセスした閲覧者の中で、サイト内の他のページを見ずにサイトから離脱してしまう人の割合のことです。Googleによると、「ページの読み込み時間が 1 秒から 3 秒に増加すると、直帰率は 32% 増加します。ページの読み込み時間が 1 秒から 6 秒に増加すると、直帰率は 106% 増加します。」という調査結果が出ています。
参考URL：https://support.google.com/webmasters/answer/9205520#no_data_available
高速化するには何をしたら良いか？
では、直帰率を減らすためにサイトを高速化したい場合、具体的にどのような対策を取るのが良いのでしょうか。
速度が低下する原因と、その対策方法について解説します。
速度低下の主な原因と対策
サイトの表示速度の低下には様々な原因がありますが、そのなかでも多いのが「画像の読み込みが遅い」「ページの容量が多い」「リクエスト数が多い」といったサイトのデータ量や読み込みに関わる原因です。
色々な対策方法がありますが、まずは簡単な対策から取り入れていきましょう。
簡単に作業できて高い効果が期待できるもの
簡単にできる上に高い効果を得ることができます。サイトの高速化をしたい場合は必ずやっておきたい対策です。
サイトの画像を圧縮し、画像の容量を減らします。PhotoShopなどの画像編集ソフトを利用するか、Squoosh（https://squoosh.app/）などの画像縮小アプリを利用すると便利です。画質が劣化しないように注意しましょう。
サイト構築に使われるHTML、CSS、JavaScriptなどをまとめてリソースと呼びます。このリソースを連結して読み込み速度を上げることで、表示速度を速くすることができます。
サイトを毎回読み込まず、以前アクセスしたときのキャッシュを呼び出すことで、表示スピードを速くします。
あまり複雑な作業を伴わず、高い効果が期待できるもの
前述のものよりは多少手間がかかりますが、それでもあまり複雑な作業はありません。サイトの高速化を目指すならここまではやっておきたいところです。
画像を圧縮し、サイズなどの調整を施して、画像のファイルサイズを小さくすることで読み込みを速くします。一枚では効果は薄いですが、複数枚の画像を最適化することで効果が大きくなります。
HTMLファイルを圧縮することで、ドキュメントサイズを縮小し、データの転送速度を高速化することができます。
不要な301リダイレクトを削除したり、内部リンクにリダイレクトが利用されている箇所を見直してリダイレクトを極力減らすようにしたりすると、表示速度が速くなります。リダイレクトは最小限に留めましょう。
非常に高い効果が期待できるが、実装に手間がかかってしまうもの
非常に高い効果を得られますが、実装するのにそれなりの手間や技術が必要になります。余裕があれば取り入れてみてください。
CSSやJavaScriptなどの読み込み時間を短縮するために、ソースコード内の余分な改行などを取り除いてリソースを圧縮します。WordPressを利用している場合は「Autoptimize」などのプラグインを利用することもできます。
HTMLファイルの読み込みを高速化するために、サイトの表示に必要な最小限のファイルのみを読み込むようにレンダリングパスを整備します。特にheadタグの部分にCSSを多く置いているサイトなどに有効です。
先ほどの項目と似ているのですが、サイトで最初に読み込まれる部分を重点的に高速化し、それ以外の部分の表示は後から読み込むという設定にすることで表示速度を高速化します。
まとめ
表示が速いサイトと遅いサイトの速度の差は、体感で3秒程度です。3秒というと非常に短い時間に思えますが、実際にサイトを開くまでのたった3秒間の差で直帰率が大きく変わってきます。
直帰率を減らしたい、もっとコンテンツを読んでくれる閲覧者を増やしたいという場合、サイトの中身ももちろん大切ですが、閲覧者にとって読みやすいサイトであるかどうかも大きく関わってきます。直帰率の高さに悩んでいる場合、サイトを高速化するという対策は特に効果的ですので、是非スピードテストを試してみてください。
関連
Pickup!
Pickup!
Pickup!
Pickup!
