近年注目されるGoogleのコアウェブバイタル（Core Web Vitals）ですが、具体的にどのような指標があり、求められるポイントは何なのか、気になる方は多いのではないでしょうか。
本記事では、Googleにおけるコアウェブバイタルの概要や計測方法、また改善・対策方法について詳しく解説していきます。
目次
コアウェブバイタルとは
「コアウェブバイタル（Core Web Vitals）」とは、2020年にGoogleが発表した「UX（User Experience）指標」です。
3つの指標があり、いずれもWebページにアクセスした際に、ページ画面が表示されるまでの速度に関連した指標です。
当初2021年5月に、Googleの検索エンジンにおける評価に組み込まれることが予定されていましたが、Google検索セントラルブログで、6月半ばから徐々に導入すると発表しました。
コアウェブバイタルの対象はモバイル検索（スマートフォン検索）で、PCでの検索は対象外となります。
よりよい検索体験を提供したいGoogleとして、コアウェブバイタルはユーザーが快適にWebページを閲覧するうえで重要なポイントです。Webページの運営者としてはコンテンツの内容そのものはもちろん、実装方法の工夫などにより、ページを読み込む時間を短縮することが求められます。
コアウェブバイタルの構成要素
コアウェブバイタルを構成する要素をそれぞれ解説します。3つの指標がありますが、それぞれWebページの読み込みに関する内容です。
①LCP
「LCP(Largest Contentful Paint)」はそのページの中で、重要な役割を担うコンテンツが読み込まれるまでの待機する時間を指します。
ここでの主要なコンテンツとは、動画や画像などが対象です。文字中心のコンテンツの場合は、見出しが重要な役割を果たすといわれています。
重要とみなされるコンテンツはページの性質によって異なりますが、ユーザー体験をよりよくするうえで、どれが重要になるかがポイントになるでしょう。優れたユーザー体験を提供するという観点で、LCPが短いほど高い評価を得られます。
②FID
「FID(First Input Delay)」は、ユーザーがそのページにおいてクリックやキーの押下、マウスの押下やタッチ操作などの行動を起こせる状態になるまでの待機する時間を指します。
また、ユーザーがページの中で初めて何らかのアクションを取り、そのアクションの結果が反映されるまでの時間ともいえます。FIDも短いほど検索エンジンから高く評価されます。
Webページ全体としては膨大なコンテンツがあっても、ユーザーがアクションを行える状態になる時間を短縮することで、ストレスなく閲覧できます。
③CLS
「CLS(Cumulative Layout Shift)」は、ページの目に見える安定性をはかる指標です。
この安定性が低いと、ユーザーが意図しないアクションが発生する恐れがあります。ページの読み込み状況に応じて起こる、予期せぬレイアウトのずれによるユーザー体験の低下を防ぐ目的で設定されています。
ユーザーのアクションが意図しない結果につながらないようにするCLSは、読み込み時にページの中で影響された面積と、移動した距離の2つの要素から算出され、値が低いほど検索エンジンから評価されます。
コアウェブバイタルの計測方法
コアウェブバイタルの計測方法を解説します。
Googleでは、LCP・FID・CLSを測定するためのツールを複数提供しています。具体的には、「Lighthouse」「PageSpeed Insights」「Google Search Console」があります。
Lighthouseは、サイトのアクセシビリティやパフォーマンス、SEOといったユーザー体験に結びつく要素をスコア化し、Webサイトの改善につながる施策を提示してくれます。
（出典元：Google Chrome ）
PageSpeed InsightsはモバイルやPCのページ表示速度を最適化してくれるツールで、ページの改善施策やパフォーマンスを確認できます。
（出典元：PageSpeed Insights ）
Google Search Consoleは検索順位や検索トラフィックの状況を確認できるツールですが、それに併せてコアウェブバイタルに関する指標も確認できるようになっています。
（ 出典元：Search Console ）
コアウェブバイタルの改善・対策方法
コアウェブバイタルの対策や改善を行う方法をそれぞれ解説します。
LCPの改善・対策方法
ページの中の重要な役割を担うコンテンツが読み込まれるまでの速度であるLCPを向上するうえで、原因と対策としては4つあります。
まずLCPが低くなる要因として、Webページをサーバー応答時間が遅い場合があります。
サーバー応答時間は、Webサイトにアクセスするユーザーの近くのCDN（コンテンツ配信ネットワーク）にルーティングすることで短縮できます。また、ページの実装における工夫などでLCPを改善することも可能です。
「JavaScript」や「CSS」がレンダリングをブロックしている場合もあるため、あまりメインコンテンツとは関係のないJavaScriptやCSSをメインコンテンツよりも後に置くことや、ブロック時間の削減によりLCPを短縮できます。
Webページの中の画像ファイルやテキストファイルが重く、読み込む時間が長くなる場合もあります。画像の最適化や圧縮、テキストファイルの圧縮により、リソースを読み込む時間の削減が可能です。
クライアント側のレンダリング処理が重いと、LCPが高くなります。サーバー側でレンダリングを行ったり、JavaScriptを最小限に抑えたりすることで、LCPの改善が見込めます。
FIDの改善・対策方法
FIDが低下する主な要因は、JavaScriptの処理が大量に行われることです。
JavaScriptのコードが動いている間は、ユーザーがブラウザ上でアクションを行っても応答できません。しかし、JavaScriptの量に制限をかけたり、JavaScriptによる処理を分割したりすることで、JavaScriptが行われる時間が短縮し、結果的にFIDの改善につながります。
CLSの改善・対策方法
CLSが低下する主な要因としては、サイズ指定がない画像が動的に挿入され、サイズなどが変動するコンテンツがあることや、Webフォントの読み込みなどが該当します。
ページの中で画像を表示する際は、常に「width」や「height」を指定して横幅や高さを定めたり、広告や画像が表示されるエリアをしっかりと定めたりすることで、CLSの改善が可能です。
マーケティングにおける集客を支える要素の1つであるSEOにおいて、コアウェブバイタルの重要性が高まっています。Googleが近年重視している重要指標であり、これに準拠したWebサイトはSEOの効果が抜群です。
まとめ
コアウェブバイタルを構成する要素は、LCP・FID・CLSの3つがあります。それぞれWebページの実装方法の工夫などにより、数値を上昇させられます。
コアウェブバイタルを改善し、よりよいユーザー体験を提供することを通じて、マーケティングの成果を高めましょう。
