Core Web VitalsがSEO要因へ！まずはUXパフォーマンスを測定しよう（LCP・FID・CLSの3要素）
Core Web Vitals（コアウェブバイタル）とは、WEBのユーザー体験（ユーザーエクスペリエンス：UX）向上を目指すGoogleの取り組み指標です。
現時点での主要なコアウェブバイタル要素は、LCP（読み込み）FID（対話性）CLS（視覚的安定性）の3つに焦点を当てています。
コアウェブバイタルがSEOランキング要素に組み込まれる発表がされたため、検索順位に影響を及ぼす事になります。
焦らずにまずは自身のWEBサイトのユーザー体験におけるパフォーマンス数値を各種ツールを使って計測しましょう。
Core Web VitalsがSEOランキング要素に影響
WEBにおけるユーザー体験の向上を目的とした取り組みをGoogleが始めました。
Googleはこれを「Web Vitals（ウェブバイタル）」を呼んでいます。
「バイタル」とは「重要なもの・本質的なもの」という意味ですね。
3つの指標からなる「コアウェブバイタル」がSEOの要素へ
ウェブバイタルは「WEBに対するユーザー体験を良くするために必須となる総合的なアドバイス」です。
そのウェブバイタルの中でも特に重要なものとして、本記事で説明する3つの指標を「Core Web Vitals（コアウェブバイタル）」として設定しています。
このCore Web Vitalsにおいて高い数値を達成できているかどうかが、今後のSEO順位を大きく左右する可能性があります。
Web Vitals（ウェブバイタル）とは
もともとWeb Vitals（ウェブバイタル）とは、WEB上で優れたユーザー体験（ユーザーエクスペリエンス以下：UX）を提供するために不可欠な、「高品質な通信」に関する要素の事です。
Googleは以前からこのガイダンスの提供・取り組みをおこなっていました。
Googleはそのために、WEBのパフォーマンスを測定・報告するためのツールを数多く提供してきました。
開発者がパフォーマンス部門まで追いつかない
確かに最高のユーザー体験をたたき出すWEBサイトを作れればそれが理想ですよね。
実際に一部の開発者はこれらのツール使用に精通していましたが、それ以外の大部分がこのツールを常に使いこなす事が難しい状態にありました。
サイトの所有者は運営・制作には特化していても、提供するUXの品質を理解・向上させるパフォーマンスの専門家ではないのですね。
要素を簡素化してそこに集約させる
そこでGoogleはこの状況を打破すべく、簡素化した統一ガイダンスの構築へと動きます。
ウェブバイタルの中でも最も重要な指標となる「Core Web Vitals」を設定し、この主要な指標に集中してもらう事を目的としているのです。
今まで数多くあった要素をスリムにしSEOにも影響を及ぼす事で、これまで以上にパフォーマンスに着目して欲しいという意図でしょう。
Core Web Vitals（コアウェブバイタル）とは
Core Web Vitalsは、全てのWEBページに適用される「Web Vitals」の中での根幹となる主要要素とされています。
全てのサイト所有者が測定するべきとしているので、Googleのほぼ全てのツールで表示されています。
Core Web Vitalsは、UXのそれぞれ異なる側面を表しており、現場で測定が可能でありつつ、ユーザー中心の実際の重要な体験結果を反映しています。
コアウェブバイタルを構成する各要素
コアウェブバイタルを構成する各要素は時代と共に進化・変化します。
現在2020年における設定は、3つの側面（読み込み、対話性、視覚的安定性）に焦点を当てており、次の要素（及びそれぞれのしきい値）が含まれています。
各要素の指標数値
最大のContentful Paint（LCP）：読込時間測定
ブラウザの表示範囲内で、最も大きなコンテンツが表示されるまでの時間です。
優れたUXを提供するには、ページが最初にロードを開始してから 2.5秒以内にLCPが発生する必要があります。
この値が小さければ小さいほどUXが高い事になりますね。
Contentful Paintとは
初期表示されるメインの画像・動画・背景画像のある要素、テキストを含むブロックレベル要素など、そのページでメインコンテンツとなる部分です。
最初の入力遅延（FID）：対話性測定
ユーザーが最初にページ内でクリック・タップ・テキスト入力などの操作を行った際、ブラウザがその操作へ反応するのに掛かった時間を表します。
優れたUXを提供するには、このページのFIDが100ミリ秒未満である必要があります。
この値が小さければ小さいほど反応速度が速く、UXが高い事になります。
累積レイアウトシフト（CLS）：視覚的安定性を測定します。
ユーザーが意図せぬレイアウトのずれがどれぐらい発生したかを、独自のスコアで表します。
優れたUXを提供するには、ページのCLSを0.1未満に維持する必要があり ます。
例えばこんな時がCLSによるズレです。
みなさんこんな経験ありませんか？
・ページが表示された時にはなかった画像が後から表示され、読もうとしていた文面が下に移動した
・リンクをタップしようとした瞬間に広告が表示され、誤ってその広告を押してしまった
上記の各指標について推奨される目標が、ほとんどのユーザーが確実に達成できる事が推奨されています。
※測定に適したしきい値は、モバイルとデスクトップでセグメント化されたページ読込の75％とされています。
Core Web Vitalsへどう対応するか
ウェブバイタルはGoogleが始めた取り組みですが、WEBの品質を維持するスタンダードな指標として浸透していく様です。
SEO（検索エンジン上位表示最適化）のアルゴリズムとして新しく導入される事が決定しています。
Google製のツールとしては、以下が計測データをサポートしています。
Googleのコアウェブバイタル計測ツール
・Search Console
・PageSpeed Insights
・Chrome ユーザーエクスペリエンス レポート
・Chrome 拡張機能
・Chrome デベロッパーツール
・Lighthouse
Google以外の様々なベンダーも、提供しているパフォーマンス改善ツールでコアウェブバイタルの計測ができる様にサポートし始めています。
まずはパフォーマンス計測、これが全て
Googleは豊富なツールを用意してサイトのパフォーマンスを測る環境を整備しています。
まずは現在の自分のWEBサイトのパフォーマンスが数値的にどうなのか、それにより与えるユーザーへの体験が十分なものかを調べる必要があります。
課題をどのように改善していくのかについては、コアウェブバイタルが浸透して来た頃にまた別の記事でご紹介したいと思います。
Core Web Vitalsの測定ツール
Googleはコアウェブバイタルが、全てのWEBコンテンツのエクスペリエンスに不可欠であると考えています。
ですのでGoogleが提供する全てのツールで、これらの指標を浮き彫りにする事に注力しています。
ではこの指標をリアルタイムに測定表示する各種ツールをご紹介しましょう。
Google search console
まず私達が利用すべきは「Google Search Console」でしょう。手慣れてもいますしね。
「ウェブに関する主な指標」レポートがSearch Consoleで利用できるようになっています。
本記事上部で紹介したLCP・FID・CLSの3指標に関して「良好」「改善が必要」「不良」の3段階で判定してくれています。
ここで「不良」と判定されたページに対しては、早急に対応したいものですね。
判定基準
判定基準は次のように定められています。
| ツール | 良好 | 改善が必要 | 不良 | LCP | 2.5秒未満 | 4秒以下 | 4秒を超える |
|---|---|---|---|
| FID | 100ミリ秒未満 | 300ミリ秒以下 | 300ミリ秒を超える |
| CLS | 0.1未満 | 0.25以下 | 0.25を超える |
PageSpeed Insights
個別のページを測定したい時はPageSpeed Insightsが便利です。
使い方は今までと変わらないのですが、レポート対象の指標が「LCP・FID・CLS」に置き換わっています。
PageSpeed Insightsはフィールドデータとラボデータの両方を計測できる点でも便利です。
フィールドデータ
フィールドデータとは、WEBサーバー上で実際のユーザーがそのページにアクセスした状態に基づいているリアルデータです。
ラボデータ
それに対しラボデータは、先述した実験的なシミュレーションした結果です。
フィールドデータは一定のアクセス数がたまらないとデータが出ないので、改善してもすぐに結果には現れません。
それ対してラボデータは実験なので、修正すればすぐに結果が判明する点でメリットがあります。
Chromeユーザーエクスペリエンスレポート
「Chromeユーザーエクスペリエンスレポート」は、 Core Web Vitalsのため匿名で実際のユーザーの測定データを収集するフィールドツールです。
このデータを使用するとサイト所有者は、手動で行う事なく実際の現場パフォーマンスをすばやく診断できます。
WEBページビュー単位は測定できない
Chromeユーザーエクスペリエンスレポートによって提供されるデータは、WEBサイトの実質パフォーマンスを迅速に評価できます。
しかし正確な診断に監視にしばし必要となるページビューごとの詳細なデータは提供しません。
そのためWEBサイト上で独自にリアルユーザーの監視を設定することも強くお勧めします。
JavaScriptでCore Web Vitalsを測定する
ページビュー毎の監視をする手段の一つとして、JavaScript標準のWeb APIを使用してCore Web Vitalsの測定ができます。
全てのCore Web Vitalsを測定する最も簡単な方法は、「Web-vitals JavaScriptライブラリ」を使用することです。
これは基になるWeb APIの小さな本番対応環境を使用して、レポート報告方法と同一の方法で各要素を測定します。
Chrome拡張機能
「Chrome拡張機能」を使用すれば、javascriptコードを記述せずに各コアウェブバイタルレポートを確認する事ができます。
この拡張機能は、web-vitalsライブラリと同様に各指標を測定し、WEB上でそれらを表示します。
この拡張機能は、自分のサイト、競合他社のサイト、およびWeb全体のパフォーマンスを理解するのに役立ちます。
Chrome ディベロッパーツール・Lighthouse
コアウェブバイタルは何よりもまずはWEBサーバー上つまり現場フィールドでの測定がメインですが、その前に実験的に測定する事ができます。
これが「ラボデータ」、つまりシミュレーション計測です。
上記ツールはラボデータとして、機能がユーザーにリリースされる前に開発中に機能のパフォーマンスをテストする事ができます。
同時にパフォーマンスの低下が発生する前にそれを発見・修正するための手段としても使えます。
ラボデータツールで測定できる要素
| ツール | LCP | FID | CLS | Chrome ディベロッパーツール | 〇 | ×（代わりにTBTを使用） | 〇 |
|---|---|---|---|
| Lighthouse | 〇 | ×（代わりにTBTを使用） | 〇 |
Lighthouseのように、ユーザーなしでシミュレーション環境でページをロードするツールでは、FIDを測定できません。
ただし、合計ブロッキング時間（TBT）要素はラボで測定可能であり、FIDの優れた補足要素です。
ラボでTBTを改善してパフォーマンスを最適化すれば、そのシミュレーションを元に現場でもFIDが改善されるはずです。
ラボ測定のデメリット
ラボ測定は優れたエクスペリエンスを提供するための重要な部分ですが、サーバー上の測定に代わるものではありません。
WEBサイトのパフォーマンスは以下の現場環境により劇的に異なるためです。
・ユーザーのデバイスの機能
・ネットワークの状態
・デバイスで実行されている可能性のある他のプロセス
・ページとの対話方法
実際にコアウェブバイタルの各指標は、ユーザーの操作によってスコアが影響を受ける可能性があります。
やはり完全な状態を正確に測定できるのは現場による測定だけと言えます。
その他たくさんの「Web Vitals」が存在
コアウェブバイタルは、優れたUXを理解して提供するための重要な指標ですが、それ以外にも様々な指標があります。
これらの他のWeb Vitalは、多くの場合コアウェブバイタルを補足する要素として機能します。
場合によってはエクスペリエンスの大部分を測定できたり、特定の問題の診断に役立ちます。
Core Web Vitalsを支えるWeb Vital群
最初のバイトまでの時間（TTFB）
最初のコンテンツフルペイント（FCP）
上記はどちらもロードエクスペリエンスを支える重要な要素であり、両方ともLCPの問題の診断に役立ちます。
Total Blocking Time（TBT）
Time to Interactive（TTI）
上記はFIDに影響を与える可能性のある、潜在的なインタラクティブ性の問題を把握して診断するために不可欠な要素です。
ただし上記の要素は現場で測定ができないため、ユーザー中心の本来の結果を反映した事にはなりません。
ですのであくまで補足要素であり、コアウェブバイタルの正式な要素には採用されていません。
その他のWeb Vitals
・FMP（First Meaningful Paint）
・SI（Speed Index）
・TTI（Time to Interactive）
・TBT（Total Blocking Time）
etc
変化するWeb Vitalsの要素
Web VitalsとCore Web Vitalsは、開発者がWEB全体のエクスペリエンスの品質を測定するためのデータ指標です。
しかしこれらの指標は完全なものではなく、将来的には追加や改善がされる可能性もあります。
コアウェブバイタル要素は頻繁には変更されない
開発者はコアウェブバイタルの定義やしきい値が「常に正しい事」を前提として動いています。
これらの指標が仮に変更されるとなれば、実際にWEBの広範囲に影響を及ぼしますよね。
なので仮にその更新がされる時には、事前の通知と対応可能な十分な期間を与える必要があるのです。
その意味では頻繁に変更される事はないと言えるでしょう。
ウェブバイタルは頻繁に変更される可能性がある
それに対し他のWeb Vitalsの項目は、その多くがコンテキストやツールに固有の要素である場合が多いです。
その意味でコアウェブバイタルよりも実験的な要素の場合があります。
そのためそれらの定義としきい値は、頻繁に変更される可能性があります。
まとめ：コアウェブバイタルがSEOのランキング要因に
Googleはこの「コアウェブバイタル」を検索ランキング要因に組み入れる事を発表しました。
Googleは既に、WEBページにおけるUX（ユーザー体験）の要素をSEOランキング要因として検索アルゴリズムに組み込んでいます。
具体的には次のような項目があります。
Googleの現在のSEOランキング要素
・モバイル フレンドリー
・セーフ ブラウジング
・HTTPS
・コンテンツへのアクセスを阻害する障壁が無い
・（コアウェブバイタル）
そしてここに今回のコアウェブバイタルが加わる事になりますが、今すぐではなく2021年以降を予定しているそうです。
そして導入の少なくとも6か月前には、具体的な日程が告知されるとの事でした。
決してSEOを焦らないで
ランキング要因のアップデートが実施されると聞けば、SEO担当者にとっては一大事です。人によっては焦りや不安を感じる事でしょう。
これまで積み重ねてきた努力がまた水泡に帰すのではと懸念されますよね。
ですが少なくとも現時点では、検索エンジンのためだけに何か特別な対応をする必要はありません。
アップデートが近くなれば課題に対応するため利用できる具体的なツールやドキュメントの案内をGoogleが提供する予定にしているからです。
「パフォーマンスを向上させたい」前から気になっていませんでしたか？
もちろん既に提供されているツールやドキュメントを利用して、今からパフォーマンス改善に取り組めるのであればそれに越したことはありませんよね。
あなたが以前からパフォーマンスの面で「改善したいな…」と思っていた部分は、WEBを見ているユーザーもそうして欲しいと思っているからです。
例えばページがもっと早く表示出来たらユーザーも驚くだろうな…って前から思っていた人は、トライするチャンスと言えます。
まだ明確になっていない面も多い
今回のコアウェブバイタルの件に関してはまだ詳細が明確になっていないので、焦る事はありません。
まずは、コアウェブバイタルの3指標が意味することをしっかり理解してからで遅くはないと思います。
自分のWEBサイトがユーザーにどんな閲覧体験を提供しているのかを、データで把握する事から始めましょう。
