運用保守・集客改善

Webサイトの表示速度の基準は?Core Web Vitalsの目安と改善方法

公開 更新 読了 約15分

「自社のホームページがスマホで開くのが遅い気がする」「PageSpeed Insights で測ったら点数が低かったが、何を基準に、どこから直せばよいか分からない」。表示速度は、見た目では良し悪しが分かりにくく、制作会社に「速くしてください」と頼むだけでは、何が改善されたのか確かめられません。

Webサイトの表示速度は、Google の Core Web Vitals の3指標(LCP 2.5秒以下・INP 200ミリ秒以下・CLS 0.1以下)を満たしているかで判断し、画像・フォント・スクリプト・サーバーの順に原因を確かめて直すのが近道です。

この記事では、表示速度が検索と問い合わせに与える影響、Core Web Vitals の基準値と PageSpeed Insights の点数の見方、確認に使うツール、遅くなる主な原因と改善方法、かつて高速化の手段とされた AMP の現在の扱い、制作・リニューアルのときに発注者が確認したいことまでを解説します。

Webサイトの表示速度が重要な理由

表示速度は、訪問者がページを待たずに離れてしまうのを防ぎ、同じくらい役に立つページ同士を比べたときの検索での評価にも関わるため、問い合わせの数に直接影響します。

検索順位への影響

Google は2018年7月から、モバイル検索でもページの読み込み速度を順位付けの要素に加えました。現在は、表示速度を含む「ページ エクスペリエンス」を、ランキングシステムが評価する要素の一つとしています。

ただし、表示速度だけで順位が決まるわけではありません。Google は、ページ エクスペリエンスという単一の評価があるわけではなく、ページ エクスペリエンスが多少劣っていても検索した内容に最も関連するページを表示すること、Core Web Vitals の結果が良くても上位表示が保証されるわけではないことを明示しています(Google 検索セントラル「ページ エクスペリエンス」)。役に立つページが多く競合しているときに、表示速度の良さが差になる、と理解するのが正確です。

ユーザー体験と問い合わせへの影響

表示に時間がかかると、訪問者はページが開く前に検索結果へ戻ってしまいます。特にスマホでは通信環境が安定しないことも多く、ページが重いほど離れる人が増えます。読まれないページからは問い合わせも生まれないため、表示速度の改善は、内容やデザインの改善の前提になります。画面のずれ(後から画像やバナーが入って本文が動く)や、ボタンを押しても反応が遅いことも、使いにくさとして離脱の原因になります。

表示速度の基準:Core Web Vitals の3指標

表示速度の基準は、Google が定める Core Web Vitals の3指標で、LCP は2.5秒以下、INP は200ミリ秒以下、CLS は0.1以下が「良好」です。

指標何を測るか良好改善が必要不良
LCP(Largest Contentful Paint)ページの一番大きな画像や文章のかたまりが表示されるまでの時間(読み込みの速さ)2.5秒以下2.5秒超〜4秒4秒超
INP(Interaction to Next Paint)クリックやタップなどの操作をしてから、画面が反応するまでの時間(操作への反応の速さ)200ミリ秒以下200ミリ秒超〜500ミリ秒500ミリ秒超
CLS(Cumulative Layout Shift)読み込み中に画面のレイアウトが予期せずずれる量(見た目の安定性)0.1以下0.1超〜0.250.25超

これらは実際の利用者のデータで判定され、ページを表示した回数のうち75%(75パーセンタイル)が基準を満たしているかで評価されます。3つすべてが「良好」のときに、Core Web Vitals に合格したことになります(PageSpeed Insights について)。参考として、最初に何かが表示されるまでの時間(FCP)は1.8秒以下、サーバーが最初の応答を返すまでの時間(TTFB)は0.8秒以下が「良好」の目安とされています。

FID から INP への変更

操作への反応の速さを測る指標は、2024年3月12日に FID(First Input Delay)から INP に置き換わりました(web.dev による INP 導入の告知)。FID は最初の1回の操作だけを測っていましたが、INP はページを開いている間のすべての操作の反応を対象にします。古い記事や資料で FID の基準値(100ミリ秒)が紹介されていたら、現在は INP で確認します。

