# ホームページの表示速度を速くする方法 測り方と改善

> 正式なページ: https://kakuyasuhp.com/column/hyoji-sokudo.html／最終更新: 2026-09-27

運営: 格安HP屋（〒101-0051 東京都千代田区神田神保町3丁目11番6号 神保町ビル10階／050-3109-3399／info@kakuyasuhp.com）

分類: 技術・基礎（テーマ: 機能・AI検索・集客のコツ）／公開: 2026-09-27／更新: 2026-09-27／読む時間の目安: 約12分／執筆: 格安HP屋 編集部

## この記事の結論

表示速度は、まずPageSpeed Insightsで測って、何が遅くしているのかを確かめてから直すのが近道です。目安になるのはGoogleのCore Web Vitalsの3つの指標で、LCPは2.5秒以内、INPは200ミリ秒以下、CLSは0.1以下が「良好」です。よくある原因は画像・プラグイン・サーバー・外部の埋め込みで、画像のように自分で直せるものから手をつけると、効果が見えやすくなります。

## 結論｜表示速度は、まず測って重い原因から直す

ホームページの表示速度は、PageSpeed Insightsで測り、遅くしている原因を大きいものから順に直していくのが、いちばん確実な改善の方法です。

「サイトが重い」と言われても、原因が画像なのか、プラグインなのか、サーバーなのかで、直し方はまったく変わります。やみくもにプラグインを足したり、サーバーを替えたりする前に、次の順で進めてください。

1. 測る：PageSpeed Insightsで、スマートフォン向けの結果を見る。
2. 原因をしぼる：3つの指標のうち、どれが悪いのかで原因の見当がつきます。
3. 自分で直せるものから直す：画像を軽くする、使っていないプラグインを消す、埋め込みを減らす。
4. 作りやサーバーに原因があるなら頼む：制作会社やサーバー会社に、測った結果を見せて相談する。

