CWVとは新しく発表されたGoogleの検索順位決定に影響する要素です。

主な指標はLCP・FID・CLSの3つでWebページのスピードや快適な仕様に関するポテンシャルを示します。

CWVの特徴は各指標の改善がユーザビリティ向上に直結することです。

つまり、各指標の評価基準や指標悪化につながる要素を把握し対策することがSEO的に強いWebページ作りにつながります。

CWVの3つの指標

そもそもCWVとはCore Web Vitalsの略で、表示スピードや快適性に関する3つの指標があります。

• LCP：Webページが表示される速さ
• FID：ユーザーの操作に対するリアクション
• CLS：ページのレイアウトは安定して表示されるか

検索順位を決定づける要因としてGoogleが新しく導入することを公式ウェブマスターブログで発表しました。

英語版ブログでは2020年5月、日本語版ブログでは同年6月に発表されています。

LCP

LCPとはWebページをクリックしてから表示されるまでどの程度の時間がかかるのか、という指標です。

正式にはLargest Contentful Paintといいます。

LCPについての理解を促すためには類似指標であるFCP（First Contentful Paint）と比較してみましょう。

最も大きな違いは何が表示されるまでのスピードか、という点です。

FCPはページを構成する要素の中で最初の要素が表示されるまでにどのくらいの時間がかかるのか、という指標です。

例えば、ヘッダーのみ・サイドバーのみ表示されただけであっても表示された時点でFCPとしてカウントされます。

対してLCPはページを構成する「メイン」の要素が表示されるまでの時間を評価する指標です。

つまり、そのページが担うべき役割をメインで果たしている要素が表示されるまでの時間ということになります。

FID

FIDの正式名称はFirst Input Delayです。

ユーザーはアクセスしたWebページ上で何らかの操作を行います。

例えば「次のページへ」ボタンをクリックしたりアンケート入力ページで選択肢をクリックしたり、といった操作です。

FIDとはその操作に対するブラウザ上のリアクションがどのくらい速さで実行されるか、という指標です。

つまり、ユーザーの操作に対しページがリアクションを返すスピードを定量的に把握することができます。

CLS

CLS（Cumulative Layout Shift）とは視覚的なレイアウトがどの程度安定して表示されるかを把握するための指標です。

ブラウザがページを読み込む段階で想定外のレイアウト崩れがどの程度のものなのか、を数値化した指標ともいえます。

例えば「次のページへ」をクリックしようとしたら、突然表示されたWeb広告を誤ってクリックしてしまったことはありませんか？

これはWeb広告の登場によって「次のページへ」ボタンが下にずれてしまうことで起こる現象です。

Webページのレイアウトのズレは制作する側が意識している以上にユーザーは気にしています。

ページレイアウトのズレがPV数や滞在時間にも影響しているのではないか、という論もあるほどです。

CWVを改善するメリット

CWVを改善するメリットは2つあります。

1つはユーザーがWebページをクリックする確率が向上する可能性、もう1つは直帰率改善への期待です。

＜クリック率向上可能性＞

現在、モバイル端末からGoogleで何らかのキーワードを検索した際にトップニュースという枠が表示されます。

検索したキーワードに関連する最新ニュースが表示され、目立つ場所にあるためクリックするユーザーも多いです。

このトップニュースに表示するページ選定の判断基準としてCWVが検討材料であることをGoogleは明言しています。

特にニュースサイトや業界の最新情報を提供するメディアを運営している企業にとっては見逃せないメリットです。

＜離脱率改善＞

大前提として、ユーザーはページに記載されている情報を1秒でも速く確認したいと考えています。

そのため1秒でも速く有益な情報を表示できるページにユーザーは集まるのです。

逆に考えると、情報を確認できるスピードが遅いWebページにユーザーは集まりません。

事実、GoogleはLCP・FID・CLSがすべて良好であればページを離脱するユーザーが25％程度減少すると指摘しています。

CWV対策の重要性

CWV対策が重要な理由としてGoogleは直帰率を挙げて説明しています。

＜ページの読み込みスピードに関するGoogleの見解＞

• ページの読み込み時間が1秒から3秒に増加 → 直帰率が32％増加
• ページの読み込み時間が1秒から6秒に増加 → 直帰率が106％増加

