はじめに
背景
Webページの表示速度は、訪問者の満足度や利用継続に大きく影響します。ページが遅いと離脱が増え、収益や信頼にも悪影響が出ます。一般的に「表示が3秒以内」であることが推奨されており、本書はその目安と理由をわかりやすく解説します。
本書の目的
本書は、表示速度に関する基準と目安をやさしくまとめたガイドです。Googleの調査やCore Web Vitalsに基づく具体的な数値目標やスコアの見方を、専門用語をできるだけ抑えて説明します。
読者対象と学べること
サイト運営者、制作担当者、改善を考える方が対象です。本書を通じて、何を優先して改善すれば効果が出るか、評価方法の基礎、具体的な数値目安が理解できます。
本書の構成
第2章で大まかな目安を示し、第3章でCore Web Vitalsの基準値を詳述します。第4章ではスコアの目安と改善の優先度を紹介します。まずは基本の考え方から一緒に見ていきましょう。
おおまかな目安
概要
多くの専門家は「ページ表示が3秒以内」をひとつの許容ラインとしています。Googleの調査によると、読み込みが3秒を超えると約半数のユーザーが離脱するというデータがあり、UX・コンバージョン・SEOの観点でも3秒以内が望ましいとされています。
なぜ3秒か
人は待ち時間に対して敏感です。表示が遅いと離脱や印象の低下につながりやすく、結果として購買や会員登録といった行動が減ります。検索エンジンもユーザー体験を重視するため、表示速度は評価に影響します。
実務的な目安（具体例）
- 初回の視認領域（ファーストビュー）はできるだけ1秒台を目指す。画像やフォントの表示を優先する。
- ページ全体は3秒以内を目標にする。
- 画像は適切に圧縮・サイズ指定し、遅延読み込みを活用する。
- 外部スクリプトや広告は必要最低限に抑える。
- サーバー応答は短くする（目安：TTFB約200ms程度）。キャッシュやCDNを活用してください。
測定のコツ
実際のユーザー計測（実測データ）と、ラボツールの両方で確認してください。それぞれ得られる情報が違うため、両方を見て優先度を決めると効率的です。
Core Web Vitals の基準値
概要
Core Web Vitals はユーザー体験を数値化する指標群です。特に注目されるのは LCP（Largest Contentful Paint）、INP（旧 FID: First Input Delay）、CLS（Cumulative Layout Shift）です。どの値が「良好」とされるかを分かりやすく説明します。
LCP（主要コンテンツの表示時間）
- 良好: 2.5秒以下
- 改善が必要: 2.5〜4.0秒
- 不良: 4.0秒以上
解説: LCP はページで最も大きな要素（画像や見出しなど）が表示されるまでの時間です。理想は 2.5秒以下。現実的な最低ラインは全体表示 3秒以内を目標にする運用が多いです。画像の遅延読み込みやサーバー応答の改善で短縮できます。
INP（入力応答性、旧 FID）
- 良好: 200ms 以下
- 改善が必要: 200〜500ms
- 不良: 500ms 以上
解説: ユーザーの操作に対する応答速度を示します。スクリプトの分割やメインスレッドの仕事を減らすことで改善できます。
CLS（レイアウトの安定性）
- 良好: 0.1 以下
- 改善が必要: 0.1〜0.25
- 不良: 0.25 以上
解説: ページ読み込み中にレイアウトが不意に動くとスコアが悪化します。画像や広告のサイズを予約すること、フォントの読み込み方法を工夫することで対策できます。
測定と実務の目安
実測値は環境や接続で変わります。モバイル実機での確認を優先してください。まずは良好ラインを目指し、改善が難しければ現実的な最低ライン（LCP 約3秒以内など）を目標に段階的に改善しましょう。
ちょっとした改善方針
- 画像の最適化と遅延読み込み
- サーバー応答（TTFB）改善
- 不要なスクリプトの削減と遅延読み込み
- レイアウト崩れを防ぐためのサイズ指定
これらを順に実施すると、Core Web Vitals のスコアが安定して改善します。
スコア・点数の目安
PageSpeed Insights の判定
PageSpeed Insights のスコアは一般に次のように分類されます。
- 90〜100点：速い
- 50〜89点：標準
- 0〜49点：要改善
実務では最低でも50点以上を確保することを目標にするケースが多いです。スコアは参考値で、実際の体感と合わせて判断してください。
実務的な目安
よく使われる目安は次のとおりです。
- モバイルでスコア50点以上を目標にする
- LCP（最大コンテンツ表示時間）を2.5秒以内にする
- 実測での読み込み体感をおおむね3秒以内に収める
モバイルは回線や端末の違いで遅くなりやすいため優先度が高いです。体感の改善はユーザー満足に直結します。
優先度の高い改善ポイント
実務で効果が出やすい具体策を挙げます。
- 画像を圧縮し、必要なサイズだけ配信する（レスポンシブ画像、WebP など）
- 重要なコンテンツを最初に描画する（遅延読み込みやプリロードを活用）
- サーバー応答時間を改善する（CDN、キャッシュの設定）
- 不要なJavaScriptを削減し、遅延読み込みや分割を行う
- フォントの読み込みを最適化して、レイアウトシフトを減らす
測定と運用の進め方
実測（フィールド）と実験室（ラボ）の両方で計測してください。ラボは再現性が高く改善効果の確認に便利です。フィールドデータは実際のユーザー体験を示します。
ページごとに優先度を付け、小さな改善を積み重ねながら監視を続けると効率的です。
