PageSpeed Insightsとは？見方や使い方を解説！ウェブサイト表示速度改善を実践！

ウェブサイトの表示速度は、もはや「あれば良い」という機能ではありません。現在では、ユーザー体験と検索エンジン最適化（SEO）において欠かせない要素となっています。

このガイドでは、Googleが無料で提供するPageSpeed Insightsの使い方から、実際の表示速度改善まで、現場で本当に使える情報を詳しく解説します。特に、弊社LandingHubで培った表示速度最適化のノウハウも併せてご紹介しますので、ぜひ最後までお読みください。

PageSpeed Insightsとは？基本を理解しよう

PageSpeed Insights（ページスピードインサイト）は、Googleが提供する無料のウェブサイト表示速度分析ツールです。

URLを入力するだけで、あなたのサイトがどの程度速く表示されるかを0～100点のスコアで評価してくれます。

このツールの特徴は、単に数値を示すだけでなく、具体的な改善点まで提案してくれることです。技術的な知識がなくても、どこをどう改善すれば良いかが分かりやすく表示されるんですね。

スコアの判定基準

PageSpeed Insightsでは、以下の3段階でサイトを評価します。

Good（良好）：90～100点
Medium（改善が必要）：50～89点
Low（不良）：0～49点

ただし、ここで重要なのは「必ずしも100点を目指す必要はない」ということです。

実際のユーザー体験が良好であれば、スコアが80点台でも問題ありません。むしろ、現実的な改善を積み重ねることが大切です。

なぜ表示速度が重要なのか？3つの理由

表示速度の改善に取り組む前に、なぜこれが重要なのかを理解しておきましょう。

1. SEOへの直接的な影響

Googleは2018年から、モバイル検索のランキング要素にページの読み込み速度を組み込んでいます。

さらに2021年からは「Core Web Vitals」が検索順位に影響するようになりました。

つまり、表示速度が遅いサイトは、どんなに良いコンテンツを作っても上位表示が難しくなってしまうのです。

2. ユーザー体験への影響

調査によると、ページの表示に3秒以上かかると、ユーザーの53%が離脱してしまうと言われています。

特にスマートフォンユーザーは待つことに慣れていないため、表示速度の影響はより顕著に現れます。

3. ビジネスへの直接的な影響

Amazonの調査では、ページ表示が0.1秒遅くなると売上が1%減少するという結果が出ています。

逆に言えば、表示速度を改善することで、直接的に売上向上が期待できるということです。

PageSpeed Insightsの使い方：基本操作から詳細分析まで

それでは、実際にPageSpeed Insightsを使ってみましょう。使い方は非常にシンプルですが、結果の見方にはコツがあります。

基本的な使い方

PageSpeed Insightsにアクセス
分析したいウェブページのURLを入力
「分析」ボタンをクリック
結果が表示されるまで待つ（通常30秒～1分程度）

注意点として、分析には少し時間がかかります。特に画像が多いサイトや、JavaScriptが多用されているサイトは時間がかかる傾向があります。

モバイルとデスクトップの違いを理解する

PageSpeed Insightsでは、モバイルとデスクトップの両方の結果が表示されます。多くの場合、モバイルの方がスコアが低く出ます。これは以下の理由によります：

通信速度の制限：モバイルは3G回線相当の速度で測定される
処理能力の制限：デスクトップよりもCPU性能が低い設定で測定される
画面サイズの影響：小さな画面での表示効率が考慮される

現在はモバイルファーストインデックスの時代なので、モバイルでの表示速度により重点を置いて改善することをお勧めします。

PageSpeed Insightsの測定結果の見方

PageSpeed Insightsの結果は、大きく2つのセクションに分かれています。この違いを理解することが、適切な改善につながります。

「実際のユーザーの環境で評価する」（フィールドデータ）

これは、実際にあなたのサイトを訪問したユーザーのデータを集めた結果です。過去28日間のデータに基づいており、より現実的な数値と言えます。

重要な指標

LCP（Largest Contentful Paint）：メインコンテンツの表示時間
INP（Interaction to Next Paint）：操作への応答速度
CLS（Cumulative Layout Shift）：画面の安定性
FCP（First Contentful Paint）：最初のコンテンツ表示時間
TTFB（Time to First Byte）：サーバー応答時間

この中でも特に重要なのが「Core Web Vitals」と呼ばれる3つの指標（LCP、INP、CLS）です。これらはGoogleの検索順位に直接影響するため、優先的に改善すべき項目です。

「パフォーマンスの問題を診断する」（ラボデータ）

こちらは、特定の環境下でシミュレーションした結果です。ユーザーの環境に左右されないため、サイト自体の問題を特定しやすいという特徴があります。

診断項目

Total Blocking Time：操作できない時間の合計
Speed Index：全体的な表示速度
Time to Interactive：操作可能になるまでの時間