ブラウザがWebページを読み込む間が快適でないと、ユーザーはそのページを諦め他のページに移動する確率が高まります。

そのため、ブラウザがWebページを読み込む間ユーザーが快適に過ごせるようにする施策が必要です。

それを明確に示す指標こそCWVなのです。

つまり、CWVの各指標が良好な状態を維持することはユーザビリティ向上による直帰率改善施策ともいえます。

CWVを確認できるツール

CWVを確認できるツールには様々なものがあります。中でもよく取り上げられるものが下記3つのツールです。

• ページスピードインサイト
• サーチコンソール
• ライトハウス

特にサーチコンソールとライトハウスはGoogleがリリースしているツールという安心感が魅力です。

ページスピードインサイト

ページスピードインサイトはWebページの表示速度を測ることができるツールです。

LCP・FID・CLSの3つの指標をすべて定量的に計測することができます。

ソフトウェアのダウンロードを要せず「ページスピードインサイト」でGoogle検索するとそのページにアクセスできます。

ページURLが分かれば自社サイト以外でも計測可能なので、競合サイトのCWVを計測できる点がメリットです。

サーチコンソール

サーチコンソールはSEOに役立つ指標を確認できるツールでGoogleが無償で提供しています。

CWVが検索順位決定の要素に加わったためサーチコンソールでもCWVの評価レポートを参照できるようになりました。

定量的な数値を把握することはできませんが、それぞれどのような評価を獲得しているのか把握できます。

SEOに関する全体的な評価を掴みたい時に便利なツールです。

サーチコンソールで大まかな評価を把握した後にページスピードインサイトなどで詳細を確認していく、という流れが一般的です。

ライトハウス

Googleが開発したGoogle Chrome向けの拡張機能です。SEOで重要な要素を全体的に確認することができます。

＜ライトハウスで確認できること＞

• titleタグ記載の有無
• meta descriptionタグの記載有無
• 画像内altタグ内の文言記載 など

注意点として、ライトハウスの導入には拡張機能の追加が必要です。また、FIDの測定機能はありません。

その代わりにTBT（Total Blocking Time）という類似の独自指標があります。

LCP対策

LCP対策は表示スピードを速くするためにはどうすればいいか、というシンプルな考え方です。

ページが少しでも早く表示されるために不要なものを読み込む時間をつくらないようにしましょう。

LCPの評価基準

LCPはGood：良好・Needs Improvement：要改善・Poor：不良の3段階で評価されます。

• Good（良好）：2.5秒以内
• Needs Improvement（要改善）：4秒以内
• Poor（不良）：4秒超

例えば、デジマクラストップページのLCPをページスピードインサイトで計測すると2.2秒でGoodと判断できます。

（2021年8月時点）

もし、4秒以上かかるようであれば改善の余地があるでしょう。

LCPスコアが低下する要因

LCPのスコアが低下する要因として下記が考えられます。

• サーバーのリアクションの速さ
• 画面を描画する処理が遅い（レンダリングブロック）
• CSS・JavaScriptなどの読み込み速度が遅い など

特にJavaScript・CSSの不要な記述がないかどうかがチェックポイントです。

LCPの改善方法

LCPを改善する場合不要なものを削ぎ落としてシンプルにという考え方が重要です。

例えば下記のような要素で不要なものがないかをチェックしてみてください。

• altタグ内などのコメント
• 空白行
• 改行 など

また、画像が適切かどうかにも注目してみましょう。

例えば、サイズが大きすぎる画像ならサイズの適正化・不要な情報の削除・負担の軽いファイル形式への変更などが有効です。

FID対策

FIDもスピードに関する指標です。そのため、対策の基本的な考え方や手法がLCPと似ている点もあります。

FIDの評価基準

FIDもLCP同様にGood：良好・Needs Improvement：要改善・Poor：不良の3段階で評価されます。

• Good：1/100秒以内
• Needs Improvement：3/100秒以内
• Poor：3/100秒超

ページスピードインサイトで定量的な数字で示されたスコアを把握できる点はLCPと同様です。

FIDスコアが低下する要因

FIDのスコアが低下してしまう原因としてまずはJavaScriptを疑ってみましょう。

