【SEO】Googleが重視するCore Web Vitals(コアウェブバイタル)とは?【LCP・FID・CLS】

SEOを知りたい人

Core Web Vitalsって最近知ったんだけど、何?

Core Web Vitalsって最近知ったんだけど、何?
SEOとして知っておくべきこと?
LCP・FID・CLS…
英語3文字とか、ワケワカメ…

こんなお悩みを解決します。

✔︎本記事の内容

  • 【SEO】Googleが重視するCore Web Vitals(コアウェブバイタル)とは?【LCP・FID・CLS】
  • Core Web Vitalsの具体的な改善方法

ところで、2021年6月から
Googleはアップデートされました。

それは、「Core Web Vitals」の指標が
検索ランキングに影響されるということ。

Core(重要な)Web(ウェブサイト)Vitals(生きるのに必要な要素)とでもイメージするとわかりやすいかもです。

「Core Web Vitals」というのは一言でいうと
ページエクスペリエンスです。

ページ エクスペリエンスとは、ユーザーがウェブページで操作を行った際の、情報そのものの価値以外に関するエクスペリエンスの尺度となるシグナルのセットです。

つまり
記事の質は除いたユーザー体験の評価ですね。

こちらの画像もご覧ください。

Google検索セントラル

ページエクスペリエンスを構成する要素として
Core Web Vitals以外にも下記の3つがあります。

  • モバイルフレンドリー:グーグルはPCよりスマホ設計を重視している
  • HTTPS:SSL化をおこなっていないと、オワコン(http→https)
  • Noインタースティシャル:煩わしいポップアップ広告などはNG

上記を対策していないと
サイトの評価は落ちます。

なぜなら、読者にストレスだから。
ようは、サイト離脱されやすくなります。

とはいえ、SEOは
「コンテンツ・イズ・キング」の世界です。

コンテンツの質とユーザー体験の両方を
高める必要がありますね。

SEOを理解しないと
Googleに愛されません。

ブロガーやWEB制作者には
必須事項ですよ。

Googleが重視するCore Web Vitalsとは?

Core Web Vitalsは
下記の3つの指標で構成されています。

  • LCP:サイトの読み込み速度
  • FID:サイトの応答性
  • CLS:ページコンテンツの視覚的な安定性

つまり
ユーザー体験をいかに向上できるかです。

記事の質を除いた要素ですので、ご注意を。
順番に解説していきますね。

LCP(Largest Contentful Paint)

出典:web.dev

Largest Contentful Paint (最大視覚コンテンツの表示時間、LCP) は、知覚される読み込み速度を測定するための重要なユーザーを中心とした指標です。これは、LCP がページの読み込みタイムラインにおいてページのメイン コンテンツが読み込まれたと思われる時点を示すためです。LCP を高速にすることで、そのページが便利であることをユーザーに強く印象付けることができるようになります。| web.dev

一言でいうと
メインコンテンツの読み込み速度のこと。

つまり
トップページ画面の読み込み速度ですね。

読み込み時間は、2.5秒以内がベスト。
4秒以上かかると、評価が悪くなります。

実際に、モバイルサイトの読み込みに、3秒以上かかると53%が閲覧を止めて離脱すると言われています。

FID(First Input Delay)

出典:web.dev

First Input Delay (初回入力までの遅延時間、FID) は、読み込みの応答性を測定するための重要なユーザーを中心とした指標です。これは、応答のないページを操作する場合のユーザー体験を数値化したものであり、FID が短ければ短いほど、そのページがユーザーにとって使いやすいものであることが保証されます。 | web.dev

初回入力遅延とのことですが
意味不明ですよね?

わかりやすくいうと、、、
リンクをクリックしたり、文字を入力したりするまでにかかる待機時間のこと。

FID は、読み込み時のページの応答性を測定するための指標です。そのため、個別のアクション (クリック、タップ、キー押下など) による入力イベントにのみ焦点を当てています。| web.dev

画面スクロールやズームなどの初回操作は
FIDの対象外らしいです。

100ミリ秒(0.1秒)以内が合格目安。

CLS(Cumulative Layout Shift)

出典:web.dev

Cumulative Layout Shift (累積レイアウト シフト数、CLS) は、視覚的な安定性を測定するための重要なユーザーを中心とした指標です。これは、ユーザーが予期しないレイアウト シフトに遭遇する頻度の数値化に役立つ指標であり、CLS が低ければ低いほど、そのページが快適であることが保証されます。| web.dev

一言でいうと
レイアウトシフトですね。

ページを読み込んだときなど
たまに起こる現象です。

レイアウトが急にガクッとズレて
誤クリックを誘発してしまう時があります。

それに今自分がどのページにいるのかも
わからなくなってしまいます。

CLPを0.1未満に抑えると
合格圏内です。

Core Web Vitalsの具体的な改善方法

スコア改善に必要なツールと
改善方法をザックリと解説しますね。

LCP・FID・CLSの計測方法を解説

下記のツールを使うと非常に便利です。

  • PageSpeed Insights
  • Lighthouse
  • Google Search Console
  • Web Vitals

全て無料で使えます。
それでは、解説します。

PageSpeed Insights

サイト速度を計測するツール。

使い方はかんたんでして
自分のサイトURLを打ち込むだけ。