実際の改善を進める際は、「実際のユーザーの環境で評価する」を重視し、「パフォーマンスの問題を診断する」で具体的な改善点を見つけるという使い分けがポイントです。

Core Web Vitals完全解説：SEOに直結する3つの指標

Core Web Vitalsは、ユーザー体験を測るGoogleの重要指標です。検索順位に直接影響するため、必ず理解しておきましょう。

LCP（Largest Contentful Paint）：メインコンテンツの表示速度

ページで最も大きなコンテンツ（通常はメイン画像やヘッダー画像）が表示されるまでの時間です。

良好：2.5秒以内
改善が必要：2.5～4.0秒
不良：4.0秒以上

LCPが遅い原因として多いのは、以下のようなものです：

画像サイズが大きすぎる
サーバーの応答が遅い
CSSやJavaScriptの読み込みが重い

INP（Interaction to Next Paint）：操作への応答速度

ユーザーがクリックやタップをした時に、その反応が画面に表示されるまでの時間です。

良好：200ミリ秒以内
改善が必要：200～500ミリ秒
不良：500ミリ秒以上

INPが遅い場合、ユーザーは「サイトが反応しない」と感じて離脱する可能性が高くなります。

CLS（Cumulative Layout Shift）：画面の安定性

ページ読み込み中に、コンテンツが意図せず移動する度合いを測る指標です。

良好：0.1以下
改善が必要：0.1～0.25
不良：0.25以上

CLSの問題は、広告の遅延読み込みや、サイズが指定されていない画像によって起こることが多いです。

実践的な改善方法：効果の高い施策から順に解説

ここからは、実際に表示速度を改善するための具体的な方法を、効果の高い順にご紹介します。弊社LandingHubでも実際に使っている手法です。

1. 画像最適化：最も効果の高い改善方法

ほとんどのウェブサイトで、ページサイズの60-80%を画像が占めています。そのため、画像最適化は最も効果的な改善方法です。

具体的な改善手法

WebP形式の採用：JPEGより30-50%ファイルサイズを削減
適切なサイズ設定：表示サイズに合わせて画像を最適化
遅延読み込み（Lazy Loading）：見えない部分の画像は後で読み込み
圧縮の最適化：品質を保ちながらファイルサイズを削減

実際のプロジェクトでは、適切な画像最適化だけで表示速度が30-50%改善することも珍しくありません。

2. CSSとJavaScriptの最適化

次に効果が高いのが、CSSとJavaScriptの最適化です。

CSS最適化のポイント

未使用CSSの削除：実際に使われていないスタイルを削除
ファイルの結合と圧縮：複数のCSSファイルを1つにまとめて圧縮
クリティカルCSSのインライン化：重要なスタイルをHTMLに直接記述

JavaScript最適化のポイント

未使用JavaScriptの削除：使っていないライブラリやコードを削除
非同期読み込み：重要でないJavaScriptは後から読み込み
ツリーシェイキング：必要な部分だけを抽出

3. サーバー最適化とキャッシュ設定

サーバー側の設定も表示速度に大きく影響します。

効果的なサーバー最適化

Gzip圧縮の有効化：テキストファイルを60-80%圧縮
ブラウザキャッシュの設定：静的ファイルをブラウザに保存
CDN（Content Delivery Network）の活用：世界中のサーバーからコンテンツを配信
HTTP/2の有効化：複数のファイルを並行して転送

4. モバイル特化の最適化

モバイルでの表示速度改善には、特別な配慮が必要です。

モバイル最適化のポイント

レスポンシブ画像：デバイスに応じて画像サイズを変更
タッチ操作の最適化：ボタンサイズやタップ領域の調整
AMP（Accelerated Mobile Pages）：超高速モバイルページの作成
プリロード戦略：重要なリソースを優先的に読み込み

よくある問題とその解決法

PageSpeed Insightsを使っていると、よく遭遇する問題があります。ここでは、そんな問題の解決法をご紹介します。

問題1：「測定できませんでした」エラーが出る

このエラーは以下の原因で発生することが多いです：

サイトが公開されていない（開発中など）
アクセス制限がかかっている
サーバーが一時的にダウンしている
JavaScriptエラーでページが正常に読み込まれない

解決法：まず、ブラウザで直接URLにアクセスして、ページが正常に表示されるか確認してください。問題がない場合は、時間をおいて再度測定してみましょう。

問題2：モバイルだけスコアが異常に低い

これは非常によくある問題です。原因として考えられるのは：

画像サイズがモバイルに最適化されていない
JavaScriptが重すぎる
フォントの読み込みが遅い
サードパーティー製ツールの影響

解決法：まずは画像の最適化から始めましょう。特に、デスクトップ用の大きな画像をモバイルでもそのまま使っている場合は、大幅な改善が期待できます。

問題3：改善したのにスコアが上がらない

改善作業を行ったのにスコアが変わらない場合があります。これは：

