PageSpeed Insightsの見方（使い方）│警告の意味と改善方法を解説

PageSpeed Insightsは、指定したURLを入力するだけで、Webページの表示速度・パフォーマンスを分析することができるGoogleのツールです。

実際のユーザーデータとシミュレーションデータの両方をもとに、PC・モバイルそれぞれの表示速度や操作の快適さを評価することができます。

また、問題が発生している場合は原因と改善ポイントが記載されます。

評価結果では、具体的に以下のような情報が確認できます。

会員登録やログイン操作は不要、無料で利用できるうえに使用回数に制限はありません。

PageSpeed Insightsには、実際のユーザー体験を示す「フィールドデータ」と、テスト環境での計測結果である「ラボデータ」の2種類があります。

フィールドデータは「実際にユーザーに問題が起きているか」を把握するための指標であり、ラボデータは「なぜ遅いのか」「どこを改善すべきか」を特定するための指標という役割の違いがあります。

それぞれ目的が異なるため、両方をあわせて確認することで、現状の問題把握と具体的な改善検討を効率的に進めることができます。

PageSpeed Insightsに表示される情報は多いため、やみくもに確認するのではなく、重要度の高い指標から順番に見ていくことが大切です。

PageSpeed Insightsの見方のポイントは次の順番で見ることです。

PageSpeed InsightsではPCとモバイルそれぞれの評価を確認できますが、まずはモバイルの結果を優先して確認します。

その理由は、現在はスマートフォンからの閲覧が主流であり、通信速度や端末性能の制約がPCより大きいためです。

モバイル環境で快適に表示・操作できるページは、PCでも問題なく利用できるケースが多く、ユーザー体験の向上につながります。

また、Googleもモバイル版のページを基準に評価するモバイルファーストインデックスを採用しているため、SEOの観点からもモバイルのパフォーマンス改善を優先することが推奨されます。

モバイルを選択したら次に、フィールドデータ（実際のユーザーの環境で評価する）でCore Web Vitalsに関する指標を確認しましょう。

Core Web Vitalsは実際のユーザー体験を測る指標であり、Googleが検索順位を決めるランキングアルゴリズムの一部にもなっているため、極端に数値が悪い場合は改善が必要です。

Core Web Vitals は、ページの読み込みパフォーマンス、インタラクティブ性、視覚的安定性に関する実際のユーザー エクスペリエンスを測定する一連の指標です。

Core Web Vitals と Google 検索の検索結果について

ラボデータと「インサイト」「診断」は、ページが遅くなっている原因と改善すべきポイントを具体的に確認するための項目です。

まずは、ラボデータ（パフォーマンスの問題を診断する）で「どこで時間がかかっているか」を把握します。

次に「インサイト」や「診断」で具体的な改善方法を確認します。

PageSpeed Insightsの「実際のユーザーの環境で評価する」は、実際の訪問ユーザーの体験を集計したフィールドデータを指します。

フィールドデータはChromeユーザーの実際の利用状況を集計したCrUX（Chrome UX Report）をもとに算出されています。

まずはここで「実ユーザーにとって問題が起きているか」を確認し、問題がある場合は後述のラボデータで原因を特定して改善につなげます。

フィールドデータに表示される主な指標は以下の5つです。

それぞれ詳しく解説します。

LCP（Largest Contentful Paint）とは、ページ内で最も大きなコンテンツが表示されるまでにかかる時間を示す指標のことで、簡単に言うと表示速度です。

主に、ファーストビューに表示されるメインビジュアルや大きなテキストブロック、商品ページのメイン画像などが描画されたタイミングを計測します。

LCPが遅いと、ページが空白の状態が長く続き、肝心の情報が表示されないため「ページの表示が遅い」と感じやすくなり離脱の原因になります。

INP（Interaction to Next Paint）とは、ユーザーがページ上で最初に操作（クリック・タップ・キー入力など）してから、ブラウザが反応するまでの時間を示す指標です。

