Core Web Vitals（コアウェブバイタル）は、2021年6月から導入されたGoogleのUX指標であり、ランキング要因の一つです。
2021年6月頃から実施されたページエクスペリエンスアップデートによって、Core Web Vitalsがページエクスペリエンスシグナルの一つとして追加されました。
この記事では、Core Web Vitalsの3つの指標（LCP、FID、CLS）の解説とその対策方法について解説します。
検索上位表示する上で、CWVは避けては通れないので、しっかり理解した上で対策しておきましょう。
Core Web Vitals（コアウェブバイタル）とは？
Web Vitals（ウェブバイタル）
ウェブバイタル（Web Vitals）は、ユーザー体験を向上するためのGoogleの取り組みであり、 サイトの健全性を示す重要指標でもあります。
そして、Web Vitalsに対して具体的な数字でクライテリアを決めているのがCore Web Vitalsの3つの指標（LCP、FID、CLS）になります。
LCP（Largest Contentful Paint）
LCP（Largest Contentful Paint） は、」ページの表示速度を表す指標で、知覚される読み込み速度を数値化したものです。
画像などのデータ量が大きいサイトは表示速度が遅くなるので、3つの指標の中では最もイメージ・改善しやすい指標ですね。
良好なユーザー体験を提供するためには、LCPが2.5秒以下を目指す必要があります。
LCPは小さいほど良好で、2.5秒以内が良好、2.5秒～4秒が要改善、4秒以上が不良です。
参考：web.dev | Largest Contentful Paint (LCP)
FID（First Input Delay）
FID（First Input Delay）は、ユーザーの応答性を測る指標で、インタラクティブ性（読み込みの応答性）を表します。
ユーザーがサイト内でボタンやリンクをクリックしたり、JavaScriptの使用してから動作終了までの時間です。
良好なユーザー体験を提供するためには、FIDが100ms以下を目指す必要があります。
FIDも小さいほど良好で、100ms以内が良好、100ms～300msが要改善、300ms以上が不良です。
CLS（Cumulative Layout Shit）
CLS（Cumulative Layout Shift）は、視覚的な安定性を示す指標で、レイアウトのズレ・崩れを数値で表しています。
たとえば、サイト訪問した際に広告が時間差で表示されることで、コンテンツが移動してユーザー体験を損ないます。
良好なユーザー体験を提供するためには、CLSが0.1以下を目指す必要があります。
CLSは小さいほど良好で、0.1以下が良好、0.1～0.25が要改善、0.25以上が不良です。
Core Web Vitalsの確認・計測方法
Core Web Vitalsは様々な確認方法がありますが、主要な計測ツールを3つご紹介します。
| Chrome拡張機能（Web Vitals） | サーチコンソール | Page Speed Insights | |
| 確認単位 | △ （記事別） | ◎ （サイト全体） | ◯ （サイト全体） |
| 他者サイトの確認 | ◯ （可能） | × （不可） | ◯ （可能） |
| 改善方法の具体案 | × （なし） | × （なし） | ◯ （あり） |
Chrome拡張「Web Vitals」
1記事ごとにCore Web Vitalsの指標をすぐ確認したいなら、Crome拡張機能の「Web Vitals」が便利です。
無料でChromeに追加して、Chrome右上の「Web Vitals」のアイコンをクリックすると、表示中のページのLCP、FID、CLSが表示されます。
Core Web Vitalsの数値が悪すぎる場合、具体的な数字が表示されないこともあります。
サーチコンソール（Google Serach Console）
サイト全体としてCore Web Vitalsの改善要否を判断できるのが、サーチコンソールです。
サーチコンソールを使ったCore Web Vitals確認手順は以下の通りです。
- サーチコンソールにログイン
- 左メニューの「ウェブに関する主な指標」をクリック
- モバイル、PCの右上の「レポートを開く」をクリック
- レポートが表示される
レポートでは「不良」「改善が必要」「良好」に該当する記事数が表示されます。
もしレポートが良好の場合は、すべての記事に対してCore Web Vitalsの数値は表示されません。（一例として1記事のみ3つの指標の数値が表示されます）
そして、「不良」と「改善が必要」のみ、LCP、FID、CLSの数値が具体的に示されます。
Page Speed Insights
Page Speed Insights（ページスピードインサイト）は、Googleのサイト表示速度やパフォーマンスを確認できるツールです。
Core Web VitalsはPage Speed Insightsでも確認できます。確認手順は以下の通りです。
- Page Speed Insightsにアクセス
- 調査したいURLを入力
- 結果を確認する
Page Speed InsightsはCore Web Vitalsの点数計測だけでなく、改善方法も具体的に提示してくれるので必ず活用しましょう。
Core Web Vitalsの改善方法
Core Web Vitalsの改善は、次の3ステップで行うのが効率的です。
- サーチコンソールでサイト全体の評価を確認
- Core Web Vitalsの要改善・不良の記事を洗い出す
- Page Speed Insightsで記事ごとに改善する
LCP、FID、CLSで具体的にどう改善するかを解説します。
LCPの改善
LCPスコアを下げる要因は、主にサーバーの応答時間、リソースの読み込み時間（サイトのファイル容量）です。
そのため、LCPの改善は主に、画像・コードの最適化や圧縮、次世代画像フォーマット配信、遅延読み込み（Lazy Load）の導入などが効果的です。
まずは画像を圧縮したりWebP配信によってファイルサイズを減らして下さい。WordPressサイトの場合は各種プラグインを活用すれば、上記LCPの改善できます。
参考：次世代画像フォーマットWebPの対応ブラウザとCMS別の配信方法
FIDの改善
FIDスコアを下げる要因は、主にJavaScriptの実行です。
不要な JavaScript の削除や読み込み遅延などによって改善できます。
CLSの改善
CLSはデザインのズレ、崩れですがその主な要因は広告やJavaScriptです。
CLSの改善方法としては、広告表示によるズレに対して、予めサイト内に余白を設けておくことです。
そうすれば、読み込まれなくてもズレや崩れは生じません。
ページエクスペリエンスシグナル
出典：Google検索セントラル
2021年6月から実施されたページエクスペリエンスアップデートが実施されました。
そこで、ユーザー体験を図る指標としてページエクスペリエンスシグナルの既存の4つに、Core Web Vitalsが追加されました。
Core Web Vitalsと合わせて対策が必要なので、簡単に解説します。
１．モバイルフレンドリー
モバイルフレンドリーとは、フォントの大きさ、要素感の距離や位置関係など。モバイルの小さな画面での閲覧に適しているかどうかを判定します。
Googleのモバイルフレンドリーテストによってモバイルフレンドリーかどうか確認できます。
２．セーフブラウジング
ハッキングされたコンテンツ、マルウェア、ソーシャルエンジニアリングなどの悪意のあるコンテンツや不正コンテンツ、脆弱性などを判定します。
Googleの透明性レポートによって、セーフブラウジングのステータスを確認できます。
３．HTTPS対応
ページでHTTPSの対応を判定します。HTTPSは、HTTPで通信を安全に行うための仕組みです。
サーチコンソールの左メニュー「ページエクスペリエンス」でHTTPS対応状況を確認できます。
４．インターステイシャル
インターステイシャルトは、ページ内に表示される全画面広告のことです。
広告枠が大きすぎるとコンテンツの視聴を邪魔し、無用なクリックを誘導するなどのユーザーの利便性を損ないます。
Core Web Vitalsまとめ
2021年6月から8月にかけて実施されたページエクスペリエンスアップデートによって、Core Web Vitalsページエクスペリエンスシグナルに加えられました。
Core Web Vitalsは、LCP、FID、CLSの3つの指標で表現され、それぞれLCPは2.5秒以下、FIDは100ms以下、CLSは0.1以下への改善が望ましいです。
Core Web Vitalsの確認方法は、Chrome拡張機能「Web Vital」、サーチコンソール、Page Speed Insightsを紹介しました。
具体的な改善手順は、まずサーチコンソールでサイト全体を確認し、Page Speed Insightsでページごとに改善の流れがベストです。
Core Web Vitalsと合わせて、モバイルフレンドリー、セーフブラウジング、HTTPS対応、インターステイシャルなども改善しましょう。