LCPとFCPの評価が分かりますね。
LCPは2.5秒以内ですので、僕は合格です。

もう少し詳しく見てみましょう。

グーグルは
スマホのユーザービリティを重視しています。

いくらPCの点数をあげても
無駄なので、スマホの改善につとめましょう。

  • First Contentful Paint:ページ内のいづれかが表示されるまでの時間
  • Speed Index:ページコンテンツがどれだけ早く表示されるか
  • Largest Contentful Paint要改善
  • Time to Interactive:完全にインタラクティブになるまでの時間
  • Total Blocking Time:ブロックされる時間
  • Cumulative Layout Shift合格

基本的に全ての項目で合格が理想ですが
LCPとCLSの評価だけは、SEO的にもあげておくべきですね。

>> PageSpeed Insights

Lighthouse

シークレットモードを開いたら
「検証」機能から使います。

Lughthouseをプルダウンから選択

Generate reportをクリック
なお、モバイルを選択してください

シークレットウィンドから行わないと
余計なロードパフォーマンスも集計されますので、ご注意を。

しばらくすると
こんな画面が出てきます。

たぶん僕のサイトは
そこまで優秀じゃないけど、問題なしですね。

Google Search Console【サチコ】

サチコを使いましょう。

見るべきところは
モバイルの不良URLだけ。

URLのスコアが悪い方がSEO的に問題です。
良好URLは気にしなくてもOK。

不良や改善URLがある場合は
はやく対処しないとマズいですね。

僕は、不良URLも改善URLもゼロ。
SEO的に理想なので、共にゼロを目指しましょう。

>> Google Search Console

Web Vitals

Googleの拡張機能です。
LSP・FID・SLSの3つの指標を確認できます。

使い方は、
インストール後にサイト内で起動するだけ。

PCのみですが
こちらもインストールしておきましょう。

>> Web Vitals

Core Web Vitalsの具体的な改善方法

PageSpeed Insightsで調べると
下記のような改善項目が表示されるかもです。

この項目を改善すればOK。
とはいえ、わりと限界があります。

対策しても
わりとレッドゾーンが表示されるので。

具体的には、下記を実施すればOK。

  • 画像の圧縮
  • CSSやJSの削除/minify化
  • 不要なプラグインの削除
  • GoogleAdSenseの削除
  • ポップアップ広告の削除

基本的にサイトが重くなる原因は
画像かJSか広告です。

画像圧縮・CSS/JS削除・不要なプラグイン削除

こちらはすべて
プラグインで対応可能です。

下記を参考に
プラグインの整理を行なってみてください。

ページスピードが改善するかもです。
とはいえ、過信はNG。

プラグ 【厳選】WordPressに必要なプラグインは7個だけ【初心者ブロガー向け】

GoogleAdSenseの削除

アドセンス広告を貼ると
当然ですが、サイトの読み込み速度は低下します。

特に、自動広告を設定している場合は。

なので、Googleの未来を考えると、、、
アドセンス広告は削除した方が無難かも。

広告の狙いと矛盾してますが
Core Web Vitalsにとってデメリットです。

ポップアップ広告の削除

アドセンス広告でも
ポップアップ広告を表示できます。

ですが、こちらも削除しちゃいましょう。
設定していない方は、そのままでOK。

変な広告がいきなり表示されて
サイト離脱されても困るので。

Googleが目指すWebサイトとは

読者に不快を与えないことです。

ページ離脱を下げることが
広告利益につながるからです。

  • ページがサクッと読み込まれる→遅いとストレスなので、別のサイトに行く
  • うざい広告がない→広告はわりとうざいので、ポップアップ広告はいらない
  • セキュリティ対策がされている→最低限、SSL化しましょう
  • 誤作動がない→CLSを、0にしましょう
  • モバイルファースト→PCよりスマホのユーザービリティーを改善すべし

この辺ですかね。

PCで閲覧する人より
スマホ検索の方が多い時代。

それに人は、待てない生き物です。
サイト設計を見直しましょう。

Googleが掲げる10の事実

第一条を引用します。

1. ユーザーに焦点を絞れば、他のものはみな後からついてくる。

ユーザーファーストじゃないサイトは
Googleに愛されませんね。

たとえば、、、

ページを読み込んだら、ポップアップ広告が
画面にドカンと表示される場合を想像します。

うわっ!なにこの広告...マジでうざいんですけど

ポップアップ広告とか普通はスルーしますし
いちいち消す動作がストレスです。

もう、サイト見るのやめようーって気分になり
別のサイトへ行きますよね。

僕も一時期やっていましたが
「やっぱ不快だよな」と感じ、辞めました。

ユーザーのことを考えた
サイト設計が必要な時代です。

>> Googleが掲げる10の事実

===

というわけで、今回はここまで。

最後に
Core Web Vitalsをおさらいすると、、、

  • LCP:サイトの読み込み速度
  • FID:サイトの応答性
  • CLS:ページコンテンツの視覚的な安定性

上記に加え、

モバイルフレンドリーなサイト設計やSSL化
煩わしいポップアップ広告の削除など

上記はGoogleに愛される条件です。

英語3文字で覚えづらいかもですが
Googleの理念を把握することは重要です。

SEOは常に変化していくので
サイト設計も見直していきましょう。

ふー疲れた。