TECH BLOG

マークリープス技術ブログ

open

Core Web Vitals とは?WebサイトのUXを測る3つの指標とSEOへの影響

Core Web Vitals とは?WebサイトのUXを測る3つの指標とSEOへの影響

Core Web Vitals(コア ウェブ バイタル)は、Google が提唱する「Webサイトにおけるユーザー体験」を評価するための指標群です。

この記事では、Core Web Vitals の概要と3つの評価要素について、初心者にもわかりやすく解説します。
「これから改善に取り組みたい」という方にとって、最初の一歩となる内容です。

Core Web Vitalsとは?

Core Web Vitals(コア ウェブ バイタル)は、Google が提唱する「Webサイトにおけるユーザー体験」を評価するための指標群です。
主に、以下の3つの観点から、実際のユーザーデータに基づいて測定されます。

  • ページの表示速度
  • 操作への反応性
  • 視覚的な安定性

これらのスコアが低下すると、ユーザーの離脱率が高まるだけでなく、SEO(検索順位)にも悪影響を及ぼす可能性があります。

Core Web Vitals の3つの指標

LCP(Largest Contentful Paint)

ページ内で最も大きなコンテンツが表示されるまでの時間を測定します。
一般的には、ヒーロー画像や大きな見出しが該当します。

理想値:2.5秒以内

INP(Interaction to Next Paint)

ユーザーが操作(クリック・タップなど)を行ってから画面が反応するまでの時間の中央値です。
2024年3月から、旧指標のFID(First Input Delay)に代わって正式に採用されました。

理想値:200ms以下

CLS(Cumulative Layout Shift)

ページ読み込み中に発生する予期しないレイアウトのズレの大きさを測定します。
画像のサイズ未指定やWebフォントの遅延読み込みが主な原因です。

理想値:0.1未満

モバイルとデスクトップで数値が異なる理由

Core Web Vitalsのスコアは、モバイルとデスクトップで異なることがあります。
これは端末性能、画面サイズ、通信環境などの違いが影響しています。

たとえば

  • モバイルでは画像やフォントの読み込みが遅くなり、LCPが悪化しやすい
  • タップできる範囲が狭いと、INPが悪化することがある
  • 画面幅が狭いため、CLS(レイアウトのズレ)が発生しやすい

どちらのスコアを重視するとよい?

Googleは検索評価において、モバイルでのスコアを優先しています。
スマートフォンからのアクセスが主流であるため、モバイルでの快適な体験を重視しましょう。

ただし、BtoBサイトやデザイン会社など、デスクトップからの利用が中心となるサイトでは、両方のスコアをバランスよく確認・改善することが大切です。

チェックポイントまとめ

  • モバイル・デスクトップの両方のスコアを確認する
  • Googleアナリティクス等で主要なアクセス環境を把握し、重点的に対策
  • モバイル特有のレイアウト崩れや読み込み遅延に注意する

SEOへの影響

Core Web Vitalsは、Googleの検索ランキング要因のひとつとされています。
ただし、これ単体で順位が大きく変動するわけではなく、コンテンツの質、モバイル対応、HTTPS化などとあわせて総合的に評価されます。

とはいえ、同程度のコンテンツであれば、より快適なユーザー体験を提供しているサイトのほうが、上位に表示されやすくなります。

スコアの確認方法

Core Web Vitalsのスコアは、以下のツールを使って確認できます。

PageSpeed Insights

URLを入力するだけで、実ユーザーデータ(フィールドデータ)とシミュレーション(ラボデータ)の両方を確認できます。
改善提案も自動表示され、初心者でも扱いやすいツールです。

PageSpeed Insights

Search Console

Googleにサイトを登録していれば、サイト全体の Core Web Vitals の傾向を確認できます。
問題のあるページも一覧表示され、改善の優先順位をつけやすくなります。

Chrome DevTools / Lighthouse

Chromeの開発者ツールからLighthouseを実行することで、ローカル環境でスコア分析が可能です。
リソースの読み込み順の確認や、表示速度に影響を与えている部分を見つけるのに役立ちます。
もしくは、Chrome拡張機能版の Lighthouse を使う方法もあり、DevTools にタブが表示されない場合に有効です。

まとめ

Core Web Vitalsは、「ユーザーが快適に使えるサイトかどうか」を可視化する重要な指標です。
まずは、現在のスコアを確認し、少しずつ改善を進めていきましょう。

よく読まれている関連記事

関連最新記事