ページの作成
親となるページを選択してください。
親ページに紐づくページを子ページといいます。
例: 親=スポーツ, 子1=サッカー, 子2=野球
子ページを親ページとして更に子ページを作成することも可能です。
例: 親=サッカー, 子=サッカーのルール
親ページはいつでも変更することが可能なのでとりあえず作ってみましょう!
| この記事の要点 |
|
概要
PageSpeed Insights(PSI)は、Googleが無料で提供するWebページの表示速度・パフォーマンス診断ツールです。診断したいページのURLを入力するだけで、表示速度を0〜100点のスコアで評価し、何が遅延の原因かと具体的な改善策を提示してくれます。ページ速度はユーザー体験に直結するだけでなく、Googleの検索ランキング要因でもあるため、SEO施策の一環として欠かせないツールです。
評価の仕組み(Core Web Vitalsとスコア)
PSIのパフォーマンススコアは、表示速度に関わる複数の指標を合成して算出されます。中でも重要なのが、Googleがユーザー体験の核として定めたCore Web Vitals(コアウェブバイタル)です。
| 指標 | 意味 | 良好の目安 |
|---|---|---|
| LCP(Largest Contentful Paint) | 主要コンテンツが表示されるまでの時間(読み込みの速さ) | 2.5秒以下 |
| INP(Interaction to Next Paint) | クリック等の操作に反応するまでの時間(応答性) | 200ミリ秒以下 |
| CLS(Cumulative Layout Shift) | 表示中にレイアウトがずれる量(視覚的安定性) | 0.1以下 |
スコアは色分けされ、90〜100が緑(良好)/50〜89が橙(要改善)/0〜49が赤(不良)です。Core Web Vitalsはランキング要因のため、まずここを「良好」に乗せることを目標にします。
レポートには2種類のデータがあります。フィールドデータは実際のユーザーの計測値(実体験を反映)、ラボデータはGoogleの計測環境で取得した擬似値です。トラフィックが少ないページはフィールドデータが表示されないこともあります。
使い方・手順
1. URLを入力する:PageSpeed Insightsのページを開き、診断したいページのURLを入力して分析を実行します。
2. モバイルとデスクトップを確認する:結果はモバイルとデスクトップでタブが分かれます。一般にモバイルの方が評価が厳しく、現在の検索はモバイルファーストのため、まずモバイルのスコアを重視します。
3. スコアと指標を読む:総合スコアと各指標(LCP/INP/CLSなど)の値を確認し、どこがボトルネックかを把握します。
4. 改善提案を実施する:「改善できる項目」「診断」セクションに、影響の大きい順で具体策が並びます。上から順に対応すると効率的です。
5. 再計測する:修正後に再度計測し、スコアの変化を確認します。改善は一度で終わらず、計測→修正→再計測のサイクルで進めます。
実用例・Tips
レポートで頻出する改善提案と対策例です。
- 画像の最適化:サイズの大きい画像はWebP/AVIFへ変換し、適切な解像度に縮小。
loading="lazy"で遅延読み込みする。 - 使用していないJavaScript/CSSの削減:不要なライブラリやコードを削り、必要な分だけ読み込む。
- キャッシュの活用:静的ファイルに長めのキャッシュを設定し、再訪問時の読み込みを高速化する。
- レンダリングを妨げるリソースの排除:先頭で読み込まれるJS/CSSを遅延・分割し、初期表示を速める。
- サーバー応答時間(TTFB)の短縮:ホスティングやCDN、キャッシュ層を見直す。
- テキスト圧縮の有効化:Gzip/Brotliで転送量を削減し、ダウンロード時間を短縮する。
提案には「推定削減時間」が表示されるため、効果が大きく実装が容易なものから着手すると費用対効果が高くなります。スコアは一度上げて終わりではなく、コンテンツ追加や機能追加のたびに低下し得るため、リリース時の定点観測ツールとして継続的に使うのが効果的です。
注意点・落とし穴
- スコア100は目的ではない:満点を狙うより、Core Web Vitalsを「良好」に保ち、実ユーザーの体験を改善することが本質。
- 計測ごとのブレ:ラボデータは計測タイミングで変動する。数回計測して傾向で判断する。
- ラボとフィールドの乖離:実ユーザー(フィールド)の体感が最終的に重要。両者がずれる場合はフィールドを優先して見る。
- 過度な最適化の副作用:遅延読み込みやコード分割をやり過ぎると、かえって体感が悪化することがある。バランスを取る。
関連リンク
PageSpeed Insightsは表示速度というSEOの一側面を扱うツールです。タイトル・内部リンク・構造化データなど他のSEO施策については「SEO」カテゴリの各記事を併せて参照すると、総合的な最適化につながります。
ページの作成
親となるページを選択してください。
親ページに紐づくページを子ページといいます。
例: 親=スポーツ, 子1=サッカー, 子2=野球
子ページを親ページとして更に子ページを作成することも可能です。
例: 親=サッカー, 子=サッカーのルール
親ページはいつでも変更することが可能なのでとりあえず作ってみましょう!
人気ページ
- 1 Eclipseで「サーバーに追加または除去できるリソースがありません。」の原因と対処法
- 2 tomcat の起動 / 停止ログと catalina.log・catalina.out の違い
- 3 JavaScript で base URL を取得する方法|window.location.origin
- 4 YouTube Data API v3 エラー一覧|403・400・404 の原因と対処
- 5 Laravel エラー一覧|500/Blade/DB 接続/ルーティングの代表エラー
- 6 3Dグラフィックスとは|モデリング/レンダリング/主要ソフトウェア (Blender / Maya)
- 7 Spring Frameworkのアノテーション一覧
- 8 【Spring】@Valueアノテーションとは
- 9 CATALINA_HOME の確認方法 (Linux / Mac)
- 10 【Spring】@Autowiredアノテーションとは
最近更新/作成されたページ
- 【django】ログイン 認証機能 2026-09-08 03:22:09
- MySQL ERROR 1063 Incorrect column specifier for column|原因と直し方 2026-09-08 03:11:09
- 【PHPエラー】Object of class stdClass could not be converted to string 2026-09-07 07:46:04
- Julia Genie ローカル開発サーバ起動完全ガイド 2026-09-07 07:46:04
- Wi-Fi とは|規格と世代(Wi-Fi 4〜7)・周波数帯・CSMA/CA・WPA3 NEW 2026-09-07 07:45:13
- set コマンドでシェルオプションと位置パラメータを操作 | bash 2026-09-07 07:45:13
- JPEG(.jpg/.jpeg)画像形式の完全ガイド — 仕様・マジックナンバー・他形式との比較・EXIF 2026-09-07 07:45:13
- UE5 Get Overlapping Actorsで特定クラスだけ処理|Class Filter・Cast To 2026-09-07 07:45:13
- Linuxで特定拡張子のファイルを再帰削除|find -deleteの安全手順 2026-09-07 07:45:13
- Django CBVでテンプレートに値を渡す|get_context_data・extra_context 2026-09-07 07:45:13
- Linuxで複数ファイルの文字列を一括置換|find・sed・xargsの安全手順 2026-09-07 07:45:13
- Laravelルートグループ|prefix・middleware・nameで一括管理 2026-09-07 07:45:13
- Linux whichコマンドの使い方|絶対パス取得とtype・command -vの違い 2026-09-07 07:45:13
- Linux catコマンドの使い方|行番号表示・複数ファイル連結 2026-09-07 07:45:13
- unable to execute 'gcc': No such file or directory 2026-09-07 07:45:13
コメントを削除してもよろしいでしょうか?