PINTO!株式会社PLAN-Bの情報発信メディア

2018.12.06

東迎 光裕

SEO SOLUTION

目次
    1. PageSpeed Insightsの進化
    2. PageSpeed Insightsでの各情報について
      1. フィールドデータ
      2. Chrome User Experience Report(CrUX)とは?
      3. ラボデータ
      4. Lighthouseはどんなツール?
      5. 改善できる項目
      6. 診断
      7. 合格した監査
    3. PageSpeed Insightsの使い方
    4. リニューアル後のPageSpeed InsightsとLighthouseの測定結果は違う!?
      1. ページの表示速度を測定できる他ツール
        1. Impact Calculator 
        2. Test my site 
    5. リニューアル後の結果はリニューアル前と比べて結果が変わることがある?
    6. まとめ

Googleが提供するツールの一つである「PageSpeed Insights」の仕様が変わりました。その仕様についてや分析結果の項目について紹介していきます。


PageSpeed Insightsの進化

「PageSpeed Insights」は、Googleが提供するスコアを測定するためのツールです。PageSpeed Insightsは以前から多くの人が使っているツールで、最近リニューアルが行われました。

リニューアル後は、リニューアル前と同じく、「0~100」のスコアでページ表示速度が速いのか?遅いのか?判定を行ないます。

スコアでの評価は下記になり、色で分かりやすく表しています。

スコア評価
90~100(緑)速い
50~89(オレンジ)平均
0~49(赤) 遅い

速度スコアまた、リニューアル後はスコアの分析の基は、「Lighthouse」になっています。

下記は現在PageSpeed Insightsで提供される情報です。

  • フィールドデータ:Chrome User Experience Report(CrUX)のレポートが出せる
  • ラボデータ:Lighthouseで分析を行った結果
  • 改善できる項目:ページ表示速度の向上を狙うための改善案
  • 診断:ページ表示速度がWeb開発にて適している設定に近いかの項目
  • 合格した監査:問題がないと判断された項目

PageSpeed Insightsでの各情報について

フィールドデータ

Googleがページの表示速度の判断として使用しているデータであるChrome User Experience Report(CrUX)からレポートを出してくれる機能があります。

下記画像の赤枠「提供元の概要を表示」をクリックすることで、Chrome User Experience Report(CrUX)と比較した全てのページの速度の判定が見られます。

フィールドデータ

フィールドデータ

この結果は、以前のPageSpeed Insightsの場合、「origin:」のコマンドを使うことで結果を知ることができました。ですが、Chrome User Experience Report(CrUX)から判定ができるため、リニューアル後のPageSpeed Insightsでは、「origin:」のコマンドは廃止になっています。

Chrome User Experience Report(CrUX)とは?

上記で述べているChrome User Experience Report(CrUX)とは、Chromeを利用しているユーザーのデータが使われています。そのため、以前のPageSpeed Insightsよりも正確な結果が出せると言えます。

ラボデータ

「Lighthouse」を使って分析を行ない下記項目や色でスコアの評価を分かりやすく表してくれます。

  • 緑のチェックマーク・・・・速い
  • オレンジのマーク・・・・平均
  • 赤のビックリマーク・・・・遅い

ラボデータ

項目内容
コンテンツの初回ペイントコンテンツまたは、画像が初めて表示されるまでの時間を測定します。
速度インデックスページのコンテンツが見えるまでの時間を測定します
インタラクティブになるまでの時間ユーザーがページの操作が可能になるまでの時間を測定します。
意味のあるコンテンツの初回ペイントユーザーがメインとなるコンテンツが表示されたと判断するまでの時間を測定します。
CPUの初回アイドルユーザーが操作してから反応するまでの時間を測定します。
入力の推定待ち時間 ユーザーが入力を行ない、その反応までの時間を測定します。

Lighthouseはどんなツール?

冒頭でも述べている「Lighthouse」はGoogleが提供しているツールです。PWAに関しての評価を主に測定してくれます。

Lighthouseの詳細は下記ページにて紹介しています。

改善できる項目

以前のPageSpeed Insights同様、ページ表示速度を向上させるための改善案が表記されます。

更に、短縮できる推定時間も表記されているので、どのくらいの時短ができるのかという目安としての判断材料にすることもできます。

また、この項目でも色で重要度を分かりやすく表してくれています。

  • 赤・・・・最優先の改善案
  • オレンジ・・・・改善を行った方がいい

改善できる項目

診断

この項目では、アプリケーションに関する改善点を上げてくれます。こちらも改善することで、ミリ秒単位での時短の効果が得られます。

また、この項目でも色で重要度を分かりやすく表しています。

  • 赤・・・・最優先の改善案
  • オレンジ・・・・改善を行った方がいい

診断

合格した監査

PageSpeed Insightsのツールで改善の必要がないと判断された項目が見れます。こちらが多いほど、分析を行ったページはユーザーに早くページ情報を与えていると判断ができます。

下記画像の赤枠をクリックすることで、改善が必要ではない一覧が確認できます。


PageSpeed Insightsの使い方

PageSpeed Insightsの使い方に変わりはありません。

下記画像の赤枠に分析したいURLを入力後、黄色枠の「分析」をクリック

クリック後、モバイル・パソコン両方のページ表示速度が確認できます。

モバイル・パソコンの切り替え方法も簡単で下記画像の赤枠のチェックしたい名称をクリックすることで切り替わります。


リニューアル後のPageSpeed InsightsとLighthouseの測定結果は違う!?

リニューアル後のPageSpeed InsightsはLighthouseを基に測定を行っているため、結果は同じと考えられます。しかし、実際はPageSpeed InsightsとLighthouseで得た測定結果に違いが出ています。

その理由は、

  • PageSpeed Insightsインターネット経由で測定が行われている
  • Lighthouseは使っているChromeから測定が行われている

これらの違いにより、測定結果に相違が生まれています。上記のような相違があるものの、どちらが正しいのかという点は明確化されていません。

ですので、私個人としてはより正しくページの表示速度を分析したいと考えているなら複数の測定ツールで比較することをおすすめします。

ページの表示速度を測定できる他ツール

Impact Calculator 

Impact Calculatorは複数のドメインを一度に測定できるツールです。

詳細は下記ページにて掲載しています。

Test my site 

モバイルのみのページ表示速度を測定してくれるツールです。

詳細は下記ページにて掲載しています。


リニューアル後の結果はリニューアル前と比べて結果が変わることがある?

リニューアル前のPageSpeed Insightsでは、ページ表示速度の結果が良好と判断されていたのに、リニューアル後に確認したところ最適ではないと判断されたという事例があります。

そのため、以前分析したから二度目のチェックはしなくていいだろうという考えを持つのではなく、リニューアル後のPageSpeed Insightsでも分析を行ってみるといいでしょう。

分析のデータ基が変わったことでの測定結果の変動が考えられるので、改めて分析することをおすすめします。


まとめ

ページ表示速度の改善は、Googleが以前から推奨している改善策になります。

PageSpeed Insightsがリニューアルしたことで、より詳しく改善できるポイントが分かるようになっているので、ユーザーにより良い環境で利用してもらうためにも積極的に改善していくといいでしょう。

SEOをもっと学びたい方はこちらもチェック:SEO対策の全てを紹介!