株式会社renue
AI導入・DXの悩みをプロに相談してみませんか？
AIやDXに関する悩みがありましたら、お気軽にrenueの無料相談をご利用ください。 renueのAI支援実績、コンサルティングの方針や進め方をご紹介します。
Core Web Vitalsとは？SEOとUXの交差点
Core Web Vitals（コアウェブバイタル）は、Googleが定義したユーザー体験の品質を定量的に評価する3つの指標です。ページの読み込み速度、インタラクティブ性、視覚的安定性を測定し、検索ランキングとコンバージョン率の両方に直接影響を与えます。
Core Web VitalsはGoogleの検索評価の一角を占めており、ランキングに使われる一要素です。E-E-A-T（経験、専門性、権威性、信頼性）はコンテンツを評価する際の観点で、それ自体が単独のランキングシグナルではありません。しかし、2026年時点でGoogleの「Good」スコアに達しているサイトはわずか47%にとどまり、残りの53%は8〜35%のコンバージョン、トラフィック、収益を損失しています。
AWS公式文書は、Amazonで行われたテストの結果として、読み込み時間が100ms増えるごとに売上が1%減少したと紹介しています。測定時期や対象ページは同文書に示されておらず、すべてのサイトで同じ減少率になるとは限りません。Webパフォーマンスの最適化は「技術的な改善」にとどまらず、直接的なビジネスインパクトを持つ投資です。
Core Web Vitalsの3指標
| 指標 | 測定対象 | Good | Needs Improvement | Poor |
|---|---|---|---|---|
| LCP（Largest Contentful Paint） | 最大コンテンツの表示速度 | 2.5秒以下 | 2.5〜4.0秒 | 4.0秒超 |
| INP（Interaction to Next Paint） | インタラクション応答速度 | 200ms以下 | 200〜500ms | 500ms超 |
| CLS（Cumulative Layout Shift） | 視覚的な安定性 | 0.1以下 | 0.1〜0.25 | 0.25超 |
LCP（Largest Contentful Paint）
LCPは、ページのメインコンテンツ（ヒーロー画像、見出しテキスト、動画のサムネイルなど）が表示されるまでの時間を測定します。ユーザーが「ページが表示された」と感じるまでの体感速度に最も近い指標です。目標は2.5秒以下です。
INP（Interaction to Next Paint）
INPは2024年3月にFID（First Input Delay）に代わって導入された新しい指標で、ユーザーのインタラクション（クリック、タップ、キー入力）に対するページの応答速度を測定します。FIDが「最初のインタラクション」のみを測定していたのに対し、INPはページ利用中の「全てのインタラクション」を対象とし、原則として最も遅い応答時間を採用しますが、インタラクション50回ごとに遅いものを1件除いて外れ値を調整します（INPの定義）。目標は200ms以下です。
CLS（Cumulative Layout Shift）
CLSは、ページの利用中に要素が予期せず移動する「レイアウトシフト」を測定します。シフト間隔が1秒未満、最長5秒のセッションウィンドウごとにスコアを合計し、その最大値を採用します（CLSの定義）。読んでいたテキストが突然ずれる、クリックしようとしたボタンが移動するなどの体験は、ユーザーのフラストレーションを直接的に高めます。目標は0.1以下です。
Core Web Vitalsのビジネスインパクト
| 改善領域 | 効果 | データソース |
|---|---|---|
| コンバージョン率 | CWV最適化で15〜30%向上 | EC業界の複数事例 |
| オーガニック流入 | 包括的な最適化で12〜20%増加 | SEO業界レポート |
| 売上影響 | Amazonのテストで100msの遅延につき1%の売上減少と紹介 | AWS公式文書（測定時期・対象ページは未記載） |
| コンバージョン率 | 1秒の遅延でコンバージョン7%低下 | Google調査 |
| SEOランキング | ランキングに使用される一要素（比重の数値は非公表） | Google Search Central |
LCP改善の実践手法
1. サーバーレスポンスタイムの短縮（TTFB）
- CDNの導入: CloudFlare、Fastly、AWS CloudFrontなどでユーザーに近いエッジからコンテンツを配信
- サーバーサイドキャッシュ: Redis、Varnishによる動的コンテンツのキャッシュ
- HTTP/2→HTTP/3への移行: QUICプロトコルによる接続の高速化
2. リソースの最適化
- 画像の最適化: WebP/AVIFフォーマットへの変換、レスポンシブ画像（srcset）の実装、画面外画像の遅延読み込み（lazy loading）。LCP対象画像は遅延読み込みを避ける（LCP最適化の公式解説）
- CSS/JSの最適化: クリティカルCSSのインライン化、不要なCSS/JSの削除、コード分割（Code Splitting）
- フォントの最適化: font-display: swap/optionalの設定、プリロード、サブセット化
3. レンダリングの最適化
- プリロード: LCP要素（ヒーロー画像等）をプリロード指定（link rel=preload）
- SSR/SSG: サーバーサイドレンダリングや静的サイト生成でFirst Paintを高速化
- 優先度ヒント: fetchpriority=highでLCP要素の読み込みを優先
INP改善の実践手法
1. メインスレッドの負荷軽減
- 長いタスクの分割: 50ms以上のJavaScriptタスクをyield（requestIdleCallback、scheduler.postTask）で分割
- Web Workerの活用: 重い計算処理をバックグラウンドスレッドに移動
- 不要なJSの削除: バンドル分析（webpack-bundle-analyzer等）で未使用コードを特定・除去
2. イベントハンドラの最適化
- デバウンス/スロットル: スクロール・リサイズイベントの発火頻度を制御
- passive event listener: スクロールイベントにpassive: trueを設定
- 仮想スクロール: 大量リストのレンダリングを最適化
CLS改善の実践手法
- 画像・動画にサイズ属性を指定: width/heightまたはaspect-ratioで表示領域を事前確保
- Web フォントのFOUT/FOIT対策: font-display: optionalやフォントプリロードでレイアウトシフトを防止
- 動的コンテンツの表示領域確保: 広告、バナー、遅延読み込みコンテンツにmin-heightを設定
- アニメーションにtransformを使用: top/leftではなくtransformプロパティでアニメーションを実行
Core Web Vitalsの計測ツール
| ツール | データタイプ | 特徴 |
|---|---|---|
| PageSpeed Insights | フィールド+ラボ | Googleの公式ツール、CrUXデータ搭載 |
| Chrome DevTools | ラボ | 開発者向けの詳細な分析 |
| Lighthouse | ラボ | 包括的な監査レポート |
| Google Search Console | フィールド | サイト全体のCWVレポート |
| web-vitals.js | フィールド | 実ユーザーデータのカスタム収集 |
| CrUX（Chrome User Experience Report） | フィールド | 実ユーザーの集計データ |
フィールドデータ vs ラボデータ
Googleのランキングに使用されるのは「フィールドデータ」（実際のユーザーのブラウザから収集されるデータ）です。Lighthouseなどの「ラボデータ」は開発・デバッグに有用ですが、ランキング判定には直接使用されません。改善の効果を正確に評価するには、CrUXのフィールドデータ（28日間の集計）を確認してください。
2026年のWebパフォーマンストレンド
AI活用の加速
72%の企業がAIをCore Web Vitals最適化に活用しています。AIが画像の自動最適化、コードの自動分割、パフォーマンスボトルネックの自動検出を行い、最適化作業の効率が飛躍的に向上しています。
エッジコンピューティングとの統合
CDNのエッジノードでSSRやAPIレスポンスの生成を行う「エッジレンダリング」が普及し、TTFB（Time to First Byte）の大幅な短縮が実現しています。Cloudflare Workers、Vercel Edge Functions、AWS Lambda@Edgeなどが活用されています。
INPの重要性増大
2024年3月にFIDからINPに正式移行した後、INPの最適化が多くのサイトにとって最大の課題となっています。SPAフレームワーク（React、Vue等）のハイドレーション最適化、Reactの新しいConcurrent Featuresの活用が注目されています。
よくある質問（FAQ）
Q. Core Web Vitalsの改善はSEO順位にどのくらい影響しますか？
Core Web Vitalsはランキングに使われる一要素ですが、Googleは比重を数値で公表していません。関連性が高く有用なコンテンツも重視され、E-E-A-Tそのものは単独のランキング要因ではありません（ページ体験、E-E-A-Tの説明）。ただし、同程度のコンテンツ品質を持つ競合サイト間では、CWVのスコアが順位の決定打になることがあります。また、CWV改善の効果は、直帰率やエンゲージメントなどのUX指標でも検証できます。ただし、これらの変化だけで検索順位の上昇が保証されるわけではありません。
Q. どの指標から改善を始めるべきですか？
まずPageSpeed InsightsまたはGoogle Search Consoleで自サイトの現状を確認し、最もスコアの悪い指標から着手してください。一般的にはLCPの改善が最もインパクトが大きく、画像最適化とCDN導入だけで大幅に改善できるケースが多いです。INPはJavaScriptの最適化が必要で技術的難易度が高いため、LCP→CLS→INPの順で取り組むのが効率的です。
Q. WordPressサイトでもCWVを改善できますか？
改善可能です。WP Rocket、Autoptimize等のキャッシュ・最適化プラグイン、ShortPixel等の画像最適化プラグイン、CDN（Cloudflare等）の導入で大幅に改善できます。ただし、プラグインの数が多すぎるとJavaScriptが肥大化しINPが悪化するため、不要なプラグインの削除も重要です。テーマの選択もパフォーマンスに大きく影響するため、軽量なテーマを選定してください。
まとめ：CWV最適化はSEOとビジネスを同時に改善する最高の投資
Core Web Vitalsの最適化は、SEO順位の向上、コンバージョン率15〜30%の改善、ユーザー体験の向上を同時に実現する、ROIの高い投資です。47%のサイトしかGoodスコアを達成していない現状では、CWVの改善自体が競合との差別化要因となります。LCP、INP、CLSの各指標を体系的に改善し、定期的にフィールドデータで効果を検証しましょう。
renueでは、Webパフォーマンスの最適化からSEO戦略の策定、フロントエンド開発の改善まで、企業のWebサイト最適化を包括的に支援しています。サイト速度やCWVの改善でお悩みの方は、ぜひお気軽にご相談ください。
株式会社renueでは、AI導入戦略の策定からDX推進のコンサルティングを提供しています。お気軽にご相談ください。
