Core Web Vitals（LCP/INP/CLS）とは？
SEOでの改善方法を徹底解説【2026年最新】

Core Web Vitals とは

Core Web Vitalsは、ユーザーがページを開いたときに感じる「速さ」「反応性」「安定性」を数値化したGoogleの公式指標。

3指標すべてが「良好」のページは、検索順位で優遇されます。

（ただし主要因ではなく、品質ベースのタイブレーカー的な位置づけです）

計測は実際のユーザーの体験データ（フィールドデータ）で、Chrome User Experience Report（CrUX）で集計されます。

実環境での体感が反映されるため、自社の高速サーバでテストして良くても、ユーザーの古いスマホ＋低速回線では悪くなることもあります。だからこそモバイルでの表示（モバイルフレンドリー）が重要です。

3つの指標と合格基準

3指標すべてが「良好」を取る為、URL別に75パーセンタイル（75%のユーザーの体験）が基準以内である必要があります。

要するに、一部のユーザーだけ速くてもダメで大多数が快適である必要があるということです。

計測ツール

まずPageSpeed Insightsで対象URLを測り、Google Search Consoleで問題 URL を洗い出すのが効率的な流れです。

順位に使われるのはフィールドデータである点を覚えておきましょう。

LCP（最大コンテンツ描画時間）の改善

LCPは「ページ内で最も大きな要素（多くはヒーロー画像 or H1テキスト）」が画面に表示されるまでの時間です。

1. 画像最適化：WebP/AVIF化、適切なサイズで配信、ファーストビューは即読み（画像SEO）
2. サーバ応答時間（TTFB）短縮：PHP/DBクエリ高速化、CDN導入、HTTP/2有効化
3. CSS/JSのレンダリングブロック解消：クリティカルCSSをinline化、JSは defer/async
4. preloadで重要リソースを先読み：<link rel="preload" as="image" href="hero.webp">
5. フォントの読み込み最適化：font-display: swap、サブセット化

💡 最も効果が大きいのは画像最適化。ヒーロー画像をWebP化＋widthを指定するだけで、LCPが1.5秒短縮というケースは珍しくありません。詳しくは「画像SEO完全ガイド」へ。

INP（操作応答時間）の改善

INPは「ボタンクリック・タップ・キー入力に対して、画面が次に更新されるまでの時間」です。

2024年3月にFIDから置き換わった新指標で、より厳しい基準です。

1. JavaScriptの分割と遅延実行：code splitting、不要な処理は requestIdleCallback で
2. 長時間タスクの分割：50ms以上のタスクは setTimeout などで分割
3. イベントハンドラの軽量化：重い処理は Web Worker に移譲
4. サードパーティスクリプトの遅延：解析タグ・チャット等は load イベント後に
5. 不要なライブラリの削除：使っていない jQuery などは除去、部分インポートを活用

⚠️ INPが悪化しやすい典型例：GTM/GA4経由で大量のタグを実行している、ヒートマップ・チャット・広告タグが多重に読み込まれている。タグの整理が効きます。

CLS（レイアウトずれ）の改善

CLSは「ページ読み込み中に要素がガクッと動く度合い」を数値化したものです。

とくに困るのが、タップしようとした瞬間に広告が挿入されて誤タップ、というケースです。

1. 画像・iframeに width / height を明示：ブラウザが事前に領域を確保
2. 広告枠のサイズ予約：min-height で事前確保し、動的挿入を避ける
3. Web Fontの切替対策：font-display: optional や size-adjust
4. 動的コンテンツの挿入位置：既存コンテンツの「上」ではなく「下」に追加
5. CSSアニメーション：top/left ではなく transform: translate を使う

CWV対策の優先順位

時間と予算が限られる場合、次の順で対策するのが投資対効果が高いです。

1. 画像WebP化 + 遅延読み込み：1日で実装可、LCP改善が大きい
2. サードパーティタグの整理：GTM内の不要タグを削除、INP改善
3. サーバ・CDN見直し：ホスティング変更も検討、全指標改善
4. JSバンドル最適化：code splitting、INP/LCP両方改善
5. CSS最適化：最後の詰め、コスパは下がる
6. 
   

💡 結論: Core Web Vitalsは「まず画像、次にタグ整理、最後にコード最適化」の順が王道です。順位への効果は品質を整えたうえでの上乗せ。Search Consoleのフィールドデータを見ながら改善しましょう。次は「画像SEO完全ガイド」へ進みます。