/Web
サイトの表示速度を測る方法:PageSpeed Insightsの見方
結論から言うと、自社サイトの表示速度は Google の無料ツール PageSpeed Insights(ページスピード インサイト)で、URLを入力するだけで測れます。見るときは、上の段の「実際のユーザーのデータ」を先に確認し、下の段の点数(スコア)は改善のヒントとして使うのがおすすめです。点数だけを追いかけると、実際の使いやすさとずれることがあるためです。
PageSpeed Insightsとは
PageSpeed Insights(以下、PSI)は、Googleが提供しているページの表示速度と使いやすさの診断ツールです。pagespeed.web.dev を開き、調べたいページのURLを入れて「分析」を押すと、モバイルとパソコンそれぞれの結果が表示されます。
Googleの公式ドキュメントによると、PSIは「モバイルとパソコンの両方のデバイスで」ページのユーザー体験に関するレポートを出し、改善のための提案も示します(PageSpeed Insights について)。費用はかからず、アカウント登録も不要です。
測れるのは「ページ単位」です。トップページだけでなく、お問い合わせページやよく読まれているブログ記事など、大事なページをいくつか測っておくと全体の傾向がつかめます。
画面の2つの段:実際のデータと点数の違い
PSIの結果画面には、性質の違う2種類のデータが並びます。ここを混同しないことが、いちばんのポイントです。
| 上の段(フィールドデータ) | 下の段(ラボデータ) | |
|---|---|---|
| 中身 | 実際にサイトを訪れた人の環境で集めた記録 | 決まった条件でページの読み込みを再現した測定 |
| 期間・条件 | 過去28日間の集計 | 1回ごとの測定。毎回少し変わる |
| 主な使い道 | 訪問者が実際にどう感じているかの確認 | どこを直せばよいかの手がかり |
違いの詳細は公式ドキュメントで説明されています(PageSpeed Insights について)。
上の段が表示されないとき
アクセス数が少ないページでは、実際のユーザーのデータが十分に集まらず、上の段が表示されないことがあります。その場合PSIは、ページ単位ではなくサイト全体(オリジン)の集計に切り替えて表示します(同ドキュメント)。サイト全体でもデータが足りないときは、下の段のラボデータを目安にします。
点数(パフォーマンススコア)の見方
下の段の0〜100の点数は、次の3色で表示されます(同ドキュメント)。
- 90以上:緑(良好)
- 50〜89:オレンジ(改善が必要)
- 50未満:赤(低い)
点数は、ネットワークや端末の状況などによって測るたびに上下します(同ドキュメント)。何回か測って傾向を見るのが安心です。
押さえておきたい3つの指標
上の段では、Googleが「Core Web Vitals」(コアウェブバイタル:ページの使いやすさを表す主要な指標)と呼ぶ3つの数値が中心になります。目安はPSIの公式ドキュメントに掲載されています(PageSpeed Insights について、web.dev:ウェブに関する主な指標)。
| 指標 | 何を表すか | 良好 | 改善が必要 | 低い |
|---|---|---|---|---|
| LCP | 読み込み:ページのいちばん大きな画像や文章が表示されるまでの時間 | 2.5秒以下 | 2.5〜4秒 | 4秒超 |
| INP | 反応:ボタンを押したときなどに画面が反応するまでの時間 | 200ミリ秒以下 | 200〜500ミリ秒 | 500ミリ秒超 |
| CLS | 安定性:読み込み中にレイアウトがずれる度合い | 0.1以下 | 0.1〜0.25 | 0.25超 |
これらの数値は、訪問者全体の「75パーセンタイル」(遅い側から4分の1の人あたりの値)で評価されます。公式ドキュメントでは、この値を使うことで、サイト上で不満を感じやすい人の体験を把握できると説明されています。
なお、Googleは「Google のランキング システムでは Core Web Vitals が使用されます」としつつ、ページの使いやすさが平均を下回っていても、関連性の高いコンテンツが表示されるように設計されていると説明しています(Google 検索セントラル:ページ エクスペリエンス)。速度だけで検索順位が決まるわけではない点も押さえておきましょう。検索順位の考え方はSEOで検索順位が決まる仕組みとは?で紹介しています。
結果を見たあとの進め方
モバイルとパソコンを分けて見る
結果はモバイルとパソコンのタブに分かれています。スマホは通信環境や端末の性能の差が大きく、パソコンより数値が厳しく出ることがあります。自社サイトの訪問者がどちらから多く来ているかを踏まえて、優先して見るほうを決めましょう。
下の段の「改善できる項目」は相談の材料にする
下の段には、「画像のサイズを適切に設定する」といった改善の提案が並びます。専門的な内容も多いので、自社で無理に直すより、画面の内容をそのまま制作会社や担当者に共有するのが近道です。共有するときは、次の3点を添えると話が早く進みます。
- 測ったページのURLと日付
- モバイル・パソコンそれぞれの上の段の評価(3指標)
- 下の段の点数と、上位に出ている改善項目
画像が原因として挙がることはよくあります。画像の扱いの基本はHTMLの画像タグとその活用法も参考になります。
継続して見るならSearch Console
PSIはページ単位の診断ですが、GoogleのSearch Consoleには「Core Web Vitals レポート」があり、サイト全体の状態をまとめて確認できます。月に1回など、定期的に見る習慣をつけておくと、変化に気づきやすくなります。
まとめ
- 表示速度は、無料の PageSpeed Insights でURLを入れるだけで測れる
- 上の段は実際の訪問者のデータ(過去28日)、下の段は再現テストの点数。まず上の段を見る
- 3つの指標(LCP・INP・CLS)の目安は、2.5秒・200ミリ秒・0.1以下
- 点数は測るたびに変わるので、何回か測って傾向を見る
- 改善項目は、URL・日付と一緒に制作会社へ共有すると話が早い
測ってみたものの、どこから手をつければいいかわからない場合は、無料相談でお気軽にご相談ください。制作の進め方はWeb制作のサービス紹介でもご覧いただけます。
- #表示速度
- #PageSpeed Insights
- #Core Web Vitals
- #サイト運用