---
title: "Core Web Vitalsとは？表示速度・体験の指標"
description: "LCP・INP・CLSがそれぞれ何を測り、どの数値を目指せばいいのかを整理したい人向けの解説。ページ品質の改善を始めるにあたって指標の意味を正しく理解するための入門記事です。"
image: "https://giga-site.com/og-image.png"
canonical: "https://giga-site.com/articles/what-is-core-web-vitals"
markdown: "https://giga-site.com/articles/what-is-core-web-vitals/index.md"
category: "用語解説"
publishedAt: "2026-06-24"
updatedAt: "2026-06-25"
readingMinutes: 5
---
# Core Web Vitalsとは？表示速度・体験の指標

ページの「速さ」や「使い心地」を数値で表すのがCore Web Vitalsです。名前は聞いたことがあっても、LCP・INP・CLSが何を測っているのか曖昧な人も多いはず。この記事では3つの指標の意味と目安、改善の入口を初心者向けに整理します。

> Source HTML: https://giga-site.com/articles/what-is-core-web-vitals
> Article index: https://giga-site.com/articles/index.md

## Core Web Vitalsとは何か

Core Web Vitalsは、Googleが提唱する「ユーザー体験の質」を測るための代表的な指標群です。ページが速く表示されるか、操作にすぐ反応するか、表示中にレイアウトが崩れないか、という3つの観点を数値化します。

重要なのは、見た目の華やかさやアクセス数ではなく、実際にページを開いた人が感じる快適さを測ろうとしている点です。読み込みが遅い、ボタンを押しても反応しない、読んでいる途中で文字がずれる、といったストレスを数字で捉えます。

Googleはこれらをページのランキングシグナルのひとつとして扱うと説明しています。検索順位を決める唯一の要素ではありませんが、内容の質が近い場合に体験のよいページが評価されやすくなる、と考えるのが実務的です。

## LCP：主要コンテンツが表示される速さ

LCP（Largest Contentful Paint）は、画面に表示される最も大きな要素、たとえばヒーロー画像や見出しテキストが描画されるまでの時間を測ります。ユーザーが「だいたい読み込めた」と感じるタイミングの目安です。

一般的な目安として、2.5秒以内なら良好、4秒を超えると改善が必要とされます。大きな画像の最適化、サーバー応答の高速化、不要なスクリプトの読み込み遅延などが改善の定番です。

## 実務ではどこで関係する？

Core Web Vitalsは言葉の意味だけ覚えても、HTML共有の判断にはつながりません。実務では「表示に関係する話か」「検索に関係する話か」「アクセス制限に関係する話か」を分けて考えると整理しやすくなります。

Core Web Vitalsについて迷ったら、相手が安全に開けるか、検索に出してよいか、ブラウザや環境差で壊れないかを順番に確認します。用語理解は、その判断を早くするための道具として使います。手順が決まったら、HTML/ZIPをアップロードして共有URLを発行し、相手に確認してほしい観点と期限を添えて送ります。

- 表示の話: HTML/CSS/JS、パス、ブラウザ互換性を確認する
- 検索の話: noindex、canonical、sitemap、robots.txtの役割を分ける
- 制限の話: URL共有、パスワード、メール認証、会社ドメイン認証を混同しない
- 運用の話: 期限、差し替え、削除、共有メッセージまで決める

## INPとCLS：反応の速さと表示の安定

INP（Interaction to Next Paint）は、クリックやタップなどの操作に対して画面が次に反応するまでの速さを測ります。フォーム送信やボタン操作の多いページで特に効いてくる指標で、200ミリ秒以内が良好の目安です。

CLS（Cumulative Layout Shift）は、読み込み中に要素が予期せず動いてしまう量を測ります。広告や画像の枠を確保せずに表示すると、文字が突然下にずれて誤タップを招きます。0.1以下を目安に、画像や埋め込みにあらかじめサイズを指定すると安定します。

## 計測してから直すまでの流れ

数値は推測ではなく計測してから直すのが鉄則です。まず現状を測り、悪い指標を特定し、原因にあたりをつけて一つずつ手を入れます。

一度にすべてを直そうとすると、どの施策が効いたのか分からなくなります。指標を一つずつ潰し、再計測で効果を確かめながら進めるのが、遠回りに見えて確実な進め方です。

1. PageSpeed InsightsやLighthouseでページを計測し、LCP・INP・CLSの値を確認する
2. 最も基準から外れている指標を1つ選び、改善対象を絞る
3. 画像最適化やスクリプト調整など原因に対応する施策を1つ実施する
4. 再計測して数値の変化を確認し、改善が出たら次の指標に進む

## 確認用ページでも体験は損なわない

本番サイトだけでなく、レビューや確認のために一時的に見せるページでも、表示が遅いと相手の集中を削いでしまいます。完成版に近い体験で見てもらえると、フィードバックの精度も上がります。

