コアウェブバイタルの対策・改善方法とは？現状の確認方法も解説

今までGoogleはさまざまなアップデートを行ってきました。その中でも2021年6月から同年8月まで段階的にリリースされた「Core Web Vitals（コアウェブバイタル）」は、検索結果にも大きな影響を与えており、SEOの観点からも優先的に対策すべきものとなっています。

しかし、実際にどのような対策や改善をすればいいのか、わからなくなっている方も多いのではないでしょうか。そこで今回は、コアウェブバイタルの概要から具体的にどのような対策・改善を行えば良いかを解説します。

1.　コアウェブバイタルとは

コアウェブバイタルとは、LCP・FID・CLSという3つの指標をもとに、Webサイトやコンテンツがユーザーにとって使いやすいものになっているかどうかを、数値化して判断する取り組みを指します。

Googleは、もともと「ユーザーの利便性を第一に考えている」と公言していることから、常にユーザーに使いやすくなるコンテンツを推奨してきました。そんなGoogleが2021年6月から新たに導入した指標が、「Core Web Vitals（コアウェブバイタル）」です。

コアウェブバイタルで測定される3つの指標は以下のような意味と目標数値があります。

コアウェブバイタルの対策を行う場合は、上記に示した目標数値をクリアできるような施策を行っていくことが重要です。

2.　コアウェブバイタル対策の重要性

コアウェブバイタルにおける3つの指標は、いずれもユーザーがWebサイトやコンテンツを閲覧する際に、ストレスなく快適に利用できることが、重視されています。

そのため、自社のWebサイトやコンテンツを検索結果で上位に表示させるためには、ユーザー目線を意識した内容だけでなく、ユーザーが自社のWebサイトを訪問したときに「使いやすい」と感じられるような工夫が必要です。

さらにコアウェブバイタルを対策することは、効果的なSEO対策にもなるため、自社サイトの上位表示を狙うには最重要事項といっても過言ではないでしょう。

3.　コアウェブバイタル対策をするなら、まずは現状の確認が必要

実際にコアウェブバイタル対策をするためには、自社のWebサイトやコンテンツがどのような状態なのかを把握しておく必要があります。

具体的な手順としては、Google Search Consoleで現状を把握し、PegeSpeed Insightsでより詳細な改善情報を得るという流れです。

それでは、それぞれの手順について具体的に解説していきます。

Google Search Consoleで大まかな現状を把握する

Google Search Consoleで、自社サイトやコンテンツの現状を確認する手順は以下のとおりです。

手順

Google Search Consoleを開き「ウェブに関する主な指標」をクリック

「レポートを開く」をクリック

「レポートを開く」をクリックすると、詳細というボックス内に、「不良」また「改善が必要」などのステータスが表示されます。ステータスの隣には、コアウェブバイタルの指標であるLCP・FID・CLSのうち、どの部分に問題があるかも表示されるため、何を改善するべきなのかが明確になります。

ただし、Google Search Consoleによる改善点の把握は、Webサイト全体の分析しかできません。そのため、ページごとの問題点を解決するためには、以下で解説するPegeSpeed Insightsが必要です。

PageSpeed Insightsで詳細な改善ポイントを知る

次はPegeSpeed Insightsで、改善が必要なページの詳細な問題点を確認します。

PegeSpeed Insightsにアクセスしたら、改善が必要なページのURLを入力して「分析」ボタンをクリックしましょう。分析が終了すると、入力したページにおけるパフォーマンスが0〜100で数値化され、LCP・FID・CLSを含む6つの指標がどのような状況になっているのか、確認できます。

また、「改善できる項目」という部分もあり、改善が必要なページで具体的にどのような改善をするべきなのかが把握できます。コアウェブバイタル対策におけるLCP・FID・CLSの対策および改善方法は、以下で詳しく解説していきましょう。

4.　コアウェブバイタル「LCP」の対策・改善方法

LCPは、Webサイトやコンテンツにおけるページの読み込みスピードを表した指標です。Googleは、ページの読み込み速度とユーザーの離脱率について以下のような調査結果を発表しています。

上記の画像は、ページの読み込み時間が1秒から3秒かかると32％のユーザーが離脱し、さらに読み込み時間が増えるたびに離脱率が高くなるという内容です。

例えば、あるWebページを訪問したときにページが表示されるまでに何秒も待たされた場合、検索画面に戻ってしまう方が多いです。つまりページの読み込み速度は、ユーザーの滞在時間を長くするために、コンテンツの内容以上に重視すべきポイントといえます。

ページの読み込み速度を改善させるためには、以下の2つの対策が効果的です。

画像を軽量化する

Webページを読み込むときには、ダウンロードされるデータ量の大半を画像が占めているといわれています。そのため、できるだけ速くWebページを読み込ませるためには、画像のデータ量を可能な限り軽量化しておく必要があります。

