インデックスドライブ.
サーチコンソール

サーチコンソールのCLSとは?

Google Search Consoleに「CLSの問題」や「改善が必要」と表示され、どこを修正すべきか迷う方が多いようです。
CLSという用語は耳にしたことがあっても、レポートの数値が示す意味や、複数のURLが一括で示される理由は分かりにくいと感じられます。

本記事では、サーチコンソールで確認できるCLSの意味や判定基準、レポートの見方、レイアウトシフトの主な要因と対策を、Googleの公式情報を基にまとめています。
読み進め終える頃には、サイトのどのページをどの順序で見直すべきかが把握でき、落ち着いて対応を進められるようになるはずです。実際に手順を進めると、数値の改善を実感できるでしょう。

CLSは「画面のずれ」の程度を示す指標で、目標は0.1未満です

サーチコンソールのCLSは、「ウェブに関する主な指標(Core Web Vitals)」レポートで確認できる、ページが表示されている間にコンテンツが予期せずどれだけシフトしたかを表す指標です。

Googleは、ユーザー体験を向上させるためにCLSを0.1以下に抑えることを推奨しています。
「改善が必要」「不良」と表示された場合は、対象のURLグループの代表ページを開き、画像・広告・埋め込み要素・Webフォントなど、後から位置が変わる要素をチェックし、対策を講じることが基本です。実際に改善に取り組むと、ページの安定感が実感できるのが嬉しいですね。

修正を行った後は、直ちに結果を判断せず、時間を置いてレポートの変化を追うことが重要です。

サーチコンソールでCLSが把握しにくいのは、実際のユーザーから取得したデータを利用しているからです

サーチコンソールのCLSを正しく捉えるには、指標の意味だけでなく、レポートの構造も把握しておくことが求められます。
この記事では、判定基準、データの出典、表示の特徴について順に説明します。

CLS(累積レイアウトシフト)とは何かを解説します

CLSは「Cumulative Layout Shift」の略称で、日本語では「累積レイアウトシフト」と呼称されます。
閲覧中に画面上のコンテンツが予期せず移動する現象を、数値で測る指標です。

例えば、以下のような体験をしたことがある方は多いでしょう。

  • 記事を読んでいる途中で広告が読み込まれ、文章が下に押し出された
  • タップしようとした瞬間にボタンの位置がずれ、別のリンクを押してしまった
  • 画像が後から表示され、読んでいた位置が分からなくなった

CLSは、ユーザーが感じるストレスや誤操作につながるずれを測定する指標です。
数値が低いほど、画面が安定していると判断できます。

CLSの評価基準

Googleが定めたCLSの評価基準は以下の通りです。

判定CLS
良好0.1以下
改善が必要0.1超〜0.25以下
不良0.25超

この基準は、モバイルとデスクトップのそれぞれで、ページ訪問の75パーセンタイルに適用されます。
これは、訪問の大半(およそ4分の3)で良好な体験が得られているかを見る考え方です。
一部の訪問だけ良い結果が出ても、多くの訪問でずれが起きていれば、良好とは判定されにくいと考えられます。

レポートのデータは実ユーザーのフィールドデータです

サーチコンソールの「ウェブに関する主な指標」レポートは、Chrome User Experience Report(CrUX)から取得したデータを基にしています。
このデータは、実在するChromeユーザーの匿名利用状況を集計したものです。数値が改善されると、閲覧者の満足感が高まるのを実感できるでしょう。

一方、PageSpeed Insightsのラボテストや開発者ツールで取得する計測は、テスト環境で測定する「ラボデータ」です。
性質が異なるため、ラボデータで改善しても、サーチコンソールの数値が即座に変わるとは限りません。

実際のユーザーは、通信速度や端末、スクロール方法が多様です。
その結果、テストでは観測できなかったずれが、実際の閲覧時に発生していることがあります。

URLは「グループ単位」として表示されます

サーチコンソールのレポートでは、類似した利用体験と判断されたURLがひとつのグループとしてまとめられることがあります。
その中で代表的に表示されるURLは、グループ全体の状態を示すサンプルの一例です。