ギガサイト便は、ドロップしたHTMLやZIPをCDNのエッジ配信で速く表示できるため、確認用の共有URLでもストレスの少ない表示を保ちやすい仕組みです。あくまで確認・レビュー用の一時共有が得意分野ですが、見せる段階で体験を落とさずに済みます。

## よくある質問

### Core Web Vitalsを満たせば検索順位は上がりますか？

それだけで順位が決まるわけではありません。ランキングシグナルの一つであり、内容の質が前提です。同等の内容なら体験のよいページが有利になりやすい、という位置づけで捉えるのが現実的です。

### 3つの指標のうちどれから直すべきですか？

まず計測して、基準値から最も外れている指標を選びます。多くのサイトではLCP（表示速度）が最初の課題になりやすいですが、操作の多いページではINP、レイアウトが動くページではCLSが優先になります。

### モバイルとPCで数値は違いますか？

違います。回線や端末性能の影響でモバイルの方が悪くなりがちです。多くの利用がモバイルであることが多いため、改善はモバイルの値を基準に進めると効果を実感しやすくなります。

### 計測ツールによって値がぶれるのはなぜですか？

計測環境やネットワーク条件、実際のユーザーデータか試験環境かによって差が出ます。一度きりの値で判断せず、同じ条件で複数回測り、傾向で評価するのがおすすめです。

### 実務ではどこで関係する？はHTML共有で必ず理解しておく必要がありますか？

細かな仕様を暗記する必要はありません。ただし、検索に出るか、閲覧者を制限できるか、表示が崩れないかに関わる用語は、共有前の判断材料として押さえておくと安全です。

## 関連記事

- [LCP（Largest Contentful Paint）とは？メインコンテンツが出る速さ](https://giga-site.com/articles/what-is-lcp/index.md)
- [CLS（レイアウトのずれ）とは？読み込み中に画面が動く原因](https://giga-site.com/articles/what-is-cls/index.md)
- [ミニファイ（minify）とは？ファイル圧縮の基礎](https://giga-site.com/articles/what-is-minify/index.md)
- [HTTP/2・HTTP/3とは？表示が速くなる新しい通信規格](https://giga-site.com/articles/what-is-http2-http3/index.md)
- [Keep-Aliveとは？接続を使い回して速くする仕組み](https://giga-site.com/articles/what-is-keep-alive/index.md)
- [TTFB（最初のバイトまでの時間）とは？表示の速さを左右する指標](https://giga-site.com/articles/what-is-ttfb/index.md)

```json
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "Core Web Vitalsとは？表示速度・体験の指標",
  "description": "LCP・INP・CLSがそれぞれ何を測り、どの数値を目指せばいいのかを整理したい人向けの解説。ページ品質の改善を始めるにあたって指標の意味を正しく理解するための入門記事です。",
  "datePublished": "2026-06-24",
  "dateModified": "2026-06-25",
  "mainEntityOfPage": "https://giga-site.com/articles/what-is-core-web-vitals",
  "url": "https://giga-site.com/articles/what-is-core-web-vitals",
  "inLanguage": "ja",
  "image": "https://giga-site.com/og-image.png",
  "articleSection": "用語解説",
  "author": {
    "@type": "Organization",
    "name": "ギガサイト便"
  },
  "publisher": {
    "@type": "Organization",
    "name": "ギガサイト便"
  },
  "mainEntity": [
    {
      "@type": "Question",
      "name": "Core Web Vitalsを満たせば検索順位は上がりますか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "それだけで順位が決まるわけではありません。ランキングシグナルの一つであり、内容の質が前提です。同等の内容なら体験のよいページが有利になりやすい、という位置づけで捉えるのが現実的です。"
      }
    },
    {
      "@type": "Question",
      "name": "3つの指標のうちどれから直すべきですか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "まず計測して、基準値から最も外れている指標を選びます。多くのサイトではLCP（表示速度）が最初の課題になりやすいですが、操作の多いページではINP、レイアウトが動くページではCLSが優先になります。"
      }
    },
    {
      "@type": "Question",
      "name": "モバイルとPCで数値は違いますか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "違います。回線や端末性能の影響でモバイルの方が悪くなりがちです。多くの利用がモバイルであることが多いため、改善はモバイルの値を基準に進めると効果を実感しやすくなります。"
      }
    },
    {
      "@type": "Question",
      "name": "計測ツールによって値がぶれるのはなぜですか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "計測環境やネットワーク条件、実際のユーザーデータか試験環境かによって差が出ます。一度きりの値で判断せず、同じ条件で複数回測り、傾向で評価するのがおすすめです。"
      }
    },
    {
      "@type": "Question",
      "name": "実務ではどこで関係する？はHTML共有で必ず理解しておく必要がありますか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "細かな仕様を暗記する必要はありません。ただし、検索に出るか、閲覧者を制限できるか、表示が崩れないかに関わる用語は、共有前の判断材料として押さえておくと安全です。"
      }
    }
  ]
}
```