- 表示速度はSEO順位・離脱率・CVRに直結する経営課題であり、GoogleのCore Web Vitals(LCP・INP・CLS)を指標として把握することが出発点になる
- 改善の優先順位は「画像最適化→不要JS削除→キャッシュ設定→サーバー見直し→INP対策」の順が費用対効果の面で合理的
- 一度改善しても新コンテンツやプラグイン追加で速度は低下するため、Search Consoleの通知設定や月次計測など継続的な監視体制を構築することが重要
「3秒で半数が離脱する」――表示速度はなぜ経営課題なのか
Googleの調査によると、モバイルページの読み込みに3秒以上かかると、訪問者の約53%がページを離れてしまいます。これは広告費をかけて集客しても、ページが表示されきる前にユーザーが去っていくことを意味します。表示速度の問題は「技術的なチューニング」の話にとどまらず、マーケティング投資の効率と売上に直結する経営上の優先課題です。
2026年現在、Google検索のランキングアルゴリズムにはCore Web Vitals(CWV)が正式に組み込まれており、速度指標が悪いサイトは検索順位で不利になります。競合他社との差がつきやすい領域だからこそ、基礎から正しく理解することが重要です。
まず押さえたい3つの速度指標――Core Web Vitalsとは
Core Web Vitalsは、Googleがユーザー体験を数値化するために定めた3つの指標です。それぞれが「速さ」の異なる側面を測定します。
① LCP(Largest Contentful Paint)――最大コンテンツの描画時間
ページを開いてから、画面内で最も大きな要素(ヒーロー画像や見出しテキストなど)が表示されるまでの時間です。Googleの推奨値は2.5秒以内。LCPが遅いと「まだ何も表示されない」という印象をユーザーに与え、離脱率が跳ね上がります。
② INP(Interaction to Next Paint)――操作応答性
2024年3月にFID(First Input Delay)に代わって正式採用された指標です。ボタンをクリックしてから画面が反応するまでの遅延を測定します。推奨値は200ミリ秒以内。JavaScriptの処理量が多いサイトで悪化しやすい傾向があります。
③ CLS(Cumulative Layout Shift)――レイアウトのズレ
ページ読み込み中に要素が突然動くことで発生する視覚的なズレを数値化したものです。推奨値は0.1以下。広告枠や遅延読み込みの画像がサイズ指定なしで挿入されていると悪化します。「読もうとしたらテキストが動いた」という経験はまさにCLSです。
原因を知る――表示が遅くなる7つの典型パターン
改善を始める前に、なぜ遅いのかを正確に把握することが不可欠です。闇雲に施策を打っても効果は限定的です。以下が現場でよく見られる原因です。
1. 画像が最適化されていない
JPEGやPNGのまま数MBの画像を使い続けているケースは非常に多いです。WebPやAVIFといった次世代フォーマットへの変換と、適切なサイズへのリサイズが基本対策です。画像は多くのサイトでLCPに直接影響する最大の要因です。
2. レンダリングを妨害するJavaScript/CSSの読み込み
<head>タグ内に多数の外部スクリプトを読み込むと、ブラウザの描画が止まります。スクリプトへのdefer・async属性の付与や、不要なプラグインの削除が有効です。
3. サーバーの応答速度(TTFB)が遅い
ユーザーがURLにアクセスしてからサーバーが最初の1バイトを返すまでの時間(TTFB:Time to First Byte)が長いと、その後の処理がすべて遅延します。共有レンタルサーバーの過負荷や、データベースクエリの非効率が原因になります。
4. キャッシュが設定されていない
ブラウザキャッシュが適切に設定されていないと、毎回すべてのリソースをサーバーから取得します。リピーターが多いサービスサイトほど、キャッシュ設定の効果が大きく現れます。
5. サードパーティスクリプトの過多
チャットツール・広告タグ・ヒートマップ・SNSボタンなど、外部から読み込むスクリプトが積み重なると、自社では制御できない遅延が生じます。本当に必要なものだけに絞ることが重要です。
6. CDN(コンテンツデリバリーネットワーク)を使っていない
CDNを利用すると、ユーザーの地理的位置に近いサーバーからコンテンツを配信できます。日本全国・海外にユーザーが分散しているサービスほど、CDN導入の効果が顕著です。
7. フォントの読み込み方法が非効率
Webフォントを複数ウェイト・複数ファミリー読み込んでいると、テキスト表示が遅れます(FOIT/FOUT)。font-display: swapの設定や、必要なフォントのみのサブセット化が有効です。
計測から始める――使うべき無料ツール3選
「速い・遅い」の感覚論ではなく、数値に基づいて改善することが大切です。以下のツールはいずれも無料で使えます。
① PageSpeed Insights
GoogleのツールでURLを入力するだけでモバイル・PCそれぞれのCWVスコアと改善提案が得られます。「フィールドデータ」(実際のユーザーのデータ)と「ラボデータ」(シミュレーション)の両方を確認しましょう。まず最初にここで現状を把握することをおすすめします。
② Google Search Console(Core Web Vitalsレポート)
自社サイト全体のページをURL単位でCWVが良好/改善が必要/不良に分類して表示します。どのページを優先して直すべきかの判断に役立ちます。サーチコンソールにサイトを登録済みであればすぐに確認できます。
③ WebPageTest
より詳細なウォーターフォールチャートで、どのリソースがどの順序で読み込まれているかを可視化できます。「何が足を引っ張っているか」を深掘りしたいエンジニアや上級担当者に向いています。
優先度の高い改善施策――費用対効果の高い順に着手する
すべての問題を一度に解決しようとすると工数が分散します。以下の順序で着手すると、最小の工数で最大の効果を得やすいです。
ステップ1:画像の最適化(効果★★★ 難易度★☆☆)
ほとんどのサイトでLCPに最も大きく影響するのが画像です。次の3点を確認してください。
- ヒーロー画像・メインビジュアルにWebP/AVIFを使っているか
- 画像に
widthとheight属性を指定してCLS対策をしているか - ファーストビュー外の画像に
loading="lazy"を設定しているか - ファーストビュー内の最大画像に
<link rel="preload">を使っているか
ステップ2:不要なJavaScript・プラグインの削除(効果★★★ 難易度★★☆)
WordPressサイトであれば有効なプラグインを棚卸しし、実際に使っていないものを停止・削除します。Google Tag Managerを使って各タグの必要性を定期的にレビューする運用ルールを作ることも重要です。
ステップ3:ブラウザキャッシュとサーバーキャッシュの設定(効果★★☆ 難易度★★☆)
静的ファイル(画像・CSS・JS)に適切なCache-Controlヘッダーを設定します。WordPressであればキャッシュ専用プラグインが有効ですが、設定が誤っているとコンテンツ更新が反映されないトラブルが起きるため、設定後の動作確認を必ず行ってください。
ステップ4:サーバー・ホスティング環境の見直し(効果★★★ 難易度★★★)
TTFBが500ミリ秒を超えている場合、コンテンツ最適化だけでは改善に限界があります。より高性能なホスティングへの移行やCDN導入を検討するタイミングです。費用はかかりますが、表示速度の底上げ効果は大きく、SEOと離脱率の両面で中長期的なリターンが期待できます。
ステップ5:INP対策としてのJavaScript実行コストの削減(効果★★☆ 難易度★★★)
INPが200ミリ秒を超えている場合、メインスレッドを占有しているJavaScriptの処理を分割(コードスプリッティング)したり、重い処理をWeb Workerに移したりする対応が必要です。フロントエンド開発者との連携が求められる領域です。
改善後の「維持」が重要――継続的な速度監視の仕組みを作る
一度最適化しても、新しいページの追加・プラグインのアップデート・広告タグの追加などで速度は徐々に低下します。改善を単発で終わらせず、継続的なモニタリング体制を作ることが中長期的に重要です。
- Google Search Consoleのメール通知を設定し、CWVが「不良」になったページをアラートで把握する
- 月次でPageSpeed Insightsのスコアを記録し、施策の前後比較を残す
- リニューアル・大規模更新の際は必ず速度計測をリリース前チェックリストに組み込む
よくある誤解と落とし穴
「スコアが100点じゃないとダメ」は誤り
PageSpeed InsightsのスコアはあくまでGoogleの合成環境でのシミュレーションです。実ユーザーのフィールドデータ(CrUX)と乖離することもあります。スコアの数値を目的化するより、実際のユーザー体験が改善しているかを重視してください。
「画像を圧縮しすぎて画質が劣化した」
圧縮率を上げすぎると、製品写真や人物写真で目立った画質劣化が起きます。WebPの品質設定は80〜85程度を基準に、視覚確認しながら調整することを推奨します。
「モバイルスコアが低いのはスマホが非力だから仕方ない」
PageSpeed InsightsのモバイルシミュレーションはMoto G4相当の低速端末と4G回線を想定しています。これは意図的な設計で、「一般ユーザーが使う可能性のある端末でも快適か」を問うものです。モバイルスコアが低い場合、実ユーザーの体験が損なわれている可能性が高く、無視できません。
まとめ――表示速度改善は「一度やって終わり」ではない継続投資
Webサイトの表示速度は、SEO・UX・コンバージョン率・広告効率のすべてに影響する基盤的な品質要素です。2026年現在、Core Web VitalsはGoogleの検索アルゴリズムに組み込まれており、競合サイトとの速度差はそのまま検索順位の差に反映されます。
まずPageSpeed InsightsとSearch Consoleで現状を計測することが最初の一歩です。スコアと改善提案を手元に置いて、画像最適化・不要スクリプトの削除・キャッシュ設定という優先度の高い施策から着手してください。技術的な対応が難しい部分や、サーバー環境の見直しが必要な場合は、専門家への相談が近道です。
表示速度の改善に取り組みたい、あるいは自社サイトの現状診断から始めたいという方は、ぜひお気軽にお問い合わせ・ご相談ください。