PageSpeed Insights の点数と合否の違い

PageSpeed Insights に表示される0〜100の点数は、Google の Lighthouse というツールが、決まった条件でページを読み込んで測った「ラボデータ」の評価です。90〜100が良好(緑)、50〜89が改善が必要(オレンジ)、0〜49が不良(赤)と色分けされます。

一方、Core Web Vitals の合否は、Chrome を使う実際の利用者から過去28日間に集めた「フィールドデータ」で判定されます。点数は原因を探すための目安、合否は実際の利用者の体験と考え、両方を見ます。アクセスが少ないページではフィールドデータが表示されないことがあり、その場合はサイト全体(オリジン)のデータか、ラボデータで判断します。

Service

運用保守・集客改善のご相談はフェニックスデザインへ

ナレッジベースを運営するフェニックスデザインが、今のサイトの数字を見るところから対応します。URLを入れるだけの無料簡易診断から。

表示速度の確認方法

表示速度は、まず PageSpeed Insights で主要なページを測り、サイト全体の傾向は Search Console で、原因の詳しい調査は Chrome のデベロッパーツールで確認します。

ツール分かること向いている場面
PageSpeed Insights1ページごとの点数、Core Web Vitals の実測値と合否、改善の候補トップページやサービスページなど主要ページの確認
Search Console「ウェブに関する主な指標」サイト全体で「良好」「改善が必要」「不良」の URL がどれだけあるかどの種類のページが遅いかの把握、改善後の推移の確認
Chrome デベロッパーツール(Lighthouse・パフォーマンス)読み込みの順番、重いファイル、反応が遅い処理制作会社や担当者が原因を特定するとき
当社の無料簡易診断スマホとパソコンの表示速度と、遅い主な原因専門知識がなくても、まず現状をつかみたいとき
  1. PageSpeed Insights を開き、調べたいページの URL を入力して分析する
  2. 携帯電話(スマホ)の結果を先に見る:スマホは通信や端末の性能が低い条件で測るため、パソコンより点数が低く出るのが一般的です。
  3. 上部に表示される実際の利用者のデータで、Core Web Vitals の合否を確認する
  4. 下部に表示される改善の候補で、時間がかかっている原因を確認する:画像、フォント、JavaScript など、何が遅いかの候補と、短縮できる時間の目安が表示されます。
  5. トップページだけでなく、記事・サービス・お問い合わせなど種類の違うページも測る:同じテンプレートのページは同じ原因で遅いことが多いためです。

Chrome のデベロッパーツールは、Windows では F12 キー(または Ctrl+Shift+I)、Mac では Command+Option+I で開けます。なお、以前は Google の「Test My Site」やモバイル フレンドリー テストが紹介されることがありましたが、Test My Site は現在使えず、モバイル フレンドリー テストは2023年12月に提供が終了しています。現在は PageSpeed Insights と Lighthouse で確認します。URL を入力するだけで速度と主な原因を知りたい場合は、当社の無料簡易診断もお使いいただけます。

表示速度が遅くなる主な原因

中小企業のサイトで表示速度が遅い原因は、多くの場合、大きすぎる画像、読み込むフォントやスクリプトの多さ、サーバーの応答の遅さのいずれかです。

原因主に悪くなる指標よくある例
画像が大きい・多いLCPスマホやカメラで撮った写真をそのまま掲載している、トップのスライダーに大きな画像を何枚も入れている
Webフォントが重いLCP・CLS日本語フォントを複数の太さで読み込んでいる、読み込みが終わるまで文字が表示されない
JavaScript・外部タグが多いINP・LCP使っていないプラグイン、複数の計測タグ・広告タグ・チャットツールが全ページで動いている
サーバーの応答が遅いLCP(TTFB)アクセスに対して性能の低いプラン、キャッシュが効いていない、古い PHP のまま
表示の場所が確保されていないCLS画像の縦横のサイズを指定していない、後から読み込まれるバナーやお知らせ欄が本文を押し下げる

