Search Consoleエラー解決法「CLSに関する問題:0.1超(パソコン)」②

羽を拡げて飛び立つ鳥 ウェブサイト運営の知恵

Webページのロード中にクリックしたいリンクなどのターゲットが移動しないといった視覚的安定性を示すパラメータのCLSは「Cumulative Layout Shift」の略で、日本語では「累積レイアウト変更」と訳されています。

過去に「Google Search Console」の「ウェブに関する主な指標 」(Core Web Vitals)で「改善が必要」と通知され、当サイトの記事「CLSに関する問題:0.1秒超(パソコン)」①でご紹介しているようにCLSが「良好」(0.1以下)になるよう改善に取り組み、Googleから合格認定を受けました。

その後、WordPressがメジャー・アップデート(Ver. 5.6や5.7など)され、当サイトで使用しているWordPressテーマやプラグインにも更新がありました(詳細は別記事の「WordPressプラグインのバージョン確認とアップデート」を参照)。また、「PageSpeed Insights」で利用されている速度スコアの分析ソフトウェアである「Lighthouse」も6.3.0や7.3.0のようにバージョンアップでアルゴリズムも変更され(参照:lighthouseリリース履歴)、Webサイトを取り巻く環境が変化してきました。

このようにWeb環境が変化していく中で、「ウェブに関する主な指標」(Core Web Vitals)で「CLSに関する問題:0.1秒超(パソコン)」の「改善が必要」という2回目の通知を受けました。「PageSpeed Insights」では0.1以下の問題のないCLS値が出ている状態で、合格認定が得られるように「PageSpeed Insights」を使ってCLSの改善を検討しましたが、「ウェブに関する主な指標」(Core Web Vitals)、「CLSに関する問題」で合格することが約6か月間できませんでした。

ところが、WordPress、テーマ、プラグインのアップデート以外にCLS改善の特別な対策をせずに、「ウェブに関する主な指標」(Core Web Vitals)のテストで2度目の合格が得られたのです。

なぜ、そんなことが起きたのでしょうか?

そんな疑問に対する回答として、この記事は「ウェブに関する主な指標」(Core Web Vitals)と「PageSpeed Insights」でCLSに関して比較実験を行い、得られた情報をご紹介しています。

この記事がGoogleによるCLSの状況を理解して、当サイトと同様にCLS改善に悪戦苦闘されている方にお役に立てれば幸いです。

スポンサーリンク (Sponsored Links)

「CLSに関する問題:0.1超」②のエラー状況の確認

「Google Search Console」によるCLSエラー状況の確認

まず、当サイトが直面したCLSエラーの状況をご説明しましょう。

CLSエラーの確認方法はSearch Consoleエラー解決法「CLSに関する問題:0.1超(パソコン)」①でご紹介した方法と基本的に同じです。

「ウェブに関する主な指標」(Core Web Vitals)で「改善が必要」と指摘された内容を確認します。CLSエラーで指摘された内容は次の通りです。

「ウェブに関する主な指標」(Core Web Vitals)で「改善が必要」と指摘された内容
  • 問題内容:
    • 「CLSに関する問題:0.1超(パソコン)」
  • 検出日:
    • 2020/10/05
  • 問題対象URL数(類似のURL):
    • 61
  • 対象URLの代表例とそのCLS数値:
    • https://dan-chan.com/java-update-07/
    • 0.14

「CLSに関する問題:0.1超」②のエラー原因の解析

「PageSpeed Insights」を使ったCLSエラー原因の解析

Googleが提供しているWebページの表示スピードを測定する無償のWebツール「PageSpeed Insights」(下線部をクリック)を使って、CLSエラーの原因を調べます。

「PageSpeed Insights」の使用方法は前回の記事Search Consoleエラー解決法「CLSに関する問題:0.1超(パソコン)」①でご紹介しています。下線部をクリックしてご覧ください。

対象URLで代表例として取り上げられた「https://dan-chan.com/java-update-07/」を「PageSpeed Insights」で解析すると次のことがわかりました。

「ラボ・データ」でのCLS「Cumultive Layout Shift」の値は「0」です。

