- 画像が重いことがサイトに与える影響
- Webで使う画像の適正サイズとファイル形式
- 無料でできる画像圧縮の方法とツール
- WordPressで画像を自動最適化する方法
- よくある失敗パターンと対処法
画像が重いと何が起きるのか
読み込みに3秒以上かかると
約53%のユーザーが離脱
表示速度が1秒遅くなると
コンバージョン率が約7%低下
Googleの評価指標に
表示速度が含まれる
Webページが重くなる原因の多くは画像です。スマートフォンで撮影した写真は1枚あたり3〜8MBあることも珍しくなく、それをそのままWordPressにアップロードしているケースが非常に多く見られます。適切に圧縮すれば100〜300KB程度に抑えられ、体感速度が大幅に改善します。
Webに使う画像の適正サイズ
| 用途 | 推奨サイズ(横幅) | 目標ファイルサイズ |
|---|---|---|
| トップページのメインビジュアル | 1920px以下 | 200〜400KB |
| ブログのアイキャッチ画像 | 1200px以下 | 100〜200KB |
| コンテンツ内の写真 | 800〜1000px | 80〜150KB |
| サムネイル・アイコン | 200〜400px | 30KB以下 |
| ロゴ(透過PNG) | 400〜600px | 50KB以下 |
ファイル形式の選び方
写真やグラデーションを含む画像に向いています。圧縮率が高く、ファイルサイズを小さくしやすいです。透過(透明背景)は非対応。
透明背景が必要なロゴやアイコンに向いています。ファイルサイズはJPEGより大きくなりがち。写真にはあまり向きません。
Googleが開発した次世代画像形式。同等の画質でJPEGより大幅に軽くなります。主要ブラウザはすべて対応済み。WordPressも標準対応しています。
拡大しても画質が劣化しないベクター形式。ロゴやシンプルなイラストに最適で、ファイルサイズも非常に小さいです。
今すぐできる!無料の画像圧縮方法
Googleが提供するブラウザ上で動く無料ツール(squoosh.app)。インストール不要でドラッグ&ドロップするだけ。左右のスライダーで圧縮前後を比較しながら調整できます。WebP形式への変換も可能で、ほとんどのケースでこれ一つで対応できます。
URL(tinypng.com)にアクセスして画像をドロップするだけで自動圧縮されます。一度に複数ファイルを処理できて便利。無料版は1ファイル5MBまで、月20枚まで対応。PNG・JPEGどちらも対応しています。
EWWW Image Optimizer や Smush などのプラグインを使うと、アップロード時に自動で圧縮・WebP変換してくれます。既存の画像をまとめて最適化する機能もあるため、サイト全体をまとめて改善したいときに有効です。
圧縮後のファイルをWordPressにアップする前に、ファイルサイズ(KB・MB)を確認しましょう。1MB以上のファイルは要注意。写真なら200KB以内、アイキャッチなら150KB以内を目安にすると安心です。
よくある失敗パターンと対処法
| 正しい対応 ◎ | よくある失敗 ✕ |
|---|---|
| アップロード前にSquooshで圧縮する | スマホで撮った3〜8MBの写真をそのままアップする |
| 横幅1200px以内にリサイズしてから使う | 4000×3000pxの高解像度写真をそのまま使う |
| ロゴはSVGかPNG透過で用意する | ロゴをJPEGで保存して白背景が残る |
| WebP形式に変換してファイルサイズを削減する | 古いPNGファイルを何年も使い続ける |
| PageSpeed Insightsで定期的にスコアを確認する | サイトが重くなっていても気づかない |
WordPressの「メディア設定」も確認しよう
WordPressには、アップロードした画像を自動でリサイズする機能があります。管理画面の「設定」→「メディア」から、サムネイル・中サイズ・大サイズそれぞれの上限ピクセルを設定できます。初期設定のままでは大きすぎる場合があるため、サイトのレイアウトに合わせて見直しておくと、自動生成される画像サイズを適切にコントロールできます。








