Core Web Vitals
Core Web Vitalsとは、Googleが定義する3つの主要なユーザー体験指標であり、Webページの読み込み速度・応答性・視覚的な安定性を数値化したものです。
Core Web Vitalsとは、Googleが定義する3つの主要なユーザー体験指標であり、Webページの読み込み速度・応答性・視覚的な安定性を数値化したものです。
なぜ重要か
Core Web Vitalsは、GoogleのPage Experienceアルゴリズムに含まれる公式の検索ランキング要因です。2025〜2026年の業界分析によると、全体のランキングシグナルのおよそ10〜15%を占めるとされています。競争の激しいキーワードでは、3つの指標すべてを満たすサイトが検索での可視性を8〜15%向上させたという報告もあります。一方で、2025年のWeb Almanacのデータによると、3つのしきい値すべてを通過しているのはモバイルページで約48%、デスクトップページで約56%にすぎません。つまりCore Web Vitalsの最適化は、競合に対して優位性を獲得する現実的なチャンスとなるのです。
3つの中核指標
LCP(Largest Contentful Paint): 読み込みパフォーマンス
ページの主要なコンテンツ(最も大きな画像またはテキストブロック)が画面に描画されるまでにかかる時間を測定します。
| 評価 | しきい値 |
|---|---|
| 良好 | <= 2.5秒 |
| 改善が必要 | 2.5秒 〜 4.0秒 |
| 不良 | > 4.0秒 |
INP(Interaction to Next Paint): 応答性
ユーザーの操作(クリック、タップ、キーボード入力など)から、実際に画面が更新されるまでの遅延を測定します。INPは2024年3月にFID(First Input Delay)に代わって正式にCore Web Vitalsとなり、最初の入力だけでなくページのライフサイクル全体にわたる応答性を評価します。
| 評価 | しきい値 |
|---|---|
| 良好 | <= 200ミリ秒 |
| 改善が必要 | 200ミリ秒 〜 500ミリ秒 |
| 不良 | > 500ミリ秒 |
CLS(Cumulative Layout Shift): 視覚的な安定性
ページの読み込み中にレイアウトが予期せずずれる度合いを測定します。CLSスコアが高くなる一般的な原因としては、広告や画像の読み込みが遅れてボタンの位置が動いてしまうことなどが挙げられます。
| 評価 | しきい値 |
|---|---|
| 良好 | <= 0.1 |
| 改善が必要 | 0.1 〜 0.25 |
| 不良 | > 0.25 |
Core Web Vitalsの評価に合格したとみなされるには、3つの指標すべてが、ページ訪問の少なくとも75%で「良好」のしきい値を満たしている必要があります。
最適化の方法
LCPの改善
- LCPの対象となる画像に
fetchpriority="high"属性を付与し、<link rel="preload">でプリロードします。 - WebPやAVIFなどの次世代画像フォーマットを使用してファイルサイズを削減します。
- CDN(コンテンツ配信ネットワーク)を活用してサーバーの応答時間(TTFB)を短縮します。
- サーバー側のキャッシュを実装し、データベースのクエリを最適化します。
INPの改善
- メインスレッドをブロックする非必須のJavaScriptを
deferやasyncで遅延読み込みします。 - 長いタスクを小さな単位に分割し、ブラウザがユーザー入力により早く応答できるようにします。
- 不要なサードパーティのスクリプトを削除するか、読み込みタイミングを遅らせます。
CLSの改善
- 画像や動画の要素に
widthとheight属性を指定し、ブラウザがあらかじめスペースを確保できるようにします。 - Webフォントの読み込みでは
font-display: swapを<link rel="preload">と併用し、レイアウトのずれを防ぎます。 - 既存コンテンツの上にバナーや広告を動的に挿入することを避けます。
計測ツール
| ツール | 種類 | 説明 |
|---|---|---|
| Google Search Console(Core Web Vitalsレポート) | フィールドデータ | サイト全体のCWVの状態をURLごとにグループ化して確認できます |
| PageSpeed Insights | フィールド + ラボデータ | CrUXデータとLighthouseの分析を同時に提供します |
| Lighthouse(Chrome DevToolsに内蔵) | ラボデータ | 開発中にパフォーマンスの問題を診断し、改善の推奨事項を提供します |
| Web Vitals Chrome拡張機能 | リアルタイム監視 | 閲覧中にLCP・INP・CLSをリアルタイムで確認できます |
| WebPageTest | ラボデータ | さまざまなネットワーク条件やデバイス環境にわたって詳細なテストを実行します |
| Google Analytics 4 | フィールドデータ | 実際のユーザーのCWVデータを収集・分析します |
フィールドデータは実際の訪問者の環境を反映しており、Googleの検索ランキングに直接使用されるデータです。ラボデータは管理された環境で測定された値であり、診断やデバッグに役立ちます。両方の種類を併用するのが最も効果的なアプローチです。
Sources:
- Google検索セントラル / Core Web Vitals
- 2026年版 Core Web Vitals最適化ガイド / Sky SEO Digital
- 2026年に最も重要なCore Web Vitals指標 / NitroPack
- Core Web Vitals 2026: テクニカルSEO / ALM Corp
- 2026年のSEOにおいてCore Web Vitalsはどれほど重要か / White Label Coders
- LCP・INP・CLSの解説(2026年) / CoreWebVitals.io
- Core Web Vitalsのしきい値 / web.dev
- Core Web Vitalsテストに最適な8つのツール / WP Rocket
関連するinblogの記事
inblogがどう役立つか
inblogはNext.jsのSSRをベースに構築されており、最適化されたCore Web Vitalsのパフォーマンスを提供します。