PageSpeed Insights ラボデータ (CLS=0
PageSpeed Insights ラボデータ (CLS=0)

「診断」の 「レイアウトが大きく変わらないようにする」では次のような4つの要素が指摘されていますが、「CLSへの影響」はすべて「0」になっています。

  • カテゴリー表示
  • 投稿日
  • 更新日
  • パンくずリスト
画像に alt 属性が指定されていません。ファイル名: page-speed-cls-0p1-pc-diagnosis-check-01-800x396.jpg
PageSpeed Insights 診断 (CLS=0)

「PageSpeed Insights」のCLS「Cumultive Layout Shift」値が「0」ということで、問題なしという事を示しています。これでは、「ウェブに関する主な指標」(Core Web Vitals)で「改善が必要」という通知と矛盾します。

CLSエラー要因の推定

なぜ、このような矛盾した状況が生じたのでしょうか?

「ウェブに関する主な指標」(Core Web Vitals)のCLS判定結果と「PageSpeed Insights」のCLSデータが一致していない理由として、次のような要因が考えられます。

考えられる不一致が生じる要因
  1. 「PageSpeed Insights」では「PageSpeed Insights」を使ってテストする人のコンピューター環境下、例えば、特定のWebページ(URL)、特定の時間(テストしている瞬間)でCLS値を表示しています。一方、「ウェブに関する主な指標」(Core Web Vitals)では当サイトのWebページ訪問者の環境下、例えば、当サイトの複数のWebページ(URL)、一定の期間(過去28日間)、アクセスがあったすべてのURLについてCLS値を統計的に集計して評価しています。よって、これら2つのCLS評価は、条件が違うので、必ず一致するわけではありません。
    • 当サイトよりサイト訪問者(特に海外からのアクセス)の方がインターネットの通信経路が長いためにWebページデータをロードするのに時間がかかり、サイト訪問者の方がCLSデータが悪く見える可能性があります。
    • 当サイトが使用しているサーバー・キャッシュやブラウザ・キャッシュのメモリ内容はサイト訪問者のアクセス状況により時間で変化していて、当サイトが「PageSpeed Insights」でテストした時、CLSが良く見えるようなキャッシュ状況の条件である可能性があります。
  2. 「ウェブに関する主な指標」(Core Web Vitals)でのCLSの判定結果が「PageSpeed Insights」のCLS値より悪く見える要因(仮説):
    • Googleから配信され、当サイトのWebページに表示されるGoogle Adsense広告がCLSに悪影響を及ぼしていて、それが「ウェブに関する主な指標」(Core Web Vitals)でのCLS判定に含まれている可能性がある。(「PageSpeed Insights」ではGoogle Adsense広告の影響を排除してCLSデータ表示している!?)

「CLSに関する問題:0.1超」②のエラー改善の行動

Google Adsense自動広告がCLSに悪影響を及ぼすという仮説

「ウェブに関する主な指標」(Core Web Vitals)で「Google Adsense自動広告がCLSに悪影響を及ぼしているのではないか」という疑問から、次のような仮説を立て、仮説の正誤を比較実験で確認しました。

仮説):

  • Google Adsense広告の配信のたびに、広告の画像サイズや表示場所がダイナミックに変化する自動広告(例えば、ファースト・ページの記事タイトルより上に表示されるバナー画像)の表示位置がWebページの冒頭に近いほどCLSが悪くなる。
参考:当サイトのGoogle Adsense 広告の使用状況

当サイトは、コンテンツ連動型配信サービスであるGoogle Adsenseで設定した「自動広告」とWordPressのウィジェットで設定した「手動広告」の両方を使っています。

  • 「自動広告」は、サイト・ページ内に表示される広告の位置やサイズがGoogleによって制御されているので、当サイトで広告を表示する位置を指定することができません。
  • 「手動広告」は、レスポンシブな(画像サイズが変化する)ディスプレイ広告をWordPressのウィジェットを使い、画像の遅延読み込み(Lazyload)の影響を避けるためファースト・ページ外に設定しています。

Google Adsense自動広告によるCLSへの影響の検討方法

Google Adsenseの「自動広告」では、当サイトのWebページ内で広告を表示する位置を指定(固定)できませんが、「Google Adsense」の広告設定のプレビューで、「自動広告」が意向に合わない位置に表示された場合、それを禁止するように設定することができます。

「Google Adsense」 のプレビュウで記事の冒頭(ファースト・ページ内)に「自動広告」が表示されたので、それを許可する場合と禁止する場合を比較する「最適化」の「テスト」(Google Adsense自動広告テスト)を下記のような条件で2回に分けて計約4か月にわたって実施しました。その期間中の「Google Search Console」内の「ウェブに関する主な指標」(Core Web Vitals)でCLS(集計値)と判定結果、および、「PageSpeed Insights」でのCLS値を観察しました。

Google Adsense自動広告テストの内容
  • テスト・ツール:「Google Adsense」「最適化」「テスト」
  • テスト期間1: 2020年11月16日~2020年12月27日までの約1か月
  • テスト期間2: 2020年12月27日~2021年3月27日までの約3か月
  • テスト方法:Webページの冒頭(ファースト・ページ内)に表示される自動広告で、表示が許可されている時と禁止されている時とで判定かかわるようなCLS値(および、Adsense広告の収益)の変化があるか調べる。

Google Adsense自動広告によるCLSへの影響の検討結果