Webページに載せたい画像のデータ量が大きいときには、画像圧縮ツールなどを利用して最適化しておくと良いでしょう。

適切な画像フォーマットを利用する

画像の読み込みを速くさせるためには、画像を軽量化するだけでなく、適切なフォーマットを使うことも大切です。例えば、Googleが推奨している画像フォーマットには、PNGとJPEGがあります。

PNGは画像の品質を保ったまま圧縮でき、JPEGは画像の解像度が少し下がる可能性があるものの、PNG以上にデータ量を圧縮できるフォーマットです。

最近では、WebPというPNGやJPEGよりもさらに圧縮できる画像フォーマットが開発されました。LCP対策で改善を図るのであれば、WebPの採用も視野に入れておくと良いでしょう。

5.　コアウェブバイタル「FID」の対策・改善方法

FIDは、ユーザーがページを操作したときの応答性を測定します。つまり、ユーザーが自社サイト内でボタンをクリックしたり、テキストを入力したりしたときに、サイト内に操作が反映されるまでのスピードを計測しています。

FID対策では、WebページにおけるJavascriptやCSSという動的部分の最適化が重要です。ただし、このあたりから専門知識が必要となる箇所が増えてきます。

具体的なFID対策と改善方法は、以下の2つです。

不要なJavascript・CSSを削除する

JavascriptやCSSなどのファイルは、ページを読み込む以外にもさまざまな部分で常に動作していることがあります。そのため、JavascriptやCSSの動作が不要なページについては、JavascriptやCSSを読み込まないように削除しておきましょう。

これらの作業は、PHPという言語を用いて編集する必要があるため、自社に編集技術がない場合は、専門の業者に依頼したほうが良いでしょう。

必要なJavascriptを最小化する

前述した不要なJavascript・CSSを削除する一方で、必要なJavascriptやCSSを最小化することも大切です。

ブラウザは記載されたソースコードをそのまま読み込むため、ソースコードが最小化されていればその分読み込みは速くなります。つまり、読み込むJavascriptやCSSファイルのソースコードが短ければ短いほど、読み込み時間を短縮できます。

ただし、これらの作業を行うにはJavascriptやCSSに関する正しい知識が必須です。そのため、編集技術が自社にない場合は、専門の業者などに依頼する必要があります。

専門業者に依頼する場合は、業者選びが重要です。外注先支援事業を15年以上行っているリカイゼンでは、要望に応じて企業紹介を行います。まずはお気軽にご相談ください。

6.　コアウェブバイタル「CLS」の対策・改善方法

CLSは、ユーザーが閲覧しているWebページのレイアウトの安定性に関する指標です。とくにユーザーはさまざまな端末からアクセスするため、パソコンのみの表示を想定していると、サイト内のレイアウトが崩れてしまい、見にくいサイトになってしまいます。

レイアウトの崩れは、ユーザーの離脱率を高めてしまう可能性もあることから、細心の注意を払う必要があります。

具体的な対策方法は、以下の3つです。

画像サイズを指定する

画像サイズを指定することで、ページ内にある画像の大きさやスペースが確保されるため、レイアウトが崩れることがなくなります。逆にサイズを指定していないと、表示する端末によって画像が画面からはみ出したり、うまく表示されなかったりと、見栄えが悪くなってしまうので注意しましょう。

画像サイズを指定する方法は、Webサイトやコンテンツに画像や動画を挿入するときの「width（横幅）」と「height（高さ）」を、それぞれの画像の属性タグに記述するだけなので簡単です。

フォントを調整する

Webページ内にあるWebフォントは、ページが表示されてからダウンロードされるため、読み込みが遅くなるとCLSのスコアに悪影響を与えます。

そのため、フォント自体を事前に読み込ませる「preload属性」を設定しておくと、Webフォントの読み込み時間が短縮され、改善できる可能性が高いです。

広告のスペースを確保しておく・配置を変更する

画像サイズの指定と同様に、広告もサイズが指定されていないと、CLSのスコアを下げる要因となります。

ただし、広告の場合は企業ごとに表示させるサイズが異なるので注意しなくてはいけません。広告を表示させる専用のスペースを別途確保したり、余計な余白などができないように配置を変更したりすると、良いでしょう。

7.　まとめ

今回の記事では、コアウェブバイタルとはどのようなアップデートなのかという概要から、具体的な対策や改善方法について解説しました。ユーザーの利便性を追求しているGoogleにとって、コアウェブバイタルでユーザーがストレスなく閲覧できるWebページを評価することは当然のこと。

ただし、コアウェブバイタルに対して効果的な対策や改善を行うためには、専門的な知識が必要になる場合があります。JavascriptやCSS、PHPなどの編集技術が自社にないときは、ビジネスパートナーを無料で探せる「リカイゼン」をはじめとするビジネスマッチングサービスの利用も検討してみてくださいね。