表示速度の改善方法

表示速度の改善は、効果が大きく費用のかからない画像の最適化から始め、フォント・スクリプトの整理、キャッシュとサーバーの見直しの順に進めます。

画像を最適化する

画像は、表示する大きさに合わせて縮小し、圧縮してから掲載します。JPEG や PNG より容量が小さくなる WebP や AVIF の形式も、現在の主要なブラウザで表示できます。画面の下の方にある画像は、見える位置に来てから読み込む「遅延読み込み」にします。ただし、ページを開いてすぐに見える一番大きな画像(多くの場合 LCP の対象)には遅延読み込みをかけず、早く読み込まれるように指定します。画像の扱い方は企業ホームページに必要なイメージ素材と活用の注意点でも解説しています。

Webフォントを絞る

日本語のフォントはファイルが大きいため、使う書体と太さを必要なものに絞ります。読み込みが終わる前は端末にある文字で表示しておく設定にすると、文字が表示されない時間をなくせます。デザインの印象を保ちながら軽くする方法は、制作会社と相談して決めます。

不要なプラグインとタグを整理する

使っていない WordPress のプラグインや、目的の分からない計測タグ・広告タグは削除します。タグは Google タグマネージャーでまとめて管理すると、どのタグがどのページで動いているかを把握しやすくなります(Google タグマネージャーとは)。チャットや動画の埋め込みは、必要なページだけで読み込むようにします。JavaScript の処理が多いと、操作への反応(INP)が遅くなります。

キャッシュとサーバーを見直す

ブラウザのキャッシュ(一度読み込んだ画像などを訪問者の端末に保存して再利用する仕組み)の有効期限を設定し、WordPress ならページをあらかじめ作っておくページキャッシュを使います。それでもサーバーの応答が遅い場合は、サーバーのプランや会社の見直し、PHP のバージョンの更新を検討します。サーバーの選び方はホームページ制作でのサーバー選びをご覧ください。

レイアウトのずれを防ぐ

画像や動画、広告の枠には、あらかじめ縦横のサイズを指定して表示する場所を確保します。ページの上部に後から表示されるお知らせやバナーは、本文を押し下げない位置に置きます。

HTML・CSS・JavaScript を圧縮する

コードの不要な改行や空白を取り除く圧縮も効果はありますが、テキストのファイルはもともと容量が小さいため、画像やサーバーの改善に比べると効果は限られます。管理しやすさを保つため、圧縮は公開用のファイルだけに自動で行う方法が一般的です。

テーマそのものが重く、部分的な改善では基準に届かない場合は、リニューアルのときに軽い構成で作り直すほうが、結果として費用を抑えられることもあります。当社サイトでも2026年10月に、日本語のWebフォントの読み込みをやめる、計測タグの読み込みを遅らせるなどの見直しを行いました。

AMP は今も必要か

AMP は現在、Google 検索で特別に扱われる仕組みではなくなっており、これから新しく導入する必要はありません。

AMP(Accelerated Mobile Pages)は、スマホでページを速く表示するために、通常のページとは別に制限の多い専用のページを用意する仕組みです。以前は、Google 検索のトップニュース枠に表示されるために AMP が必要とされ、検索結果に雷のマーク(AMP バッジ)も表示されていました。

しかし、2021年6月に始まったページ エクスペリエンスの更新で、トップニュース枠に AMP は不要になり、AMP バッジの表示も終わりました(Google 検索セントラル ブログ)。さらに2026年7月1日からは、Google 検索から AMP ページを開いたときに Google のサーバーに保存された AMP のコピー(AMP キャッシュ)ではなく、発行元のサイトの AMP ページに直接移動する方式に変わり、AMP ページはほかのページと同じように順位が決まると説明されています(Google 検索ドキュメントの更新履歴)。

通常のページを Core Web Vitals の基準まで速くできれば、ページを二重に管理する AMP の負担を負う理由はありません。すでに AMP ページがある場合は、通常のページの速度を確保したうえで、通常のページから AMP ページへのリンク(rel=”amphtml”)を外し、AMP ページの URL を通常のページへリダイレクトするのが Google の案内する手順です。AMP ページの中身だけを消すことは避けます。