「Google Adsense」の「最適化」で「テスト」でGoogle Adsense自動広告テストを実施中、および、終了後に「ウェブに関する主な指標」(Core Web Vitals)でCLSデータとその評価結果を観測していると、次のような変化が見られた。

Google Adsense自動広告テスト実施中、および、終了後に観測されたCLSの変化
  1. Google Adsense自動広告テストの実施中に、「ウェブに関する主な指標」(Core Web Vitals)でのCLSの悪化が観測された。
    • 「最適化」の「テスト」実施中、CLSは0.14から0.25を超えて0.35に達するCLS悪化が観測され、「ウェブに関する主な指標」(Core Web Vitals)でのCLSの判定結果が「改善が必要」から「不良」へと変化した。(下図参照)
  2. Google Adsense自動広告テストが2021年3月27日で終了した後、「ウェブに関する主な指標」(Core Web Vitals)でCLS改善が観測され、CLSの判定結果が「不良」から「改善は必要」、「改善が必要」から「良好」へと変化した。(下図参照)
  3. 「Google Adsense」の「最適化」の「テスト」実施中/終了後、「PageSpeed Insights」でCLS値を測定したところ、0.1を超えて「改善が必要」となる数値は観測されなかった。
    • 「ウェブに関する主な指標」(Core Web Vitals)でのCLSの判定結果は「改善が必要」と「不良」で、「PageSpeed Insights」でのCLS値は0.1以下でCLS判定は「良好」の範囲内となり、評価結果が異なる。
    • Adsense自動広告がWebページの冒頭(ファースト・ページ内)に表示されると、ファーストページ外に表示される時と比べ、「PageSpeed Insights」によるCLS値はやや悪化するが、0.1以下だった。

CLS評価結果の時間変化:「Google Search Console」/「ウェブに関する主な指標」
CLS評価結果の時間変化:「Google Search Console」/「ウェブに関する主な指標」

Google Adsense自動広告テストの実施中、「ウェブに関する主な指標」(Core Web Vitals)に下記のような2つの変更(Status Change①と②)がありました。

Status Change History (during test period): Google Search Console
Status Change History (during test period): Google Search Console

Status Changeの参照先)Data anomalies in Search Console (Search Console ヘルプ)

Google Adsense自動広告テストの結果に関する考察

「ウェブに関する主な指標」(Core Web Vitals)でのCLSで、Adsense自動広告テスト期間中に

  • A(「改善が必要」=>「不良」)
  • B(「不良」=>「改善が必要」)
  • C(「改善が必要」=>「良好」)

といったCLS判定の変化があった。

=> Google Adsense自動広告テストが終了した日からCLS判定が「不良」から「改善が必要」へ、その後「改善が必要」から「良好」へと変化したことから、Adsense自動広告テストがCLSを悪化させていたと考えられる。

  • Adsense自動広告テストは期間中に条件を変えて収益性の優劣を判定して、自動広告のアルゴリズムを最適化していきます。数値的なデータを測定するため、何らか測定用タグを入れるなどインタラクティブ(対話的)な通信が必要で、これが「ウェブに関する主な指標」(Core Web Vitals)でのCLSに影響を及ぼしていると考えられます。

「ウェブに関する主な指標」(Core Web Vitals)でのCLSでAdsense自動広告テスト期間中にCLS判定の変化があったのにもかかわらず、「PageSpeed Insights」のCLS値は0.1(「改善が必要」の判定基準値)を超えなかった。

=> Google Adsense自動広告テスト期間中、「ウェブに関する主な指標」(Core Web Vitals)でのCLSと「PageSpeed Insights」のCLSでCLS判定の相関が取れていない。

Google Adsense自動広告テスト終了後、「ウェブに関する主な指標」(Core Web Vitals)でのCLS判定が改善していき、「PageSpeed Insights」によるCLS値でともに「良好」という判定で一致した。

=> 「PageSpeed Insights」のCLSは「良好」(0.1以下)で、「ウェブに関する主な指標」(Core Web Vitals)でのCLSより安定していて信頼性があるといえます。

「CLSに関する問題:0.1超」②のエラー改善の検証

「Google Search Console」によるCLSエラー改善の検証

Google Adsense自動広告テスト終了後、前述のように、すでに「Google Search Console」の「ウェブに関する主な指標」(Core Web Vitals)でCLSの評価が「良好」と判定の確認が取れているので、省略します。

「PageSpeed Insights」によるCLSエラー改善の検証

そこで、CLSエラーの状況の確認と同様、「PageSpeed Insights」に問題を指摘されたURL例「https://dan-chan.com/java-update-07/」を入力して、再度、「PageSpeed Insights」でCLS値を検証します。すると、次のような結果が得られました。