簡単に言うと 、ページの「操作の軽さ・反応の速さ」を測る指標です。

INPが遅いと、ボタンのタップやスクロールなどの操作に対する反応が悪くなるため「操作しても反応しない」と感じやすくなり、ストレスや離脱の原因になります。

CLS（Cumulative Layout Shift）とは、ページの読み込み中にレイアウトがどれだけズレたかを示す指標です。

「読もうとした瞬間にボタンや文章が動いてしまう不快さ」を表しており、CLSが0.1を超えている場合は改善する必要があります。

例えば、記事を読んでいる途中に広告や画像が後から表示されて文章が押し下げられると、意図しないリンクやボタンを押してしまう可能性があります。

そのためCLSは表示速度とは別にページの「使いやすさ」や「安心して操作できるか」を評価する指標として重視されています。

FCP（First Contentful Paint）とは、ページの読み込みが開始されてからテキストや画像などのコンテンツが最初に表示されるまでの時間を示す指標です。

LCPと似ていますが、FCPは「真っ白な画面から、文字や画像などが初めて表示されるまでの時間」を指します。

そのため、FCPが速くてもLCPが遅い場合は、 「真っ白な画面はすぐ終わって読み込みが始まったように見えるが、メインの画像や本文など肝心な部分がなかなか出てこない」状態だと考えると分かりやすいです。

TTFB（Time to First Byte）とは、ブラウザがページをリクエストしてからサーバーから最初のデータ（1バイト目）が返ってくるまでの時間を示す指標です。

「ユーザーがページを開いた瞬間に表示が始まるまでの待ち時間」にあたり、この時間が長いと画面が真っ白な状態が続きやすくなります。

TTFBはコンテンツの表示速度そのものではなく、サーバーの応答の速さや通信の遅延を表す指標です。そのためTTFBが遅いと、FCPやLCPなど後続の表示指標にも影響しやすくなります。

「パフォーマンスの問題を診断する」は、PageSpeed Insightsが一定の条件下で実行した計測結果で、いわゆるラボデータにあたります。

ラボデータは、フィールドデータで課題が見つかったときに、原因を特定したり改善案を確認することができます。

ラボデータに表示される項目は以下の5つです。

なお、LCP・FCP・CLSは「実際のユーザーの環境で評価する」の項目で解説したため、ここでは、「Total Blocking Time」「Speed Index」について解説します。

Total Blocking Time（TBT）とは、ページの読み込み中にJavaScriptなどの重い処理によって、ユーザー操作がブロックされている時間の合計を示す指標です。

具体的にはユーザーがクリックやスクロールをしても反応しない操作できない時間を表します。TBTは、処理時間が50ミリ秒を超えるタスクがどれだけ発生しているかをもとに算出され、数値が大きいほど操作の遅延が起きやすい状態といえます。

なお、TBTはラボデータ特有の指標であり、実際のユーザー操作の快適さを示すINPの補助指標として活用されます。

Speed Indexとは、ページの読み込み中に画面のコンテンツがどれくらいの速さで表示されていくかを示す指標です。

ユーザー視点では、画面が少しずつ完成していく体感の速さを表しており、数値が小さいほど「表示が速い」と感じやすくなります。

FCPが「最初に何かが表示されるまで」、LCPが「メインコンテンツが表示されるまで」を示すのに対し、Speed Indexは表示開始から完成までの過程のスムーズさを評価する点が特徴です。

インサイトと診断には、「パフォーマンスの問題を診断する」の結果をもとに、ページの表示速度や操作性に影響している具体的な改善ポイントが表示されます。

シンプルに言うと、インサイトは優先度の高い改善点、診断は細かな改善のヒントという違いがあります。

そのため、まずはインサイトで大きな課題を把握し、その後に診断で技術的な最適化を確認する流れがおすすめです。

また、「次に関連する監査を表示」では、All・FCP・LCP・TBT・CLSといった項目が表示されます。

初期状態は「All」が選択されており全体の課題が表示されますが、指標ごとに切り替えることで、特定のパフォーマンス指標に関する課題だけを絞って確認することも可能です。

