ページの表示速度を測ったことはありますか？ 表示に時間がかかるサイトは、見る人が途中で離れてしまう原因になります。Googleの検索結果でも、ページの使いやすさの一つとして表示速度が使われています。
この記事では、Googleの無料ツール「PageSpeed Insights」で、サイトの表示速度をチェックする方法を紹介します。
なお、以前この記事で紹介していたGoogleの「Test My Site」は、提供が終わっています。
PageSpeed Insightsの使い方
- PageSpeed Insightsを開きます。
- 入力欄に、チェックしたいページのURLを入力して「分析」をクリックします。
- しばらくすると、結果が表示されます。「携帯電話」と「デスクトップ」のタブで、スマホとパソコンの結果を切り替えられます。
Googleアカウントへのログインは必要ありません。自分のサイトでなくても、URLがわかればチェックできます。
結果の見方
実際のユーザーの環境での結果
結果の上の方には、実際にそのページを見たChromeのユーザーのデータ（過去28日間）が表示されます。アクセスが少ないページでは、データがなく表示されないこともあります。
ここで大切なのが「Core Web Vitals（コアウェブバイタル）」という3つの指標です。
| 指標 | わかること | 「良好」の目安 |
|---|---|---|
| LCP（Largest Contentful Paint） | ページのメインの画像や文章が表示されるまでの時間 | 2.5秒以下 |
| INP（Interaction to Next Paint） | クリックやタップをしてから、画面が反応するまでの時間 | 0.2秒（200ミリ秒）以下 |
| CLS（Cumulative Layout Shift） | 読み込み中に、画面のレイアウトがどれくらいずれるか | 0.1以下 |
3つとも「良好」なら、「Core Web Vitals の評価」が「合格」と表示されます。
パフォーマンスのスコア
その下には、Googleのテスト環境で測った結果が、0〜100点のスコアで表示されます。
- 90〜100点（緑）：良好
- 50〜89点（オレンジ）：改善が必要
- 0〜49点（赤）：不良
スコアは、測るたびに少し変わることがあります。一度の結果だけで判断せず、何回か測ってみましょう。
改善のヒントを確認する
結果のさらに下の「診断」などの欄には、表示を速くするためのヒントが表示されます。よくあるのは、次のようなものです。
- 画像のサイズが大きすぎる（WebPなどの軽い形式にする、表示サイズに合わせて小さくする）
- 使っていないCSSやJavaScriptが読み込まれている
- サーバーの応答が遅い
WordPressの場合は、画像を軽くしたり、使っていないプラグインを止めたりするだけでも、スコアが上がることがあります。
まとめ
PageSpeed Insightsを使えば、URLを入力するだけで、ページの表示速度と改善のヒントを確認できます。新しくページを追加したときや、デザインを変えたときは、チェックしておくことをおすすめします。