「PageSpeed Insights」によるCLS値の確認(「ウェブに関する主な指標」テスト合格時)
「PageSpeed Insights」によるCLS値の確認(「ウェブに関する主な指標」テスト合格時)

「Google Search Console」の「ウェブに関する主な指標」(Core Web Vitals)でのテストの結果は、「Origin Summary」に記述がある通り、下記の条件でCLS値が0.08(0.1以下は「良好」の範囲内)となっています。

「Google Search Console」の「ウェブに関する主な指標」のテスト条件
  • 過去28日間のデータ収集期間
  • すべての配信されたページ
  • 上記条件での集計値と評価判定

備考)「Origin Summary」の速度パラメータの数値表示や統計結果を示すパーセント分布の棒グラフは実際の速度データが十分にある時に表示されます(必ず表示されるわけではない)。

「PageSpeed Insights」によるテスト結果は、「ラボデータ」として表示され、下記の条件でCLS値が0.012(0.1以下は「良好」の範囲内)となっています。

「PageSpeed Insights」のテスト条件
  • 「PageSpeed Insights」のテスト実行時
  • 「PageSpeed Insights」に入力したWebページ(URL)のみ
  • 上記条件で1つの測定値

最後に

「ウェブに関する主な指標」(Core Web Vitals)に合格した経緯と理由

「CLSに関する問題:0.1超」に関して「改善が必要」と通知されて以来、CLSを観察し続けてきましたが、「PageSpeed Insights」で「改善が必要」とされる0.1を超えるようなCLS値は見られませんでした。

一方、「Google Search Console」の「ウェブに関する主な指標」(Core Web Vitals)では、問題が指摘されたURL例のCLS(集計値)が0.25(「不良」の判定基準値)を超えて0.35となっている時もありました。しかし、「Google Adsense」の「最適化」で自動広告の「テスト」が終了した後、CLS値は「良好」とされるレベルである0.1以下に下がっていきました。

このことから、「PageSpeed Insights」と「ウェブに関する主な指標」(Core Web Vitals)でのCLSの評価結果に差異があり、「ウェブに関する主な指標」(Core Web Vitals)でのCLS判定結果は時間経過とともに変わり、「PageSpeed Insights」のCLS値は0.1以下で安定していたので、「Page Speed Insights」の結果を信用して、当サイトではCLS改善のための特別なアクションは起こしませんでした。

結果的に、「ウェブに関する主な指標」(Core Web Vitals)でのCLSの評価が「改善が必要」=>「不良」=>「改善が必要」=> 「良好」と変わっていくのが観測でき、Googleから2度目の「ウェブに関する主な指標」(Core Web Vitals)の合格を得ることができました。「PageSpeed Insights」のCLS結果を信用して、CLS改善のための特別なアクションを無理に起こさず、Google Adsense 自動広告テストが終了するのを辛抱して待ったのが「ウェブに関する主な指標」(Core Web Vitals)に合格した主な理由と考えています。

「ウェブに関する主な指標」(Core Web Vitals)に関する提言

「ウェブに関する主な指標」(Core Web Vitals) の結果が検索順位に2021年5月から影響するとGoogle検索セントラル・ブログで発表されています。

この記事でStatus Change①と②としてご紹介したように2021年2月17日と2021年4月13日に「ウェブに関する主な指標」(Core Web Vitals)に変更が入っており、当サイトがGoogle Adsense自動広告テストの影響を経験したという見地からは「ウェブに関する主な指標」(Core Web Vitals)の評価方法が安定して、信用できるアルゴリズムとして十分に成熟しているかどうかは定かではありません。

もし、あなたのWebサイトでGoogle Adsense自動広告テストを実施していて、「ウェブに関する主な指標」(Core Web Vitals)でのCLSの評価が「良好」と判定されていないのであれば、Google Adsense自動広告テストを一時中断してCLSの状況を観察してみて、当サイトで起こったことが再現するか検証してみるのはいかがでしょうか?

今回、この記事でご紹介したように、Google Adsense自動広告テストがCLS評価判定に影響している可能性があり、今後も状況を検証していく必要があると考えています。

今回ご紹介したような事例があれば、お互いのサイト運営の効率を向上させるために、インターネット上の記事やTwitterのようなSNS(Social Network Service)を通じて情報交換していただけると嬉しく思います。

関連記事「Google Search Consoleのエラー解決法」で、Search Consoleエラー解決法「CLSに関する問題:0.1超(パソコン)」や「LCPの問題:2.5秒超(パソコン)」をはじめとして、当サイトで実践した問題解決法を「Google Search Consoleの解決済みエラーの一覧表」にしてご紹介しています。

それぞれのエラーの具体的な対処法、または、解決法にご興味のある方は、一覧表の下線がついているエラー項目をクリックして、リンクから個別の記事で詳細をご覧になり、あなたのサイトの問題解決にお役立てください。