

コアウェブバイタルとは、Googleが発表した「Webサイトのユーザー体験(UX)を高めるための指標」です。サイトの掲載順位にも影響するこの指標は、SEOで上位表示を目指すときにすっごく重要!この記事では、コアウェブバイタルの影響やスコアの確認方法、3つの要素の改善方法についてご紹介します!
ビギニャー君、このページの表示速度が遅いから、ちょっと担当者に確認してきてもらってもいい?コアウェブバイタルのスコアが悪くなっているかも。
いいですけど……、コアウェブバイタルってなんですか!?なんかカッコイイ!!
コアウェブバイタルとは?

コアウェブバイタル(Core Web Vitals)とは、2020年にGoogleが発表した「ユーザー体験(UX)を評価するための指標」のことです。言い換えると、そのサイトがユーザーにとってどれくらい使いやすいものなのかを表す「UX指標」を指します。
もともとGoogleでは、UXを向上させるために「ウェブバイタル」というたくさんの指標を用いていました。しかし評価する指標があまりにも多く、何を改善すればユーザー体験を向上させられるのかわかりにくかったので、とくに重要な項目としてコアウェブバイタルが発表されたのです。
コアウェブバイタルは、文字通り「サイトのユーザー体験(UX)を向上させるための“核”」となる指標です。
コアウェブバイタルの指標には、どんなものが含まれているんですか?
コアウェブバイタルの指標には、3つの種類があるんだよ。
コアウェブバイタルには3つの指標がある

Googleがコアウェブバイタルとして指定している3つの指標は、以下のとおりです。
LPC(Largest Contentful Paint ):読み込み時間
ブラウザ表示範囲の中で、一番大きなコンテンツを読み込むときにかかる時間を表す指標です。具体的には、サイト内でメインとなる画像や動画が表示されるまでの待機時間を指します。
画像や動画が重すぎて、クリックしてもなかなかコンテンツが表示されないサイトにイライラした経験は誰にでもあるでしょう。Googleからは、2.5秒以内にメインのコンテンツが表示されることが理想的だと発表されています。
FID(First Input Delay ):インタラクティブ性
ユーザーがページで何らかのアクションを取ったとき、どれくらいの早さで反応するかを表す指標です。クリックやタップ、テキスト入力したとき、反応速度が遅いサイトは非常に使いにくいですよね。Googleからは、遅延速度が100ミリ秒未満であることが理想的であると発表されています。
CLS(Cumulative Layout Shift ):視覚的安定性
ページを読み込んでいるとき、どれくらいレイアウトがずれるのかを表す指標です。サイトを見ているとき、少し時間が経ってから広告が表示されることで、意図せず広告をタップしてしまったことはありませんか?この予期しないレイアウトのズレが、CLSなのです。CLSは「ずれが生じた表示領域の比率 × 距離の比率」という計算式を用いて測定可能で、この数値が0.1未満であることが理想的だとGoogleでは発表されています。
この3つの指標を、バランスよく向上させていくことが重要なんだよ。
たしかに、どれもサイトを見るときの快適性に直結する内容ばかりですね!
ちなみに、コアウェブバイタルが重要な理由には、UXを向上させられること以外にもあるんだよ!
コアウェブバイタルってどうして重要なの?

サイトを運営するうえでコアウェブバイタルを意識しなければいけない理由は、SEOに大きな影響を与えるからです。
ウェブバイタルの指標は、どれもユーザーの使いやすさをアップさせるためには重要です。なかでも、とくにコアウェブバイタルは最重要視されており、2021年6月からは検索順位を左右する要素として組み込まれています。[注1]つまり、自社サイトの上位表示を目指すためには、コアウェブバイタルの向上が欠かせないというわけなのです。なお、現在はスマートフォンからの検索のみが対象となっていますが、今後はパソコンからの検索にも適用されるため、デバイスにかかわらず対策が必要になります。
注意しなければいけないのが、コアウェブバイタルが高ければ必ず上位表示されるわけではない点です。Googleからは、「同じ内容や品質の高さのページが複数ある場合、コアウェブバイタルが優れているページを優先表示させる」と発表されています。[注2]
SEO施策を成功させるためには、コアウェブバイタルだけではなくコンテンツの内容も高めることが肝心です。そのことをしっかりと理解したうえで、コアウェブバイタル改善に取り組んでくださいね!
[注1]Google 検索セントラル ブログ|ページ エクスペリエンスの更新に対応するための期間、ツール、詳細情報https://developers.google.com/search/blog/2021/04/more-details-page-experience
[注2]Google 検索セントラル ブログ|より快適なウェブの実現に向けたページ エクスペリエンスの評価https://developers.google.com/search/blog/2020/05/evaluating-page-experience?hl=ja