• 追加機能・オプション機能のソースコードによる影響がないか
• メインスレッドの実行に負担がかかりすぎていないか
• サーバーへのリクエスト数は多すぎないか など

JavaScriptの実行に時間がかかりすぎる要素がないか、という視点でチェックしてみてください。

FIDの改善方法

まずは改善点を明確にするところがスタート地点です。

その上でLCPと同様に不要なコメントや空白行、改行の削除に取り組みましょう。

また、ページスピードインサイトを使用すれば不要なJavaScriptを提案してくれるので積極的に活用してみてください。

非同期設定もFIDを改善させる方法としておすすめです。

CLS対策

CLS対策の基本はレイアウトのズレをなくすことです。そこで、Webページレイアウトに影響を与える要素に注目してみましょう。

CLSの評価基準

CLSもLCP・FID同様に3段階で評価されます。

• Good：0.1以内
• Needs Improvement：0.25以内
• Poor：0.25超

CLSのスコアを導き出す計算式は影響を受けた範囲の割合×移動した距離の割合です。

例えば、急なWeb広告の登場によりページを構成する要素にズレが生じたとします。

影響を受けた範囲の割合とはWeb広告の登場でズレた範囲がページ全体に対してどのくらいの比率を占めているか、です。

対して移動した距離の割合とはWeb広告の登場によってズレた距離がページ全体に比べてどの程度か、という比率です。

CLSスコアが低下する要因

CLSのスコアが低下している場合、下記についてチェックしてみましょう。

• 画像がサイズ指定されているか
• 動画は過度な負担になっていないか
• フォントの負担は重すぎないか など

特に注目したいのがフォントです。

デフォルトで設定されているWebフォントでウォールバックが起こると、CLSの評価に影響する場合があります。

ウォールバックとは設定されているフォントに表示したい文字が用意されていない場合に他のフォントによる代替表示を行うことです。

CLSの改善方法

まずはサーチコンソールでCLS改善余地のあるページを特定しましょう。

ページが特定できたらページスピードインサイトで指標を悪化させている可能性が高い要素をピックアップします。

その上で下記施策を行ってみてください。

• HTML・CSS上で画像サイズを指定する
• 広告・動的コンテンツを可能な限りファーストビューから遠ざける
• 広告・動的コンテンツ用のプレースホルダを設定し表示領域を確保する
• そもそもJavaScriptを使用しない など

画像サイズについてはWordPressの場合、画像挿入を行った時点で自動的にサイズ指定される仕様になっています。

WordPress以外のホームページ作成ツールを使っている場合にチェックしてみましょう。

CWVの改善終了後にやるべきことは？

CWVの各指標についてそれぞれ改善すべき点に対応したら、その修正の方向性が正しいのかを確認・検証しましょう。

確認はサーチコンソール上にあるWebに関する主な指標というサイドメニューからできます。

リクエストなどは特に必要なくGoogleの更新に任せておいて構いません。ただし、更新に1か月程度かかる場合もある点に注意が必要です。

CWV対策に関して悩んだ時の対処法

CWVはSEOで注目すべき指標であり、特にモバイル向けWebマーケティングを展開するなら決して無視できないものです。

もし、自社サイトが要改善・不良などの評価基準に該当しているのであれば早急な対応をおすすめします。

しかし「どうやってCWVを改善すればいいのか？」具体的な方法がわからない、という方も少なくありません。

CWV自体が新しい評価指標でありSEO上どの程度影響しているのか、まだまだ検証が必要だからです。

そこで、CWV改善をデジマクラスにお手伝いさせてください。デジマクラスの強みは2つあります。

1つはWebマーケティング・デジタルマーケティングを専門領域として様々なケースから得たノウハウの蓄積があることです。

さらにもう1つは、ノウハウを蓄積できる分析手法やリソースをご提案できることです。

CWVを改善したいけれど確実な改善手法を見つけ出す時間もリソースも足りない、という悩みの解決を強力にバックアップします。

まとめ

CWVはSEOの新しい評価軸の1つです。定量的なスコアを算出することができ、直帰率・離脱率などの改善に役立ちます。

また、ページのスピードを示す指標も多いため改善によって高いUXを実現できる点でも重要な指標です。