リヨンの Core Web Vitals 最適化 — Googleのスコアをすべて合格圏に、検索順位の向上へ

Core Web Vitals とは？ なぜ Google が重視するのか

2021年から Google のランキング要因に

2021年6月以降、Google は Core Web Vitals をランキングアルゴリズムに組み込んでいます。高速で安定したサイトは、動作の遅い競合サイトよりも検索結果で優遇されます。このアップデートにより、SEOにおける技術的なパフォーマンスの重要性が高まりました。Core Web Vitals の最適化に取り組むリヨンの中小企業は、ローカル検索結果で測定可能な競争優位を得られます。また、このパフォーマンスは Google Business Profile での露出にも直接影響します。

LCP — Largest Contentful Paint（最大コンテンツの描画）

LCP は、ページ内で最も大きな表示要素（ヒーロー画像、メインタイトル、テキストブロック）が表示されるまでの時間を測定します。Google は、LCP が2.5秒未満なら「良好」、2.5〜4秒なら「改善が必要」、4秒超なら「不良」と評価します。LCP が悪化する主な原因は、最適化されていない画像、遅いサーバー（TTFB が高い）、レンダリングをブロックする CSS や JavaScript、重いWebフォントです。

INP — Interaction to Next Paint（次の描画までのインタラクション）

INP は2024年3月に FID（First Input Delay）に代わって公式指標となりました。訪問中のすべてのユーザー操作（クリック、キー入力、タップ）の遅延を測定し、最も遅いものを採用します。Google の「良好」の基準は200ミリ秒未満です。INP が高い原因は、多くの場合、ブラウザのメインスレッドをブロックする重い JavaScript です。

CLS — Cumulative Layout Shift（累積レイアウトシフト）

CLS は、ページの視覚的な安定性、つまり初回読み込み後に要素が動くことで生じる予期しないずれを測定します。Google の基準は0.1未満です。よくある原因は、サイズが明示されていない画像、リフローを引き起こすWebフォント、動的に読み込まれる広告、サイズ指定のない iframe です。CLS が悪いとユーザーにストレスを与え、離脱の原因にもなります。

Core Web Vitals を改善する私たちの手法

画像の最適化（WebP、遅延読み込み、サイズ指定）

すべての画像を WebP（または AVIF）形式に変換してスマートに圧縮し、CLS を防ぐために width と height 属性を追加し、ファーストビューより下の画像にはネイティブの遅延読み込みを実装します。結果として、LCP は平均で半分に短縮され、CLS は0になります。

CSS・JS・HTML の圧縮（ミニファイ）

1キロバイトの差が効いてきます。CSS、JavaScript、HTML をミニファイして転送ファイルのサイズを削減します。tree-shaking で未使用のコードを取り除き、code-splitting でバンドルを必要に応じて読み込まれる単位に分割します。

サードパーティスクリプトの遅延読み込み

サードパーティのスクリプト（アクセス解析、チャット、広告、SNS）は、INP 悪化の主な原因であることが少なくありません。これらを非同期または遅延で読み込み、ページの初回描画に影響しないようにします。

重要リソースの事前読み込み

preload、prefetch、preconnect ディレクティブを活用し、フォント、ヒーロー画像、重要なスタイルシートといった必須リソースをブラウザが先回りして読み込めるようにします。

高度なキャッシュ設定と CDN

リソースの種類ごとに最適な期間でブラウザキャッシュを設定し、グローバル CDN に配信して、訪問者に最も近い拠点からページを届けます。パフォーマンスを長く維持するには、保守サービスとの併用をおすすめします。

レンダリングをブロックする JavaScript の排除

ページのレンダリングを妨げる JavaScript を特定し、削除または読み込みを後回しにします。クリティカル CSS は HTML にインラインで埋め込み、残りは非同期で読み込みます。

数字で見る私たちの実績

目標は PageSpeed 90点以上、計測結果は公開

私たちの優れた制作実績は PageSpeed のパフォーマンスで95/100を超えています（Damien Mugnier 97点、Compagnie l'Entr'Axes 98点、Le Galant 96点）。ただし、すべてがそうではありません。計測したプロジェクトの平均は84/100で、それより低いスコアはすべて、原因と改善計画とともにプロジェクトページで公開しています。それこそが、このサービスで取り組む課題です。これらのスコアを長期的に維持するため、保守サービスによる定期的なフォローで、最適なパフォーマンスを継続的に確保します。

LCP：Google の基準は2.5秒、私たちはそれを大きく下回る値を目指します

私たちは「平均 LCP」を公表していません。LCP は訪問者のネットワークや端末に左右されるため、単一の数値には意味がないからです。公表しているのは各プロジェクトの Lighthouse パフォーマンススコアで、改善の余地がある場合も含め、それぞれの事例紹介ページに掲載しています。

CLS：表示のずれゼロを設計ルールに

CLS がゼロとは、ページ読み込み中に表示のずれがまったくないことを意味します。すべての画像へのサイズ指定、ずれのないフォント読み込み、高さの事前確保。これは私たちの開発ルールであり、Lighthouse の計測のたびに確認しています。ただし、すべてのプロジェクトで保証する数値ではありません。

最近の開発案件はすべて INP を最適化

モダンな技術（React、Next.js、Vite）の採用と code-splitting への配慮により、私たちのサイトは Google の基準である200ミリ秒を大きく下回る応答速度を実現するよう設計されています。

Core Web Vitals とリヨンでの Google 検索順位

表示速度が検索順位にもたらす変化

Google は Core Web Vitals を数あるランキングシグナルの一つとして使っています。コンテンツが同等なら、より速いサイトの方がクロールされやすく、コンバージョンも高くなります。私たちは計測していない順位上昇を公表することはありません。各プロジェクトの Lighthouse スコアはそれぞれの事例紹介ページに掲載しており、継続サポートをご契約のお客様には毎月順位レポートをお届けしています。

表示速度とコンバージョン率の関係

モバイルの表示速度に関する Google の調査（新しいタブで開きます）によると、読み込み時間が1秒から3秒になると直帰の確率は32%、1秒から5秒になると90%上昇します。表示速度は、コンバージョン、売上、顧客満足度に直接影響します。

現在の Core Web Vitals を無料で診断

現在の Core Web Vitals について、迅速かつ無料の診断をご提供します。15分で主な改善ポイントを特定します。全体像を把握するには、テクニカルSEO監査やWebサイト総合監査もあわせてご利用ください。