SEO(Search Engine Optimization:検索エンジン最適化)とは、サイトの上位表示を目指すために行うマーケティング戦略です。「言葉はよく耳.....
なるほど~、SEOにも影響するんですね!たしかに、ユーザーにとって使いやすくて有益なコンテンツ作りが重要って、Googleがいつも言っていますもんね!
そうそう、UXを向上させることはSEO効果にもつながるから、両方の意味で重要なんだよね。
で、でも、この3つの指標のスコアってどうやってチェックすればいいんですか!?
コアウェブバイタル評価を確認する方法

自社サイトのコアウェブバイタル評価を把握したいときは、さまざまなツールを活用することで具体的な数値を知ることができます!ここでは、コアウェブバイタル評価を確認できる代表的なツールをご紹介します。
Google Search Console
多くの企業が検索パフォーマンスを計測するために活用しているGoogle Search Consoleには、蓄積したデータをもとにコアウェブバイタルを評価する機能が搭載されています。「ウェブに関する主な指標」のメニューを押すと、Googleが設定しているコアウェブバイタルの基準を満たしていないページを簡単にチェックできます。
ページを「良好」「改善が必要」「不良」の3段階でわかりやすく評価してくれるので、検索パフォーマンスを確認するついでにチェックしておきましょう!
PageSpeed Insights
PageSpeed Insightsは、調査したいページのURLを入力するだけで、ページの表示速度を測定してくれる無料のツールです。ページ全体のスコアはもちろんのこと、LCPやFID、CLSそれぞれのスコアを調べられますし、改善点も提案してくれます。Google Search Consoleに十分なデータが蓄積されていない新規のページを調査したいときは、こちらのほうが便利でしょう。
Web Vitals
Web Vitalsは、Google Chromeの拡張機能です。計測したいページを開き、拡張機能のアイコンをクリックするだけで、簡単にコアウェブバイタルの計測結果をポップアップで知らせてくれます。画面を切り替えることなく気軽に調べられる点が大きなメリットです。
へぇ~、いつも使っているSearch Consoleとか、無料のツールでも確認できるんですね!便利です!
それぞれの指標のスコアをきちんと把握できたら、結果が悪かった部分を改善していくことが大切だよ。
最後に、指標ごとに数値を改善するための対策法を紹介するね。
コアウェブバイタルのスコアを改善する方法

もしも自社サイトのコアウェブバイタルを確認して、評価が悪かった場合はどう対処すればいいのでしょうか。最後に、Web担当者が必ず押さえておきたい、コアウェブバイタルの改善方法についてご紹介します。
LCP
LCPが遅くなってしまうのは、データが重くなっていることが原因です。そのため、とにかくデータを減らしたりサイズを小さくしたりして、読み込みの負担を減らすことが大切です。
〈LCPを改善する方法〉
- 画像や動画ファイルの圧縮
- 不要なコンテンツの削除
- 読み込みに時間がかかるCSSやJavaScriptの削除
- サーバーの応答時間を短縮する
- ユーザー側に読み込み負担をかけないよう、サーバー側で処理を行う
- 重要性が低いデータの読み込み優先順位を下げる など
FID
FIDは、一気にたくさんのJavaScriptを読み込むことで低下してしまいます。JavaScriptとは、ユーザーのパソコンやスマートフォン上で作用する、動的なサイトを作るためのプログラミング言語です。たとえば、「ボタンをクリックするとイラストが変わる」といったコンテンツを作ることができます。このJavaScriptを見直すことで、FIDの改善が目指せます。
〈FIDを改善する方法〉
- 不要なJavaScriptの削除
- JavaScriptを圧縮する
- 読み込みに時間がかかるJavaScriptは分割する
- Webワーカー(バックグラウンドでJavaScriptを実行するツール)を使用する
CLS
CLSの低下は、多くの場合で画像やフォントデータなどの読み込みに時間がかかることで起きます。読み込み後にレイアウトがずれることが原因となるケースが多いため、あらかじめコンテンツを表示する幅を指定しておくと、CLSの改善を目指せます。
〈CLSを改善する方法〉
- 表示する画像のサイズを指定しておく
- 読み込みに時間がかかる画像を使用しない
- 画像のデータ量やサイズを一定にしておく
- 広告などの動的コンテンツの表示領域を指定して空けておく
- フォントの読み込みを優先させる など
わたしたち株式会社ゴンドラでは、無料でGoogleアナリティクスの分析レポートをお出しし、分析のサポートを行っています。「Googleアナリティクスで分析してみたいけど、やり方がわからない・・・」そんなお悩みをお持ちの方は、ぜひお気軽にご相談ください!