キャッシュが残っている
CDNに変更が反映されていない
他の要因がボトルネックになっている

解決法：ブラウザのキャッシュをクリアして、しばらく時間をおいてから再測定してみてください。また、改善効果を正確に測るには、1つずつ施策を行うことをお勧めします。

LandingHubが実践する効果的な改善戦略

弊社LandingHubでは、数多くのウェブサイトの表示速度改善を手がけてきました。その経験から、効果的な改善戦略をご紹介します。

段階的改善アプローチ

いきなり全てを改善しようとせず、段階的にアプローチすることが成功の秘訣です。

フェーズ1：クイックウィン（即効性のある改善）

画像の圧縮と最適化
Gzip圧縮の有効化
ブラウザキャッシュの設定
未使用プラグインの削除

このフェーズだけで、多くの場合20-30点のスコア改善が期待できます。

フェーズ2：技術的最適化

CSSとJavaScriptの最適化
データベースの最適化
サーバー設定の調整
CDNの導入

フェーズ3：高度な最適化

Critical CSSの実装
Service Workerの活用
HTTP/2 Server Pushの実装
エッジサイドキャッシュの最適化

測定と改善のサイクル

改善は一度やって終わりではありません。継続的な測定と改善が重要です。

ベースライン測定：現在の状況を正確に把握
目標設定：改善すべき指標と目標値を決定
施策実行：優先度の高い施策から実行
効果測定：改善効果を定量的に評価
次の施策検討：さらなる改善ポイントを特定

業界別・サイト類型別の改善ポイント

サイトの種類によって、重点的に改善すべきポイントが異なります。

ECサイト

商品画像の最適化：高品質を保ちながらファイルサイズを削減
決済フローの高速化：コンバージョンに直結するページを優先
検索機能の最適化：Ajax検索の応答速度改善

コーポレートサイト

ファーストビューの最適化：企業の第一印象を決定
お問い合わせフォームの高速化：コンバージョン改善
採用情報の最適化：求職者の離脱を防ぐ

ブログ・メディアサイト

記事の読み込み速度：読者の離脱を防ぐ
画像の遅延読み込み：スクロール時の快適性向上
関連記事の高速表示：回遊率向上

ツールを活用した継続的な監視

表示速度の改善は継続的な取り組みが必要です。定期的な監視のためのツールをご紹介します。

Google Search Console

Core Web Vitalsの状況を継続的に監視できます。実際の検索エンジンがどう評価しているかが分かるため、SEOの観点では最も重要なデータです。

Lighthouse CI

開発プロセスに組み込んで、自動的にパフォーマンステストを行えます。新しい機能をリリースする前に、表示速度への影響を確認できます。

WebPageTest

PageSpeed Insightsよりも詳細な分析が可能で、ウォーターフォール図で読み込みプロセスを可視化できます。

よくある質問とその回答

Q: PageSpeed Insightsで100点を目指すべきですか？

A: 必ずしも100点を目指す必要はありません。重要なのは実際のユーザー体験です。90点以上あれば十分良好で、85点以上であれば実用的には問題ありません。100点を目指すために、サイトの機能性を犠牲にするのは本末転倒です。

Q: モバイルとデスクトップ、どちらを優先すべきですか？

A: 現在はモバイルファーストの時代なので、モバイルを優先することをお勧めします。ただし、あなたのサイトのユーザーがどちらのデバイスを多く使っているかによって判断してください。Google Analyticsで確認できます。

Q: 改善効果はどの程度で現れますか？

A: 技術的な改善（画像最適化、キャッシュ設定など）は即座に効果が現れます。一方、検索順位への影響は数週間から数ヶ月かかることがあります。

Q: WordPressサイトの場合、どんな改善が効果的ですか？

A: WordPressでよく効果があるのは以下の改善です：

不要なプラグインの削除
画像最適化プラグインの導入
キャッシュプラグインの設定
データベースの最適化
高速なホスティングサービスへの移行

まとめ：継続的な改善で競合に差をつけよう

PageSpeed Insightsは、ウェブサイトの表示速度を改善するための非常に優れたツールです。しかし、ツールを使うだけでは意味がありません。重要なのは、測定結果を正しく理解し、適切な改善策を継続的に実行することです。

表示速度の改善は、ユーザー体験の向上、SEO効果、そして最終的にはビジネス成果の向上につながります。最初は小さな改善から始めて、徐々により高度な最適化に取り組んでいきましょう。

弊社LandingHubでは、このような表示速度最適化を専門的にサポートしています。自社での改善が難しい場合や、より本格的な最適化をお考えの場合は、ぜひお気軽にご相談ください。専門チームが、あなたのサイトに最適な改善戦略をご提案いたします。

表示速度の改善は、もはや選択肢ではなく必須の取り組みです。今日から始めて、競合他社に差をつけましょう。