多くのサイトでは、ブログ記事や商品ページなど同一テンプレートのページが同様の構造を持つため、同一要因でCLSが悪化しているケースが見られます。
代表URLだけでなく、同じテンプレートの他ページも合わせて確認することが重要です。

レポートにURLが表示されないケースもあります

レポートに掲載するには、一定量の利用データが必要です。
さらに、レポートに含まれるのはインデックスに登録されたURLに限られます。

アクセス数が少ないサイトや新規に公開したページは、データが不足しているためレポートに表示されないことがあります。
これはバグではなく、レポートの仕組みに起因すると考えられます。

CLSと検索順位の関係性

Googleは、Core Web Vitalsを検索順位の評価要素の一つとして示しています。
しかし、検索順位は多数の要因で決定されるため、CLSが低いからといって必ず順位が下がるとは断言できません。

CLSは、まずユーザー体験の向上を目的とした指標と位置付けるのが適切です。
ずれが少ないページは、読者が安心して閲覧でき、誤クリックも防げるため、サイト全体の使いやすさが向上すると見なされます。

サーチコンソールでCLSをチェックし、改善する手順

以下では、サーチコンソール上でCLSを確認し、原因を特定して改善する手順を具体例を交えて解説します。

例1:サーチコンソールでCLS問題を確認する手順

まずはレポートで現状を把握しましょう。

レポートの開き方

  1. Search Consoleにログインし、対象のプロパティを選択します。
  2. 左側のメニューから「ウェブに関する主な指標」を開きます。
  3. 「モバイル」と「デスクトップ」のそれぞれのレポートを開きます。
  4. 「不良」または「改善が必要」の項目から、CLSに関する問題を選択します。
  5. 影響を受けているURLグループと、サンプルURLを確認します。

確認時のポイント

モバイルとデスクトップでは画面幅やレイアウトが異なるため、CLSの数値も変わることがあります。
特にモバイルは画面が小さく、広告や画像の影響を受けやすい傾向があるので、優先的に確認すると効果的です。

また、問題のあるURLグループに含まれるページ数も確認してください。
影響が大きいグループから手を付けることで、効率的に改善を進められます。

例2:画像・動画によるレイアウトシフトの改善

CLSが悪化する主な原因の一つは、画像や動画のサイズが事前に確保されていないケースです。実際にサイズ指定を忘れがちになると、思わぬレイアウト崩れに驚かされます。

よくある状況

ブログ記事のアイキャッチ画像や本文中の画像に幅・高さが指定されていない場合、画像の読み込みが完了した瞬間に表示領域が急激に拡大します。
その結果、下に配置された文章が押し下げられ、レイアウトシフトが起きます。

対策の考え方

  • 画像や動画のタグに幅(width)と高さ(height)を指定する
  • CSSでアスペクト比(aspect-ratio)を設定する
  • 読み込み前から、表示に必要なスペースを確保する

このように読み込み前から表示領域を確保しておくことで、コンテンツが後から押し出されるリスクを低減できます。
同一テンプレートの全ページに適用できる修正になることが多いため、テーマやテンプレート側で対応するのが効率的です。

例3:広告や埋め込みコンテンツのスペース確保

広告や外部の埋め込みコンテンツも、CLSの原因となりやすい要素です。

よくある状況

記事の冒頭や途中に広告枠を設置していると、広告が後から読み込まれる際に本文が下に押し出されることがあります。
SNSの投稿や地図、動画などの埋め込み要素も、読み込み後にサイズが変化することでずれが生じる可能性があります。

対策の考え方

  • 広告枠の高さをあらかじめ確保しておく
  • 埋め込みコンテンツの表示領域を事前に設定する
  • 既存のコンテンツの上に、後から要素を挿入しない設計にする

広告の表示サイズは配信内容によって変わることがあります。
そのため、想定される最も一般的なサイズで領域を予約しておくといった工夫が有効です。

例4:Webフォントでの文字ずれの確認

Webフォントを使用しているサイトでは、フォントの読み込み前後で文字幅や行の高さが変化し、文章の配置がずれることがあります。
見出しや本文の行数が変わると、下部の要素がまとめて動くため、CLSに影響する可能性があります。

