2021年5月に、Google検索のランキング要因として新しく「コアウェブバイタル（Core Web Vitals）」が組み込まれました。
今回は、コアウェブバイタル（Core Web Vitals）を構成する3つの指標と有効なツールについて解説していきます。
また、簡単に指標を改善させる方法も紹介しますので、ぜひ概要を理解してサイトの改善に活用しましょう！
そもそもコアウェブバイタル（Core Web Vitals）とは？
コアウェブバイタル（Core Web Vitals）とは、主にページ読み込み時のユーザビリティに大きく影響する3つのUX指標から成るGoogleの新たな取り組みです。
コンテンツの充実化を図ったり、ユーザーの利便性に配慮したサイト構造にすることで優先的にGoogleに評価される、ということはこれまでも広く知られています。
そこに向けた取り組みを強化されている方は既に多くいらっしゃるかと思いますが、上記の内容を具体的な指標として測ることは難しくサイトの改善点や問題点が分からない、といった状況に陥ることも多々あるのではないでしょうか。
そこでGoogleは、具体的な数値を基にして効率的にサイト改善を図れるよう、具体的な3つの指標をGoogle検索ランキングの要因に導入しました。
3つの指標「LCP」「FID」「CLS」を理解しよう
まず先に結論からいうと、Googleは今回導入した新たな指標に関して、推奨値を定めてはいるものの、この数値をクリアすれば良い、というような基準の発表をしていません。
なぜなら、サイトのコンバージョン率や離脱率が改善されるかどうかはサイトの種類・ユーザーの属性によって大きく変わるためです。
数値に固執しすぎず、あくまでもユーザビリティを向上させるひとつの目標である、ということを念頭に施策を進めましょう。
LCP
LCPとは、「Largest Contentful Paint」の略で、メインコンテンツの読み込み速度に関する指標です。
これまで通りページの読み込み速度がSEOの評価基準に影響を及ぼすことに変わりはありませんが、LCPはページの中でも特に重要なメインコンテンツの読み込み速度の指標になります。
メインコンテンツの例としては、サイトのファーストビューにあたるメインビジュアルやテキストブロックが挙げられます。
指標の目安としては、ページの読み込み開始からコンテンツの表示までが2.5秒未満であれば「良好」と評価されます。
もしメインコンテンツの表示時間がそれ以上かかってしまうようであれば、LCPに関しては改善の余地がある、といえるでしょう。
改善方法
LCPの数値は、リソースの読み込みやサーバーの応答、ファイルのレンダリングブロックによって変動します。
そのため、ファイルサイズ等を軽くする必要があります。
LCPの改善には以下の方法が挙げられます。
- 画像を圧縮・最適化し、不要な画像は削除
- キャッシュの活用
- コード内のスペースやコメントを削除してJavaScriptやCSSファイルを最適化
- 初期の読み込みに不要なソースは非同期での読み込み
- サーバーを最適化
ページスピードインサイトによるWEBページの表示速度改善について
エンドユーザーにより快適にWEBサイトを閲覧、利用していただくことを目的としたWEBページ表示速度の改善施策をご紹介いたします。
FID
FIDとは「First Input Delay」の略で、サイトを訪れたユーザーが最初に行う操作に対する反応にかかる時間を示します。
ユーザーがサイトを訪れると、ブラウザがHTMLファイルのリソースを順次読み込み・処理していきますが、そこで時間のかかる処理（JavaScriptなど）が発生すると、後続の処理が遅れサイトの反応速度に影響が出てしまいます。
ユーザビリティを考えると、サイト上ではスムーズなレスポンスを求められるため、なるべく処理に時間をかけないような施策が必要です。
ユーザーがアクション（クリック等）を起こしてから100ミリ秒未満であれば「良好」である、と判断されます。
改善方法
FIDを低下させる主な要因は、JavaScriptの実行によるものです。
JavaScriptの処理に時間がかかってしまうと、その間ブラウザはユーザーの操作に応答できない状態になることも。
少しでも負担を減らす対策を講じる必要があります。
FIDの改善には以下の方法が挙げられます。
- JavaScriptの量を減らす
- Webワーカーを使用して、バックランドスレッドでJavaScriptを実行する
CLS
CLSとは「Cumulative Layout Shift」の略で、コンテンツが視覚的にどのくらい安定しているか、を示す指標です。
表示されるページコンテンツに起こる、予期しないレイアウト崩れを測定し数値化しています。
サイトを開いた際に、ファイルの重さが原因で画像やバナーが遅れて表示される、といったことはしばしば起こります。
遅れて表示される分、コンテンツの位置がずれてしまう可能性がありますが、そのズレの幅を計測した指標になるのがCLSです。ズレが大きいと、ユーザーの意図しない操作を誘発してしまい、非常に使い勝手の悪いサイトになる恐れがあるため気をつけましょう。
CLSは、viewport内での【表記崩れの影響を受けた面積】×【ズレにより移動した距離】によって算出され、0.1未満が「良好」と判断されます。
先述のLCPやFIDとは違い、数値の単位はないので注意しましょう。
改善方法
予期しないレイアウトのズレは、画像にサイズの指定がされていない場合に起こります。
ユーザーにとってストレスの溜まるサイトになってしまう前に対策を練りましょう。
CLSの改善には以下の方法が挙げられます。
- 画像サイズを指定する
- 広告表示領域をあらかじめ定めておく
- Webフォントのレンダリングサイクルを最適化
コアウェブバイタル（Core Web Vitals）に関するツール
では、サイトの「LCP」「FID」「CLS」はどうやって確認するのでしょうか。
実は、コアウェブバイタル（Core Web Vitals）の指標はツールを使うことで簡単に計測することができます。
ここでは主要な計測ツールを紹介します。
PageSpeed Insights
ページの読み込み速度を測る際に最もよく使われているツールです。サイトを運用している方なら、おなじみの方も多いのではないでしょうか。
使い方はとてもシンプルで、調べたいページのURLを入力するだけで読み込み速度をスコア化して表示してくれます。
Lighthouse
Lighthouseは、Chromeウェブストアから拡張機能として追加することで無料で使用できます。
コアウェブバイタル（Core Web Vitals）の3つの指標を評価するだけではなく、さらに細かなチェック項目を設けているため、よりサイトの改善点を把握するのに役立ちます。
留意点としては、オフラインでの計測になるため実験的なラボデータでの評価しか得られないことです。
Web Vitals
Chrome拡張機能であるWeb Vitalsを利用すれば、各指標へのフィードバックを瞬時に測定することが可能です。
もちろんJavascriptコードの記述は必要ありません。
また、Chromeに追加するだけで閲覧しているページの状況を自動で計測してくれます。
他にもChromeのデベロッパーツールやSearch Consoleを使用した計測も可能です。 いろいろ試してみて、ご自身に合った使いやすいツールを探しましょう。
SEOのランキング要因にどのくらい影響するのか
近年Googleは、ページ読み込み速度やモバイルフレンドリーであるかどうか等を検索ランキングの要因に組み込んでいます。
このようなUX指標の中に、新しく今回紹介したコアウェブバイタル（Core Web Vitals）が追加されたということです。
現在、UX指標は検索ランキング要因の中でもマイナーな指標であるため、コアウェブバイタル（Core Web Vitals）についてもランキング要因に大きく影響を及ぼす可能性は低いと考えられています。
しかし、それはあくまでも現在の話です。Googleの指標はこれからもアップデートを行い、その中でサイトの評価基準が変わる可能性は大いに考えられます。
サイトをよくしていくため、常にアンテナを張りしっかり対応できる準備をしておく必要があるでしょう。
おわりに
2021年5月から導入されたコアウェブバイタル（Core Web Vitals）は、SEOの観点だけではなくサイトの利便性そのものに関わる指標です。
大切なのは、本質的にユーザーのためになるコンテンツ制作に務めることです。
ユーザーの満足度が高く、使いやすいサイトであるということはどのサイトにも共通して必要な考え方ですので、今回紹介した指標やツールをどんどん活用してサイトの改善に取り組んでいきましょう！
さて、Wordpressが、今年の7月にリリースされる次のバージョンにおいてIE11のサポートを終了することを発表しました。これまでIEの対応に悩まされてきた方も多いのではないでしょうか。
そこで！次回はIEのサポート終了に伴ってようやく使用できるようになる、おすすめのCSSについて解説していきたいと思います。
7月31日の更新を予定していますので、ぜひご覧ください。
コアウェブバイタル（Core Web Vitals）国内結果報告
コアウェブバイタル（CWV)の検索順位への影響に関する独自調査の結果をどーんと大公開させていただきます。必見の国内SEO調査データ！です。
