【Quick Answer】ホームページの表示速度を改善するには
> ホームページの表示速度改善で最も効果が大きいのは、①画像のWebP変換(50〜80%軽量化)、②ブラウザキャッシュの設定、③不要なJavaScriptの削除の3つです。Googleの調査では、表示が3秒から5秒に遅くなるだけで直帰率が90%増加します。まずは無料ツールで現在のスコアを計測し、スコアが50未満なら早急な改善が必要です。
なぜ表示速度が重要なのか?数字で見るインパクト
ホームページの表示速度とは、ユーザーがURLにアクセスしてからページが完全に表示されるまでの時間のことです。 この数値はSEO順位・離脱率・コンバージョン率に直接影響します。
表示速度がビジネスに直結するデータ:
- Googleの調査によると、ページの表示が3秒から5秒に遅くなるだけで直帰率が90%増加します
- Amazonは表示速度が0.1秒遅れるごとに売上が1%減少すると報告しています
- Akamaiの調査では、表示速度が1秒遅くなるごとにコンバージョン率が7%低下します
- モバイルユーザーの53%は3秒以上かかるサイトを離脱します(Google調べ)
表示速度が遅くなる7つの原因
1. 画像ファイルが大きすぎる
スマートフォンで撮影した写真は4〜8MBになることも多く、未圧縮のままアップロードすると1枚でページ全体の読み込みを2〜3秒遅延させることがあります。多くの中小企業サイトでこれが最大の原因となっています。
2. JavaScript・CSSが多すぎる
Googleアナリティクスやチャットウィジェットなどのサードパーティスクリプトが500ms〜2秒の遅延を追加することがあります。また、レンダリングをブロックするCSSが最初の描画を妨げる場合も多いです。
3. サーバー応答時間(TTFB)が遅い
共用レンタルサーバーの典型的なTTFBは800ms〜2秒です。目標は200ms以下で、VPS・クラウドサーバーへの移行で大幅に改善できます。
4. ブラウザキャッシュが未設定
キャッシュ未設定の場合、毎回のアクセスで全リソースを再ダウンロードします。適切な設定を行えば、2回目以降の訪問では1秒以下で読み込めるようになります。
5. Webフォントの読み込み問題
Google FontsがレンダリングをブロックするFOUT(スタイルなしテキストの点滅)やFOIT(テキスト非表示)を引き起こすことがあります。日本語フォント(Noto Sans JP)はフルセットで2〜5MBにもなります。
6. WordPressプラグインの過剰使用
プラグインが20個以上ある場合、それぞれがデータベースクエリを追加するため、1〜3秒の追加遅延が発生します。10個程度に絞るだけで大きな効果があります。
7. CDNを使っていない
CDN(コンテンツデリバリーネットワーク)を使わない場合、サーバーから離れた地域のユーザーは高いレイテンシを経験します。特に海外ユーザーがいる場合、米国サーバーからのRTTは200〜400msに達します。
表示速度を計測する方法(無料ツール3選+1)
1. PageSpeed Insights(Google公式)
URLを入力するだけでモバイル・PCそれぞれのスコアを0〜100で表示します。スコアの目安: 90点以上=高速、50〜89点=改善が必要、50点未満=緊急対応。権威あるGoogleの公式ツールですが、英語のみで専門用語が多く、初心者には改善方法がわかりにくいのが欠点です。
2. GTmetrix
ウォーターフォールチャートで何が遅いかを正確に特定できます。東京サーバーからのテストも可能で、詳細な分析が得られます。ただし英語のみで、SSL・リンクチェックは含まれません。
3. Lighthouse(Chrome DevTools)
Chromeブラウザに内蔵されており、5カテゴリのスコアリングが可能です。無料で常に利用できますが、エンジニア向けで初心者には操作が難しいです。
4. AIテスト番人(日本語で結果がわかる)
URLを入力するだけでCore Web Vitals・SSL・リンク切れを日本語でレポートします。定期監視+LINE通知でスコア低下を即座に検知。PageSpeed Insightsの結果が英語で読めない方でも、AIテスト番人なら日本語で改善点が一目でわかります。
他ツールとの詳しい比較はサイト診断ツール徹底比較をご覧ください。
ツール比較表:
| ツール | 言語 | CWV | SSL確認 | リンク確認 | 定期監視 | LINE通知 | 料金 |
|---|---|---|---|---|---|---|---|
| PageSpeed Insights | 英語 | ✅ | ❌ | ❌ | ❌ | ❌ | 無料 |
| GTmetrix | 英語 | ✅ | ❌ | ❌ | 有料のみ | ❌ | 無料/有料 |
| Lighthouse | 英語 | ✅ | ❌ | ❌ | ❌ | ❌ | 無料 |
| AIテスト番人 | 日本語 | ✅ | ✅ | ✅ | ✅ | ✅ | 無料/¥980 |
ホームページの表示速度を改善する10の方法
方法1: 画像をWebP/AVIF形式に変換する
効果: ファイルサイズ50〜80%削減。3MBのJPEG→WebP変換で600KB(80%削減)になり、LCPが1〜2秒改善するケースも多いです。方法: Squoosh(無料オンラインツール)を使うか、WordPressならShortPixelプラグインで一括変換できます。
方法2: 画像の遅延読み込み(Lazy Loading)を設定する
ファーストビュー以外の画像は後から読み込むことで初期表示を高速化します。タグにloading="lazy"属性を追加するだけで実装できます。WordPressはバージョン5.5以降でネイティブ対応しており、WP Rocketプラグインでも簡単に設定できます。
方法3: ブラウザキャッシュを有効にする
2回目以降のアクセスを劇的に高速化し、リピーターの表示速度を50〜70%改善します。.htaccessまたはNginxの設定ファイルにキャッシュヘッダーを追加します。WordPressではWP Super CacheやW3 Total Cacheプラグインで簡単に設定できます。
方法4: 不要なJavaScriptを削除・遅延読み込みする
Chrome DevToolsのCoverageタブで未使用JSを特定できます。使っていないチャットウィジェットやSNSボタンのスクリプトが500ms〜1秒の遅延を加えている例は多いです。タグにdeferまたはasync属性を追加することで読み込みを非同期化できます。
方法5: CSSを最適化する
PurgeCSSで未使用CSSを削除し、クリティカルCSSをインライン化します。残りのCSSは遅延読み込みに切り替え、ミニファイ化で2〜5%の追加削減が可能です。
方法6: サーバー応答時間を短縮する
共用サーバーからVPS・クラウドサーバーへ移行することで、TTFBが800msから200ms以下に改善した事例があります。Redis・Memcachedなどのサーバーサイドキャッシュの導入も効果的です。
方法7: CDNを導入する
Cloudflare(無料プランあり)やAWS CloudFrontを導入することで、日本国内ユーザーにも平均20〜40%の高速化効果があります。Cloudflareは無料プランでも十分な効果が得られます。
方法8: Webフォントを最適化する
font-display: swapを設定してレンダリングブロックを防ぎます。日本語フォントはサブセット化により、Noto Sans JPのフルセット(5MB)を200KB以下に削減できます。使用する文字セットを限定するだけで大幅な軽量化が可能です。
方法9: WordPress固有の最適化
キャッシュプラグイン(WP Super Cache・W3 Total Cache:無料、WP Rocket:有料)の導入、WP-Optimizeでのデータベース最適化、PHP 8.1以上へのアップグレード(PHP 7.4比で30〜40%高速化)が効果的です。プラグイン数を20個から10個に減らすだけでTTFBが40%改善した事例もあります。
方法10: HTTP/2とGzip/Brotli圧縮を有効にする
ほとんどのレンタルサーバーでGzip圧縮は管理画面から1クリックで有効化できます。Gzip・Brotli圧縮でHTML・CSS・JSファイルを60〜80%軽量化できます。HTTP/2への対応状況はブラウザのDevToolsで確認できます。
改善前後のビフォーアフター事例
事例1: 飲食店サイト(WordPress)
| 指標 | 改善前 | 改善後 | 変化 |
|---|---|---|---|
| PageSpeedスコア(モバイル) | 32点 | 78点 | +46点 |
| LCP | 5.2秒 | 1.8秒 | -65% |
| ページ総サイズ | 8.4MB | 1.2MB | -86% |
| 主な施策: 画像WebP変換、キャッシュプラグイン導入、フォントサブセット化 |
事例2: 中小企業コーポレートサイト
| 指標 | 改善前 | 改善後 | 変化 |
|---|---|---|---|
| PageSpeedスコア(モバイル) | 45点 | 91点 | +46点 |
| LCP | 3.8秒 | 1.2秒 | -68% |
| INP | 380ms | 120ms | -68% |
| 主な施策: 未使用JS削除、CDN設定、サーバー移行 |
改善の優先順位チェックリスト
まず現在のスコアを計測し、スコアに応じて取り組む施策を選びましょう。AIテスト番人またはPageSpeed Insightsで無料計測できます。
1. ☐ PageSpeed InsightsまたはAIテスト番人でスコア計測 2. ☐ スコアが50未満 → 画像最適化(方法1・2)から着手 3. ☐ スコアが50〜70 → キャッシュ・JS最適化(方法3・4・5) 4. ☐ スコアが70〜90 → サーバー・CDN強化(方法6・7) 5. ☐ スコアが90以上 → 定期監視で維持(LINEサイト監視を活用)
また、リンク切れがSEOに与える悪影響についてはリンク切れSEO影響の解説記事、SSL証明書の設定についてはSSL証明書グレード確認方法もあわせてご確認ください。
よくある質問(FAQ)
Q1. 表示速度のスコアは何点を目指すべきですか?
Google PageSpeed Insightsで90点以上が「高速」の基準です。まずはモバイルで70点以上を目標に、段階的に改善していくのがおすすめです。モバイルスコアはPCスコアより低くなる傾向があるため、モバイルを優先して改善しましょう。
Q2. WordPressサイトの表示速度が特に遅いのはなぜですか?
WordPressは動的CMSのため、ページアクセスのたびにPHPが実行されデータベースに問い合わせます。プラグインが20個以上あると、それぞれがクエリを追加するため顕著に遅くなります。キャッシュプラグインの導入とプラグイン数の見直しが最も効果的な対策です。
Q3. 表示速度改善の効果はどれくらいで出ますか?
画像圧縮やキャッシュ設定は即座に効果が出ます。Google Search Consoleへの反映には28日程度かかることがあります。改善後はAIテスト番人で定期計測し、スコアの推移を継続的に監視するのがおすすめです。
Q4. 無料でできる改善方法はありますか?
はい。画像のWebP変換(Squoosh)、ブラウザキャッシュ設定、不要なJS削除、Cloudflare CDN(無料プラン)など、費用ゼロで大きな改善効果が得られます。AIテスト番人の無料プランで計測→改善→再計測のサイクルを回せます。
Q5. 表示速度とSEOの関係は?
GoogleはCore Web Vitals(表示速度含む)を検索ランキング要因として公式に採用しています。同等のコンテンツ品質であれば、表示速度の速いサイトが上位に表示されます。詳しくはCore Web Vitalsとは?完全解説をご覧ください。
まとめ — まずはスコア計測から始めましょう
- 画像最適化・キャッシュ・JS整理の3つで改善効果の80%が得られます
- 現在のスコアを知ることが改善の第一歩です
- 無料ツールで計測→原因特定→施策実施の順で進めましょう