このような悩みを解決します。
こんにちは、セイタです。
ブログの「ページスピード(表示速度)」は、記事の執筆やデザインに比べると後回しにされがちですが、検索結果で上位表示(SEO対策)を目指す上で絶対に避けては通れない重要項目です。
表示に3秒以上かかるサイトは、ユーザーの半数以上が直帰(離脱)してしまうというGoogleのデータもあります。特に作りたてのブログは、検索エンジンからの評価を上げるためにスピード改善が必須です。
システムエンジニアとして働きながらブログを7年間運営しているぼくの経験上、[cite: 1]「なんとなく遅い」を解決するには、専用のツールを使って『遅い原因(ボトルネック)』を正確に特定することが一番の近道です。
本記事では、サイトの表示速度を改善するために必須となる3つの計測ツールと、意外な「サイトが重くなる原因」について徹底解説します。
本記事の内容
- サイトの表示速度を計測する3つの必須ツール
- ツールの特徴と具体的な活用方法
- 盲点になりがちな「ブログが重くなる5つの原因と対策」
サイトの表示速度は3つのツールで改善しよう!
ぼくが普段のブログ運営やシステム構築で実際に使用しているページスピード計測サイトを3つ紹介します。
それぞれのツールで「得意な分析領域」が異なるため、組み合わせて活用することで早期解決が可能になります。
①:PageSpeed Insights(ページスピードインサイト)
「PageSpeed Insights」は、Googleが公式に提供している最も定番のページスピード計測サイトです。無料で誰でも利用できます。
Googleのアルゴリズムに基づいた「100点満点でのスコア」が算出されるため、現在のSEO評価の目安を知るのに最適です。
ただし、「レンダリングを妨げるリソースの除外」など、指摘される専門用語がやや難解なため、これ単体で原因を特定して素人が改善していくのは少しハードルが高いツールでもあります。
②:GTmetrix(ジーティーメトリックス)
「GTmetrix」は、PageSpeed Insightsと並んで世界的に有名な計測ツールです。サイト表記が英語のため敬遠されがちですが、エンジニア視点ではこちらの方が重宝します。
なぜなら、GTmetrixのほうが「具体的にどの画像が重いのか」「どのプラグインの読み込みに時間がかかっているのか」を視覚的に(ウォーターフォール図などで)特定しやすいからです。
通常はPCからの計測になりますが、無料の会員登録を行うことで「モバイル端末」や「通信環境(3G/4G)」をシミュレートした計測も可能になります。PageSpeed Insightsと併用して具体的な改善箇所を探るためのメインツールです。
③:Lighthouse(Chrome拡張機能・デベロッパーツール)
以前は「Think with Google」というツールが重宝されていましたが、現在はGoogle Chromeに標準搭載されている「Lighthouse」を使うのが主流です。
Chromeブラウザで自分のブログを開き、右クリックから「検証(デベロッパーツール)」を開き、「Lighthouse」タブからボタン1つで計測できます。
非公開のテスト環境や、ログイン済みの画面でもそのまま計測できるため、いちいちURLをコピペする手間がなく、作業中に最も手軽にスピードを測れる強力なツールです。
遅い原因は意外な所に!ページスピードのネックとなる5つの要素
ここからは、ぼくの長年の経験上、ページスピードが遅くなる「リアルな原因」となりやすいものを紹介します。
意外と盲点になっている部分も多いので、あなたのブログと照らし合わせてみてください。
①:Google AdSense(自動広告の過剰な配置)
これはブログ初心者にとって一番の盲点かもしれません。
Google AdSenseは収益化の要ですが、アドセンスの広告スクリプトは外部サーバーから毎回読み込むため、表示速度を著しく低下させる最大の原因になります。
特に「自動広告」をオンにしてトップページからサイドバー、記事内にまで無数に広告を表示させていると、サイトスピードは絶望的に遅くなります。
対策ポイント
SEOを意識して検索流入を伸ばしたいなら、トップページやサイドバーの広告は外し、クリック率の高い「記事中の特定の場所」のみに手動で広告を絞るのがベストです。
表示速度が上がることでGoogleからの評価(順位)が上がり、結果的にアクセス母数が増えて収益が伸びます。
②:プラグインの入れすぎ(特に関係ないものも)
「プラグインを入れるとサイトが重くなる」とよく言われますが、すべてのプラグインが悪いわけではありません。
ぼくが過去に検証して明らかに低速の原因となっていたのは、多機能すぎる「Jetpack」や、古いキャッシュ系プラグインが競合しているケースでした。
また、WordPressテーマ(AFFINGER7など)に標準搭載されている機能(目次作成や吹き出し機能)を、わざわざ重いプラグインで代用している場合も無駄な負荷がかかります。「使っていないプラグインは削除する」という基本を徹底しましょう。
③:画像の最適化(圧縮・WebP化)不足
ページ容量の半分以上を占めるのが「画像」です。スマホで撮影した数MBの写真をそのままアップロードしていると、ページスピードは間違いなく赤点になります。
画像最適化の基本
- アップロード前に「TinyPNG」などで圧縮して容量を削る
- 可能であれば、JPEGやPNGよりも軽い「WebP(ウェッピー)」形式に変換する
- Lazy Load(画像の遅延読み込み)を有効にする
最近のWordPressは標準で遅延読み込みに対応していますが、元の画像サイズがデカすぎるとどうしようもないので、アップロード前の圧縮は必須の作業です。
④:JavaScriptの読み込み位置(ヘッダーからフッターへ)
テーマのカスタマイズや外部ツール(FontAwesomeなど)を導入する際、JavaScriptの読み込みコード(scriptタグ)をheadタグの中にそのまま追加していませんか?
ヘッダーで重いスクリプトを読み込むと、そこが完了するまで画面が真っ白なまま表示されなくなってしまいます(レンダリングブロック)。
これを回避するには、デザインに直結しないスクリプトの読み込み位置を、できるだけフッター(/bodyの直前)に移動させるか、非同期(async/defer)で読み込ませるのが鉄則です。
⑤:CSS・JSの縮小(圧縮)エラー
PageSpeed Insightsで必ず指摘されるのが「CSS / JavaScript の最小化」です。
これは「Autoptimize」などのキャッシュ・最適化プラグインを導入することで簡単に対処可能ですが、やりすぎるとサイトのレイアウトが崩れたり、機能が動かなくなったりする弊害が出やすい部分でもあります。
そのため、「プラグインで1つ設定をオンにしたら、必ずスマホとPCの実機でレイアウトが崩れていないか確認する」という地道な作業を繰り返して、安全なラインを見極めるのがベストです。
まとめ:原因となっている部分をピンポイントで改善しよう
ページスピードの改善は、システムエンジニアから見てもサイト運営に慣れていないと骨の折れる作業です。
そのため、一度にすべてを100点にしようとするのではなく、なるべく簡単で効果の大きいところ(画像の圧縮や不要なアドセンスの削除)から改善させていくことが大切です。
スピード改善のステップ
- ①:PageSpeed Insightsで現在のスコアと課題を把握する
- ②:GTmetrixで「一番重い画像やスクリプト」をピンポイントで特定する
- ③:Lighthouseで手軽に改善後の効果測定を行う
なお、これらの複雑なページスピード改善の手間を省く一番の近道は、「最初から表示速度に最適化された有料のWordPressテーマを導入すること」です。
当ブログでも使用している『AFFINGER7』などは、SEOや表示速度のチューニングが最初から施されているため、難しいコードをいじることなく快適なスピードを実現できます。
あわせて読みたい!