この場合は、フォントの読み込み方法や代替フォントとの見た目の差を見直すことが検討されます。
ただし、原因はページごとに異なるため、開発者ツールなどでページの状態を確認し、どの要素が動いているかを特定してから対策することが重要です。

例5:修正後のレポート推移を確認する

対策を行った後は、効果を確認しましょう。

ラボデータで修正内容を確認する

まずはPageSpeed Insightsや開発者ツールで、レイアウトシフトが減少しているかを確認します。
これにより、修正が意図通りに機能しているかを早めに把握できます。

フィールドデータの変化を待つ

サーチコンソールのレポートは、実ユーザーの利用データに基づいて集計されます。
そのため、修正してもすぐに数値が変わらず、時間をおいて推移を確認する必要があります。
数日で判断せず、一定期間の変化を見守る姿勢が大切です。

LCP・INPも合わせて確認する

「ウェブに関する主な指標」レポートではCLSに加えてLCP(読み込み速度)とINP(操作応答速度)も取り上げています。
URLグループの総合的な状態は、対象指標の中で最も悪いものに左右されます。
CLSだけを改善しても、他の指標に課題が残っていればグループ全体の評価は変わらない可能性があるため、3つの指標を併せて確認することをおすすめします。

例6:改善したページを検索エンジンに届ける

CLSの改善でページの使いやすさが向上しても、そのページが検索エンジンにインデックス登録されていなければ、検索結果からの訪問にはつながりません。
また、前述のとおり、サーチコンソールのレポートに含まれるのはインデックス登録済みのURLです。

新しく公開した記事や、まだ登録されていないページがある場合は、Search Consoleの「インデックス登録をリクエスト」を使う方法があります。
ページ数が多く1件ずつの操作が負担になる場合は、このブログを運営しているインデックスドライブのように、公開中のページのURLを送るだけで、インデックス登録を後押しできるサービスを選択肢のひとつとして検討することもできます。
URLを1行に1つ貼り付けて、まとめて送信できる点が特徴です。

サーチコンソールのCLSは、要因を見つけて確実に改善できます

本記事では、以下のポイントをまとめます。

  • CLSは、ページ表示中のコンテンツが予期せず動いた度合いを示す指標です。
  • 判定基準は、良好が0.1以下、改善が必要が0.1超〜0.25以下、不良が0.25超です。
  • サーチコンソールのレポートは、CrUXの実ユーザーのデータにもとづき、URLグループ単位で表示されます。
  • 主な原因は、画像・動画のサイズ未指定、広告や埋め込み要素の後からの挿入、Webフォントの読み込みなどです。
  • 修正後は時間をおいてレポートの推移を確認し、LCP・INPもあわせて見直すことが大切です。

CLSの数値は、読者がページを安心して閲覧できるかを示す指標です。
代表URLから原因を探り、テンプレート単位で対策することで、サイト全体の使いやすさを効率よく向上させられると考えられます。CLSが低いほど、閲覧体験が快適になることを実感できるでしょう。

検索で見つかりやすい、読みやすいページにするために

CLSの改善は、一度に全部を直す必要はありません。
まずはサーチコンソールで「不良」のURLグループをひとつ選び、画像や広告の表示領域を中心に見直してみましょう。小さな改善でも効果を実感できることが多いです。

改善したページや新たに公開した記事が検索結果に表示されるには、インデックスに登録されていることが前提です。
登録が進まないページや多数のページについては、URL を送信するだけでインデックス登録を促進できるインデックスドライブの活用も検討してみてください。

改善したページを検索エンジンに届ける

CLSを整えて読みやすくしたページでも、インデックスに登録されていなければ検索結果に表示されません。インデックスドライブは、Search Console の設定を行わず、公開中のページの URL を送るだけでインデックス登録を促します。複数の URL も一括で送信可能です。

インデックスドライブを見てみる

※初めての方は7日間無料でお試しいただけます(カード情報の登録が必要で、8日目以降は月額料金が発生します)。インデックス登録は検索エンジンの判断によるもので、登録の可否や所要時間を保証するものではありません。