速さは使いやすさそのものですし、検索とも無関係ではありません。Googleは、ランキングのしくみでCore Web Vitals（ウェブに関する主な指標）を使っていると説明しています。一方で、ページの体験が平均を下回っていても、いちばん関連性の高い内容を表示するよう設計している、とも書いています（[Google 検索セントラルのページ エクスペリエンスの説明](https://developers.google.com/search/docs/appearance/page-experience?hl=ja)）。中身を良くしたうえで、速さで足を引っぱらない、という考え方がちょうどいいと僕らは考えています。検索の基本は[SEOの基礎](https://kakuyasuhp.com/column/seo.html)にまとめています。

![この記事のポイント：速さは測ってから重い原因順に直す／目安はLCP・INP・CLSの3つ／画像を軽くするのが自分でできる近道](https://kakuyasuhp.com/assets/column/hyoji-sokudo-1.jpg)

## 表示速度の目安｜Core Web Vitalsの3つの指標

表示速度の目安は、Googleが示すCore Web Vitalsの3つの指標、LCP・INP・CLSで、それぞれに「良好」の基準があります。

| 指標 | 何を見るか | 良好 | 改善が必要 | 不良 |
|---|---|---|---|---|
| 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.25まで | 0.25を超える |

web.devによると、目安を満たしているかどうかは、モバイルとパソコンに分けて、ページの読み込みの75パーセンタイルで見るのが適切とされています（[web.dev の Web Vitals の説明](https://web.dev/articles/vitals?hl=ja)）。ページが開かれた回数のうち、4回に3回が目安を満たしているか、という見方です。自分のパソコンで速く見えても、回線の遅いスマートフォンで見ている人の多くが待たされていれば、「良好」にはなりません。

なお、操作への反応を見る指標は、2024年3月12日にFID（初回入力遅延）からINPに切り替わっています。少し前の解説でFIDの話が出てきたら、INPに読み替えてください。

## PageSpeed Insightsの見方｜上は実際の利用者、下は試しの測定

PageSpeed Insightsの結果は、上の段が実際の利用者のデータ、下の段が機械で試しに測ったデータで、先に見るべきなのは上の段です。

使い方はかんたんで、[PageSpeed Insights](https://pagespeed.web.dev/)を開いて自社のページのURLを入れるだけです。結果はスマートフォンとパソコンの2つに分かれて出ます。

- 上の段（実際の利用者のデータ）：Chromeの利用者から集めた「Chrome ユーザー エクスペリエンス レポート（CrUX）」の、過去28日間のデータです。LCP・INP・CLSが目安を満たしているかが、ここでわかります。
- 下の段（試しの測定のデータ）：Lighthouseという道具が、決まった端末と回線を想定してページを読み込んだ結果です。0〜100点のスコアと、遅くしている原因の候補、直し方のヒントが並びます。

スコアの色分けは、90以上が良好、50〜89が改善が必要、50未満が不良です。スコアは、LCPやCLS、Total Blocking Time（TBT）などの指標を重み付けして出したもので、INPは入っていません。また、配信される広告やネットワークの状態、ブラウザの拡張機能などで、測るたびに多少ぶれます。1回の点数に一喜一憂せず、何度か測って傾向を見るのがコツです。

見る人が少ないページや公開したばかりのページでは、上の段のデータが足りないことがあります。その場合はサイト全体（オリジン）のデータに切り替わり、それも足りなければ表示されません。アクセスがまだ多くないサイトでは起こりうることなので、その時は下の段の結果と、次の章の原因の表を手がかりにしてください。

サイト全体の傾向は、Search Consoleの「Core Web Vitals」レポートでも見られます。こちらも実際の利用者のデータをもとに、似たページをまとめて「良好」「改善が必要」「低速」に分け、モバイルとパソコン別に表示します。登録と見方は、[Search Consoleの使い方](https://kakuyasuhp.com/column/search-console.html)の記事が参考になるはずです。

## サイトが重い原因｜画像・プラグイン・サーバー・外部の埋め込み

サイトが重くなる原因は、大きく分けると画像、プラグインやスクリプト、サーバー、外部の埋め込みの4つで、どの指標が悪いかで見当がつきます。

| 原因 | 出やすい症状 | 悪くなりやすい指標 | 直し方の方向 |
|---|---|---|---|
| 画像が大きい・形式が古い | 最初の大きな写真がなかなか出ない | LCP | 表示する大きさに合わせて縮め、圧縮する。WebPやAVIFなどの新しい形式にする |
| 画像や埋め込みの大きさが決まっていない | 読み込みの途中で、文字やボタンがずれる | CLS | 画像に幅と高さを指定する。埋め込みや広告の場所をあらかじめ確保する |
| プラグインやスクリプトが多い | タップしても反応が遅い。全体がもたつく | INP・LCP | 使っていないプラグインを止めて消す。読み込むスクリプトを減らす |
| サーバーの応答が遅い | どのページも、最初に真っ白な時間が長い | LCP | キャッシュを使う。サーバーのプランや会社を見直す。PHPを新しくする |
| 外部の埋め込み（動画・地図・SNS・チャットなど） | 埋め込みのあるページだけ重い | LCP・INP・CLS | 数を減らし、下のほうに置く。遅延読み込みや、クリックされるまで軽い画像を見せる形にする |
| Webフォント | 文字が遅れて出る。文字が出た時に行がずれる | LCP・CLS | 使う書体と太さの数をしぼる |

「悪くなりやすい指標」は目安です。PageSpeed Insightsの下の段には、遅くしている原因の候補がページごとに具体的に出るので、この表と見比べながら当たりをつけてください。サーバーの選び方は[レンタルサーバーの選び方](https://kakuyasuhp.com/column/server-erabikata.html)、書体の話は[Webフォントとは](https://kakuyasuhp.com/column/webfont-toha.html)にまとめています。

## 自分でできる改善｜画像・読み込みの順番・プラグインの整理

自分でできる改善で効き目が大きいのは、画像を軽くすること、すぐ見えない画像を後から読み込むこと、使っていないプラグインや埋め込みを減らすことです。

### 1. 画像を軽くする

写真は、表示する大きさに合わせて縮めてから載せます。スマートフォンで撮ったままの写真は、画面に出す大きさよりずっと大きいことが少なくありません。web.devのLCPの改善のすすめでも、画像のサイズを小さくすることと、AVIFやWebPといった新しい画像の形式を使うことがあげられています。WordPressなら、5.8からは、サーバーが対応していればWebPの画像をJPEGやPNGと同じように載せられます。写真の選び方と権利の話は、[ホームページの写真素材](https://kakuyasuhp.com/column/photo-sozai.html)の記事をどうぞ。

### 2. すぐ見えない画像は、あとから読み込む

画面の下のほうにある画像は、loading="lazy" という指定で、スクロールして近づいてから読み込ませることができます（遅延読み込み）。WordPressは5.5から、幅と高さの指定がある画像に、この指定を自動で付けるようになりました（5.9からは、最初に見えると判断した画像には付けないよう、改良が重ねられています）。ただし、ページを開いてすぐ見える大きな写真にまで付けると、かえってLCPが遅くなります。最初に見える画像、特にLCPになる画像は遅延読み込みしない、というのがweb.devのすすめです。あわせて、画像には幅と高さを指定しておくと、読み込みの途中のずれ（CLS）を防げます。

### 3. 使っていないプラグインを止めて消す

WordPressの公式の手引きは、要らないプラグインは止めて削除し、1つずつ止めてみて速さへの影響を測るようすすめています。「昔入れたまま使っていない」「同じ役目のものが2つある」といったプラグインがないか、一覧を見直してみてください。止める前にはバックアップを取り、止めたあとはお問い合わせフォームなどの動きも確かめます。

### 4. 埋め込みを減らす・下に置く

動画や地図、SNSの投稿の埋め込みは便利ですが、web.devは、第三者のコンテンツがレンダリングを止めたり、Core Web Vitalsに響いたりすることがあると説明しています。トップページに何本も並べず、必要なページの下のほうに置く、クリックされるまで軽い画像を見せておく形（ファサード）にする、といった工夫が効果的です。

### 5. キャッシュを使い、PHPを新しくする

WordPressなら、ページを静的なファイルとして保存しておくキャッシュのプラグインで、応答が速くなることがあります。新しいPHPのほうがたいてい性能もよい、というのがWordPressの公式の手引きの説明です。PHPを上げる手順と注意は、[古いWordPressを放置するリスク](https://kakuyasuhp.com/column/wp-furui.html)にまとめました。

## 制作会社に頼む改善｜作りとサーバーから見直す

画像やプラグインを整理しても目安に届かない時は、ページの作りやサーバーに原因があることがあり、制作会社やサーバー会社に頼む改善になります。

- 最初に見える画像を優先して読み込む：LCPになる画像をブラウザが早く見つけられるようにし、fetchpriority="high" で優先度を上げる。web.devのLCPの改善のすすめにもある方法です。
- 表示を止めるCSSやJavaScriptを整理する：読み込む順番を見直し、使っていないものを外す。
- 画像や埋め込みに大きさを指定する：CLSのずれを防ぐ。
- サーバーの応答を速くする：キャッシュの設定、サーバーのプランや会社の見直し、画像の配信にCDN（利用者の近くから届けるしくみ）を使う。
- テーマから作り直す：重いテーマに手直しを重ねるより、作り直したほうが早い場合もある。

頼む時は、PageSpeed Insightsで測ったページのURL、測った日、スマートフォンとパソコンのどちらの結果か、悪かった指標を伝えると話が早くなります。「速くしてほしい」だけだと、どこまでやるのかがあいまいになりがちです。どの指標をどこまで良くするのかを、費用と日数と合わせて確かめておきましょう。作り直すかどうかの目安は、[作り直さずにホームページを直す](https://kakuyasuhp.com/column/bubun-kaishu.html)も参考にしてください。

## スマホでの確かめ方｜モバイルの結果と、自分のスマートフォン

スマートフォンでの速さは、PageSpeed Insightsのモバイルの結果と、自分のスマートフォンで開いた時の体感の両方で確かめます。

1. モバイルの結果を基準にする：Googleがインデックス登録とランキングに使うのも、モバイル版のページの中身です。まずモバイルの結果から見ます。
2. 自分のスマートフォンで、Wi-Fiを切って開く：社内のWi-Fiではなく、外出先に近い条件で見ます。
3. 最初の画面が出るまでを見る：いちばん大きな写真や見出しが、待たずに出るか（LCP）。
4. ボタンやメニューを押してみる：押してすぐ反応するか（INP）。
5. 読み込みの途中でずれないか：読もうとした文字や押そうとしたボタンが動かないか（CLS）。
6. Search Consoleで傾向を見る：「Core Web Vitals」レポートのモバイルで、「低速」や「改善が必要」のページがないか。

スマートフォンでの見やすさそのものは[スマホ対応はなぜ必須か](https://kakuyasuhp.com/column/smartphone.html)に、押しやすさや迷いにくさは[UIとUXの違い](https://kakuyasuhp.com/column/ui-ux.html)の記事にまとめています。

![格安HP屋の制作の流れ：1 無料相談、2 お見積り（税込・追加料金なし）、3 初稿を動くHTMLでパソコンとスマホで確認、4 修正（制作中は回数無制限）、5 公開（納品後30日の無償サポート）](https://kakuyasuhp.com/assets/column/hyoji-sokudo-2.jpg)

## 格安HP屋に頼むと｜スマホ最適化は標準、初稿もスマホで確かめられる

格安HP屋のホームページ制作は、スマホ最適化が標準で入っていて、HP新規制作25万円・リニューアル30万円（税込）の中で、スマートフォンでも見やすく作ります。

SEOの基本（構造化データ（検索エンジンに内容を伝える記述）・サイトマップ（ページの一覧）・OGP（SNSで共有されたときの見え方）・GA4（アクセス解析）の設定）も標準で、ページ数や機能の数で金額は変わらず、追加料金はかかりません。サーバーとドメインは別に実費（年1〜2万円ほど）で、名義はお客様です。なお、検索順位の約束はしていません。

僕らはテンプレートを使わず、一社ずつゼロからオリジナルでデザインします。初稿は画像ではなく、実際に動くHTMLのデザインでお見せするので、この記事の「スマホでの確かめ方」と同じように、ご自身のスマートフォンで開いて、見え方や動きを確かめていただけます。遠方の方も、URLを開くだけです。

今のサイトが重く、作りから直したい時は、HPリニューアル（30万円・税込）で、今のサイトの分析と作り直しの設計、全ページの移行、URLの転送、SEOの引き継ぎまでまとめて行います。作ったあとは、WordPress本体・プラグインの更新や定期バックアップが入った月額2万円（税込）の保守管理プランも選べます（基本は月額0円の都度依頼）。保守管理プランに最低契約期間はなく、必要な時期だけスポットで頼めます。まずは[お問い合わせ](https://kakuyasuhp.com/contact.html)から、気になっているページのURLを送ってください。相談と見積もりは無料です。料金の中身は[料金](https://kakuyasuhp.com/#price)、これまで作ったサイトは[制作事例](https://kakuyasuhp.com/works.html)で見られます。

## まとめ｜測る、原因をしぼる、効くところから直す

表示速度の改善は、PageSpeed Insightsで測り、どの指標が悪いかで原因をしぼって、効き目の大きいところから直していくのが近道です。

- 目安はCore Web Vitalsの3つ。LCPは2.5秒以内、INPは200ミリ秒以下、CLSは0.1以下が「良好」
- PageSpeed Insightsは、上の段の実際の利用者のデータを先に見る。点数は測るたびにぶれるので傾向で
- よくある原因は、画像・プラグイン・サーバー・外部の埋め込み・Webフォント
- 自分でできるのは、画像を軽く、すぐ見えない画像は後から、要らないプラグインと埋め込みを減らすこと
- 作りやサーバーが原因なら、測った結果を添えて頼む。スマートフォンの実機でも確かめる

僕ら格安HP屋は、新規25万円・リニューアル30万円（どちらも税込・追加料金なし）で、テンプレートを使わないオリジナルのデザインを作っています。初稿は動くHTMLで、スマートフォンでも確かめられます。重いサイトの作り直しを考えていたら、[お問い合わせ](https://kakuyasuhp.com/contact.html)からどうぞ。

## よくあるご質問

### Q. PageSpeed Insightsの点数は、何点を目指せばいいですか？

点数より先に、上の段の実際の利用者のデータで、3つの指標が「良好」になっているかを見てください。点数は、Lighthouseが決まった条件で試しに測った結果で、90以上が良好、50〜89が改善が必要、50未満が不良の目安です。広告やネットワークの状態で測るたびに多少ぶれるので、何度か測って傾向で判断しましょう。

### Q. 表示速度は、検索順位にどのくらい影響しますか？

どのくらい影響するかは公表されていません。Googleは、ランキングのしくみでCore Web Vitalsを使っていると説明する一方、ページの体験が平均を下回っていても、いちばん関連性の高い内容を表示するよう設計している、とも書いています。まず中身を良くして、そのうえで速さが足を引っぱらないようにする、という順番が現実的です。

### Q. 「データがありません」と出て、実際の利用者のデータが見られないのはなぜですか？

見る人がまだ少ないページや、公開したばかりのページでは、実際の利用者のデータが足りないことがあります。その場合、PageSpeed Insightsはサイト全体（オリジン）のデータに切り替え、それも足りなければ表示しません。そんな時は、下の段の試しの測定の結果と、自分のスマートフォンで開いた時の体感を手がかりにしてください。

### Q. 速くなるプラグインを入れれば解決しますか？

キャッシュのプラグインのように効くものもありますが、原因が大きな画像や外部の埋め込みなら、それだけでは解決しきれません。プラグインを増やすほど、動かすものも増えます。入れる前に、何が遅くしているのかをPageSpeed Insightsで確かめ、入れたあとは表示が崩れていないか、更新した内容がすぐ反映されるかも見ておきましょう。

### Q. サーバーを替えれば速くなりますか？

サーバーの応答が遅いことが原因なら、効き目があります。どのページも最初に真っ白な時間が長い、PageSpeed Insightsでサーバーの応答の遅さを指摘される、といった時は見直す価値があります。反対に、原因が画像や埋め込みなら、サーバーを替えても大きくは変わりません。先に原因をしぼってから決めましょう。

## あわせて読みたい

- [AI検索に選ばれるホームページ｜ChatGPT・AIによる概要への備え](https://kakuyasuhp.com/column/ai-search.html)
- [llms.txtとは？書き方と中小企業のサイトに必要か](https://kakuyasuhp.com/column/llms-txt.html)
- [お問い合わせフォームの作り方｜項目数と迷惑メール対策](https://kakuyasuhp.com/column/form-tsukurikata.html)