サイト速度改善はどこを見ればいい?

サイト速度改善はどこを見ればいい?

Q:サイト速度改善はどこを見ればいい?

A:サイト速度改善はユーザー体験に影響するポイントを総合的に確認する

サイト速度改善では、単純に「PageSpeedの点数」だけを見るのではなく、ユーザー体験に影響するポイントを総合的に確認することが重要です。

特に確認すべきなのは、Core Web Vitals(LCP・INP・CLS)、画像容量、JavaScript・CSSの重さ、サーバー応答速度(TTFB)、スマホ表示速度、外部タグ数などです。

また、表示速度だけでなく、離脱率やCVRへの影響も合わせて確認することで、本当に成果につながる改善ができます。

まずはPageSpeed InsightsやChrome DevToolsを使い、「どこが遅い原因なのか」を可視化することが重要です。

PageSpeed Insightsで見るべきポイント

モバイルスコアを確認する

PageSpeed Insightsでは、PCよりもモバイルスコアを優先的に確認することが重要です。

現在はスマホユーザー中心のサイトが多く、Googleもモバイルファーストインデックスを採用しています。

PCで問題なく表示されても、スマホでは通信速度や端末性能の影響で表示が遅くなるケースがあります。

特に画像容量・JavaScript・広告タグの影響を受けやすく、離脱率やCVR低下につながります。

まずはモバイルスコアを確認し、改善優先順位を決めることが重要です。

「改善できる項目」を確認する

PageSpeed Insightsでは、「改善できる項目」が自動表示されます。

ここでは、画像圧縮不足、未使用JavaScript、CSS最適化不足、サーバー応答遅延など、具体的な問題点を確認できます。

単純な点数だけでなく、「何が原因で遅いのか」を把握できる点が重要です。

また、改善効果が高い項目から優先的に並ぶため、初心者でも対応優先度を判断しやすくなっています。

改善項目を定期的に確認し、継続的に最適化を行うことが重要です。

サーバー応答速度を見る

PageSpeed Insightsでは、TTFB(Time To First Byte)などのサーバー応答速度も確認できます。

サーバー応答が遅いと、ブラウザが最初のデータを受け取るまでに時間がかかり、ページ全体の表示開始が遅れます。

画像やコードを最適化しても、サーバー性能が低いと十分な改善効果が出ないケースがあります。

共用サーバー利用やアクセス集中が原因の場合もあるため、サーバー環境見直しは重要です。特にECサイトや広告LPでは大きな影響があります。

未使用JavaScript・CSSを確認する

PageSpeed Insightsでは、「未使用JavaScript」「未使用CSS」も指摘されます。

これは実際には使っていないコードが大量に読み込まれている状態を意味し、無駄な通信量やブラウザ処理負荷を発生させています。

特にWordPressテーマやプラグイン導入が多いサイトで起きやすい問題です。

不要コードを削除することで、ファーストビュー表示速度やスマホ表示速度改善につながります。

まずは使用していないファイルを整理することが重要です。

画像最適化指摘を確認する

PageSpeed Insightsでは、「次世代フォーマットで配信」「適切なサイズ設定」など、画像最適化に関する改善提案が表示されます。

画像はサイト速度低下原因として最も多いため、必ず確認すべきポイントです。

特にWebP未対応、大容量画像利用、ファーストビュー画像肥大化は大きな問題になります。

画像を圧縮・リサイズ・WebP化するだけで、表示速度が大きく改善するケースもあります。

まずは画像関連指摘から改善すると効果が出やすいです。

Chrome DevToolsで見るべきポイント

Networkタブで重いファイルを確認する

Chrome DevToolsのNetworkタブでは、どのファイルが重いのかを確認できます。画像・JavaScript・CSS・動画などの容量が一覧表示されるため、表示速度低下の原因特定に役立ちます。特にサイズが大きいファイルや読み込み時間が長いファイルは優先改善対象です。また、不要なファイルが大量に読み込まれているケースも発見できます。まずは容量順に並べ替え、「何が重いのか」を把握することが重要です。

読み込み時間が長い通信を確認する

Networkタブでは、各ファイルの読み込み時間も確認できます。

サイズが小さくても、外部サーバーとの通信遅延によって表示速度低下が発生するケースがあります。

特に広告タグ、SNS埋め込み、外部フォントなどは遅延原因になりやすいです。

読み込み時間が長い通信を確認し、不要な外部接続を削減することで、表示速度改善につながります。

通信時間分析は「なぜ遅いのか」を把握する重要なポイントです。

JavaScript実行時間を確認する

JavaScriptは読み込みだけでなく、実行処理時間も表示速度へ影響します。

Chrome DevToolsでは、どのスクリプトが長時間CPUを使用しているか確認できます。特に重いアニメーション、広告タグ、外部ライブラリが原因になるケースが多くあります。

JavaScript処理が長いと、スクロールやタップ操作が重くなり、ユーザー体験悪化につながります。

不要処理削除や遅延読み込み設定を行うことで、操作性改善につながります。

外部タグの通信を確認する

Chrome DevToolsでは、Google広告、SNS、ヒートマップなど外部タグ通信も確認できます。

外部タグはサーバー応答待ちが発生しやすく、表示速度低下原因になりやすいです。

特にタグ数が多いサイトでは、ユーザーがコンテンツを見る前に大量通信が行われるケースがあります。

不要タグ削除や発火条件見直しを行うことで改善可能です。広告運用歴が長いサイトほど、不要タグが蓄積されているケースがあります。

サイト速度改善に役立つおすすめ情報

記事を書いた人

井上寛生

井上寛生

LandingHub 執行役員 / 事業責任者 / 技術責任者

大学院では情報工学を専攻し、修了後に株式会社TeNへ新卒入社。当時は社内唯一のエンジニアながら、開発部門をゼロから立ち上げ、採用・育成を一手に担い、全員が未経験からスタートした精鋭エンジニアチームを組成。2021 年にはWEBサイト高速化プラットフォーム「LandingHub」を立ち上げ、プロダクトオーナー兼事業責任者として企画・開発・グロースを牽引。現在は執行役員として、会社の技術戦略と事業成長の双方をリードしている。
コラム一覧に戻る