「合格した監査」とは、PageSpeed Insightsがチェックしている各項目のうち、問題が検出されず適切に最適化されていると判断された項目を指します。

改善が必要な項目とは異なり、パフォーマンスや最適化の観点で基準を満たしているため、基本的には追加の対応は不要です。

そのため、合格した監査は「問題がないことの確認」として捉え、今後の変更や更新によって状態が悪化していないかを定期的にチェックする程度で問題ありません。

PageSpeed Insightsに表示されやすい代表的な警告と、その意味・改善方法をわかりやすく解説します。

それぞれの警告について詳しく解説します。

なお、すべてを一度に改善する必要はなく、ユーザー体験に影響の大きい項目から順番に対応することが重要です。

第三者コードとは、広告タグや解析ツール、チャット、SNS埋め込みなど外部サービスのスクリプトを指します。第三者コードが多いと読み込みや処理が増えて表示速度や操作性の低下につながります。

「本当に必要なタグだけ残す」が最短ルートです。まずはタグを棚卸しして、発火条件を全ページから必要ページのみに絞ると改善しやすいです。

ブラウザに保存される画像やCSS・JavaScriptなどのキャッシュ期間が短いと、ユーザーが再訪問した際に毎回ファイルをダウンロードする必要があり、表示速度が遅くなります。

キャッシュ保存期間を長く設定することで、再訪問時の読み込みを高速化でき、通信量の削減にもつながります。

なお、キャッシュ期間を長くする際は、画像・CSS・JavaScriptなど更新頻度の低いファイルを対象にし、HTMLなど更新が多いものは短めに設定するのが基本です。

レンダリングをブロックしているリクエストとは、CSSやJavaScriptの読み込みが画面表示より優先されることで、コンテンツが表示されるまで待たされてしまう状態を指します。

最初に表示に必須ではないJavaScriptは「defer」に寄せ、CSSは最初に必要な分だけ先に読み込むようにすると、初期表示が体感で改善しやすいです。

「画像配信を改善する」とは、サイズの大きい画像や最適化されていない画像によって通信量が増え、ページの読み込みが遅くなっている状態を指します。

「見た目が同じなら軽い方が正解」です。まずはファーストビューの大きい画像から、サイズ適正化＋圧縮＋WebP化を優先すると効果が出やすいです。

強制リフローとは、JavaScriptやCSSの影響によりブラウザがレイアウトの再計算を何度も行い、表示や操作時に処理負荷が高くなる状態を指します。

DOMの読み取りと書き換えを交互に行うと発生しやすいので、処理はまとめて行い、アニメーションはtransform/opacity中心にすると安定します。

フォント表示とは、Webフォントの読み込みによって文字が表示されるまで時間がかかったり、フォントの切り替えでレイアウトがズレたりする状態を指します。

font-display: swap を入れてまず表示する状態を作り、使うフォントウェイトや文字セットを減らしてファイルを軽量化すると、速度と見た目の両立がしやすいです。

 LCPリクエストの検出とは、Largest Contentful Paintの対象となる画像や要素の読み込みが遅れている原因を特定し、どのリソースが表示速度を妨げているかを把握することを指します。

LCPの対象（多くはFVの画像や大見出し）を特定したら、そこだけは遅延読み込みを避けてプリロードで優先読み込みすると効果が出やすいです。

今回は、PageSpeed Insightsの概要や表示される指標の見方と改善方法について解説しました。

Webサイトの読み込み速度が遅かったり操作性が悪い場合は、ユーザー離脱や満足度の低下に繋がる恐れがあります。また、CWVに関する指標についてはGoogleのランキングアルゴリズムの一部でもあるため、問題がある場合は早期改善が必要です。

なお、弊社ではページの表示速度などページエクスペリエンスに関する指標を改善するテクニカルSEOのサービスを提供しています。インハウスではなかなか改善できない場合などは気軽にご相談くださいませ。