制作・リニューアルのときに発注者が確認したいこと

表示速度は公開後に直すより、制作の段階で目標と計測方法を決めておくほうが、費用も手間も少なく済みます。

  • 目標を要件に書く:「主要ページで Core Web Vitals が良好」「スマホの PageSpeed Insights で目標の点数」のように、確かめられる形で決めます。
  • 公開前に計測してもらう:テスト環境と公開直後に、主要なページの計測結果を共有してもらいます。
  • 画像の掲載ルールを決める:社内で写真を差し替えるときの大きさや形式、自動で圧縮される仕組みがあるかを確認します。
  • プラグインとタグの方針を決める:追加するときの判断基準と、タグの管理方法(タグマネージャーなど)を決めます。
  • 公開後も定期的に確認する:記事やタグが増えると遅くなるため、月に一度は Search Console で推移を確認します。WordPress やプラグインの更新を止めないことも、速度とセキュリティの両方に関わります。

よくあるご質問

PageSpeed Insights では何点を目指せばよいですか?

90点以上が「良好」の目安ですが、点数そのものより、実際の利用者のデータで Core Web Vitals の3指標が「良好」になっているかを優先します。Google も、検索のために完璧な点数を追いかける必要はないとしています。スマホで点数が低い場合は、表示される改善候補のうち効果の大きいものから直します。

測るたびに点数が変わるのはなぜですか?

点数は1回ごとの読み込みを測ったラボデータのため、測ったときの通信やサーバーの状態、表示される広告や外部のタグによって変わります。数回測って傾向を見るか、過去28日間の実測データで判断します。

表示速度を改善すれば検索順位は上がりますか?

表示速度だけで順位が大きく上がるとは限りません。Google は、検索した内容への関連性を優先し、表示速度などのページ エクスペリエンスは、役に立つページが多く競合しているときに差になるとしています。ただし、遅いページは訪問者が離れやすいため、問い合わせを増やすためには改善する価値があります。

スマホとパソコンで点数が違うのはなぜですか?

PageSpeed Insights のスマホの計測は、通信速度や端末の処理能力が低い条件を想定して行うため、パソコンより点数が低く出るのが一般的です。スマホから見る人が多いサイトでは、スマホの結果を基準に改善します。

AMP を導入したほうが速くなりますか?

AMP は現在、Google 検索で特別な表示や優遇を受ける仕組みではなく、新しく導入する必要はありません。通常のページの画像やスクリプトを見直して速くするほうが、管理の手間も少なく済みます。

まとめ

Webサイトの表示速度は、Core Web Vitals の LCP(2.5秒以下)・INP(200ミリ秒以下)・CLS(0.1以下)を満たしているかで判断します。PageSpeed Insights の点数は原因を探す目安として使い、合否は実際の利用者のデータで確認します。改善は画像の最適化から始め、フォント・プラグイン・タグの整理、キャッシュとサーバーの見直しの順に進めます。AMP は現在 Google 検索で特別に扱われる仕組みではないため、通常のページを速くすることに集中します。

当社のWEBサイト運用保守・集客改善では、Core Web Vitals の計測と、画像の軽量化・遅延読み込み・キャッシュ設定などの改善を、他社で制作した WordPress サイトにも行っています。

関連記事:スマホサイトの最適なサイズとパソコンサイトとの違い/Search Console の活用法/WordPress を更新しないとどうなるか

フェニックスデザイン株式会社WEB制作会社が運営するナレッジベース編集部

コーポレートサイト・採用サイト・サービスサイトの制作と、公開後の運用保守・集客改善の現場で得た知見をもとに、発注する側の視点で記事を制作・更新しています。運営会社の所在地・事業内容は会社案内、制作の考え方はブランディング×マーケティング論をご覧ください。

この記事は 2022年4月18日 に公開し、2026年10月23日 に内容を確認・更新しました。