コアウェブバイタルとは？ユーザー体験の向上を測るガイダンス！【LCP】【FID】【CLS】

企業のウェブメディアを運営しています。ツクルカです。

この記事ではGoogleが提唱している「コアウェブバイタル」について解説をします。

こんな悩みを抱えているウェブ担当者も多いのではないでしょうか？

この記事では、

• コアウェブバイタルって何？
• 3つの指標
• サイト改善の仕方

について、それぞれわかりやすく解説していきます。

ツクルカ

SEO対策としては少し地味目な話ですが、逆に知っていると「SEOに詳しい人」みたいな扱いを受けるので知って損はない知識です。

それでは解説を始めます。

コアウェブバイタルって何？

コアウェブバイタルの説明をする前に、まず「ウェブバイタル」について説明させてください。

ウェブバイタル（Web Vitals）とは、ウェブで優れたユーザー体験（UX）を実現するために、Googleが導入したコンセプトです。

平たくいうと、「ユーザーにとって使いやすいサイトを検索エンジンの上位に表示するよ」という考えをGoogleが持っていると理解しておけば大丈夫です。

そして、このウェブバイタルの中でも特に重要な意味を持つ「3つの指標」を2020年5月28日にGoogleが正式に発表しました。

それが「コアウェブバイタル」です。

3つの重要な指標

コアウェブバイタルには、

• LCP
• FID
• CLS

という、3つの重要な指標があります。

それぞれについて、詳しく解説していきます。

LCP（Largest Contentful Paint）

LCPは、ページの表示速度を測る指標で、ブラウザに表示されている範囲の中で最も大きなコンテンツの読み込みパフォーマンスを測定します。

最も大きなコンテンツとは何なのか？

というと、そのページのメインとなるコンテンツです。

たとえば、

• 画像
• 動画
• 見出し
• 本文

など、ページを構成している要素のうちのどれかです。

最も大きなコンテンツってどれ？

LCPに該当するコンテンツを把握するためには、Chromeの拡張機能「Lighthouse」で判定することができます。

拡張機能を追加し、任意のサイトで拡張機能を使用することでGoogleがLCPとして判断している最も大きなコンテンツを知ることができます。

LCPの改善目安

LCPは最大コンテンツの読み込み時間を測っているため、計測値を秒で表現します。

値が小さいほどユーザーにとって良質な体験を提供していると判定されます。

ステータスは、「良好・改善が必要・低速」の3段階で評価され、以下が評価基準となります

低速であると判定されれば、サイト改善が必要です。

コンテンツに合わせて以下のような改善行いましょう。

LCPの改善ポイント

LCPの改善には、ページ全体の表示速度の向上が必要になります。

そのためには、使用しているサーバーの環境（応答速度の高速化）や画像や動画などのファイルをできるだけ軽くなるように圧縮するなどの対応が必要となってきます。

FID（First input Delay）

FIDは、ユーザーのページ内での最初のアクションに対して、ブラウザの反応にかかった時間です。

ユーザーのアクションとは、

• クリック
• タップ
• テキスト入力

などのことです。

これらのアクションに対する反応速度を計測しており、LCPと同様に反応速度は速いほうが良いとされています。

FIDの改善目安

FIDにもLCPと同様に改善する目安が設定されています。

FIDの改善ポイント

FIDを改善するには、ユーザーを次の行動に移しやすくする必要があります。

そのためにはページのレイアウトやボタンなどのUIのデザイン、JavaScriptの処理の短縮化などの対応が必要となります。

CLS（Cumulative Layout Shift）

CLSは、視覚の安定性を測る指標です。

視覚の安定性とは、操作途中に画像や広告が読み込まれることで本文が下にズレるなどの「予期せぬレイアウトのズレ」のことです。

Googleではこうしたレイアウトのズレをユーザーの体験を損なうと捉えており、独自の「レイアウトシフトスコア」で評価しています。

特に、「誤クリック」を誘うような広告の配置には注意が必要です。

CLSの改善目安

CLSは影響を受けた範囲の広さとその最大移動距離を元にスコアを算出した合計値です。

以下の合計値を目安とします。

CLSの改善ポイント

CLSはページの表示が安定している度合いを改善する必要があるため、レイアウトのズレに配慮する必要があります。

その対応としては、本文を先に表示して画像などの重たいデータを後で表示するようなサイトをよく見かけますが、こうすると本文が表示された後に画像が読み込まれるためレイアウトのズレが発生してしまいます。

このズレを発生させないためには、本文が表示される前に画像や広告サイズをあらかじめ確保して表示しておくなどの対応が必要となります。

3つの指標の測定方法

コアウェブバイタルの3つの指標は、それぞれ以下で測定が可能です。

• Google Search Console（サーチコンソール）
• Page Speed Insight（スピードインサイト）

どちらも無料で使用することが可能なツールですが、サーチコンソールはウェブサイトと連携しておく必要があります。

サーチコンソールでコアウェブバイタルを測定する

サービコンソールには「ウェブに関する主な指標」というメニューがあり、こちらで3つの指標の状態を確認ことができます。

しかし、サーチコンソールで指標を確認するためには、データ量がしきい値を満たす必要があるため、しきい値に満たないサイトのレポートは表示されないのでご注意ください。

スピードインサイトでコアウェブバイタルを測定する

サーチコンソールと同様にGoogleから提供されている「スコアを測定する」ためのツールです。

使用されるデータには、「ラボデータ」と「フィールドデータ」の2つがあります。

それぞれの特徴は、

ラボデータ

シミュレーションする本人のページパフォーマンスの結果をリアルタイムで返す

フィールドデータ

Chromeを使用しているユーザーの統計データをChrome User Experience Report（CrUX）からレポートを出してくれる。

フィールドデータの対象者はChromeを使用しているユーザーであるため、測定値をリアルタイムで測ることができません。

つまり、新規作成したページや更新したばかりのページはデータの蓄積がないため、改善の状況はすぐにはわかりません。

ちなみに、検索エンジンのアルゴリズムに組み込まれているデータは、フィールドデータです。

インターネットの回線環境や使用している端末は人それぞれ異なっているため、ウェブバイタルの指標とするためには統計データを利用する必要があります。

そのため、Googleでは検索エンジンのアルゴリズムにはフィールデータでの計測値を重視しています。

まとめ

少し地味目のSEO対策として、コアウェブバイタルについて解説をしました。

コアウェブバイタルは2020年5月28日にGoogleが提唱したウェブバイタルの3つの指標です。

Googleはモバイル環境でのユーザー体験の向上も指標としています。

そのため、コアウェブバイタルに取り組む際は、PCサイトではなく、モバイルサイトから対策を始めることをおすすめします。