WordPress画像サイズの目安｜アイキャッチ・本文の推奨px・容量
WordPress画像に全サイト共通の正解はありませんが、16:9のアイキャッチは1600×900px・150〜300KB程度、本文の横長画像は横幅1200px前後・100〜250KB程度が実用的な出発点です。最終的には、利用中のテーマの表示幅とトリミング仕様、スマホでの見え方を優先して調整します。
CHECK
迷ったときの実用的な出発点
16:9のアイキャッチは1600×900px、本文の横長画像は横幅1200px前後を出発点にします。ただし、これはEDIT.の運用目安であり、WordPress共通の必須値ではありません。テーマの表示幅とトリミング仕様を優先してください。
WordPress画像の「サイズ」は3種類ある
画像サイズという言葉は、ピクセル数、縦横比、ファイル容量の3つを指すことがあります。表示崩れを防ぎたいならピクセル数と縦横比、表示速度を改善したいならファイル容量を確認します。
- ピクセル数：1600×900pxなど、画像の縦横の細かさ
- 縦横比：16:9や4:3など、画像の形
- ファイル容量：KBやMBで示される、読み込み時のデータ量
たとえば1600×900pxでも、圧縮方法や保存形式によって容量は大きく変わります。反対に、容量だけを小さくしても、縦横比がテーマと合わなければ一覧画面で文字や被写体が切れることがあります。
用途別の推奨サイズと容量の目安
WordPress画像の用途別目安
EDIT.の制作環境を基準にした出発点です。テーマの表示幅と画質を確認して調整してください。
| 用途 | ピクセルの目安 | 容量の目安 | 確認点 |
|---|---|---|---|
| アイキャッチ | 1600×900px | 150〜300KB程度 | テーマの比率とOGPの切れ方 |
| 本文の横長画像 | 横幅1200px前後 | 100〜250KB程度 | 本文幅より極端に大きくしない |
| 操作画面のスクリーンショット | 横幅1200〜1600px | 150〜350KB程度 | 文字がスマホでも読めるか |
| 2カラム内の画像 | 横幅800〜1200px | 80〜200KB程度 | 実際の表示幅と高解像度画面 |
| ロゴ・単純な図 | 表示幅の1〜2倍 | 必要最小限 | 透過の要否と輪郭の鮮明さ |
※容量は画質を確認するための運用目安です。写真の細かさや保存形式によって適切な値は変わります。数値だけを優先して画質を崩さないでください。
アイキャッチ画像はテーマの比率を先に確認する
アイキャッチは記事ページだけでなく、トップページ、カテゴリ一覧、関連記事、SNSのシェア画面でも使われます。最初に確認したいのは、テーマが画像を何対何で表示しているかです。
EDIT.では1600×900pxの16:9を標準にしています。高解像度の元画像を用意しつつ、一覧で小さく表示されても見出しが読めるように、重要な文字や人物を端へ寄せすぎません。
TIP
OGPだけで判断しない
同じ画像でも、トップページでは16:9、サイドバーでは小さな横長、SNSでは中央寄りに切り抜かれる場合があります。公開前にPCとスマホの両方で一覧表示まで確認しましょう。
本文画像は表示幅より少し大きく用意する
本文画像は、記事カラムの実際の幅を基準にします。たとえば本文が800px前後で表示されるなら、1200px程度の画像を用意すると、高解像度の画面にもある程度対応しやすくなります。
ただし、表示幅800pxの場所へ4000pxの写真を毎回入れる必要はありません。WordPressは複数サイズを生成し、対応する画像マークアップではブラウザが画面に合う画像を選べる仕組みを備えていますが、元画像が過度に大きいと保存容量や処理負荷は増えます。
スクリーンショットは文字の読みやすさを優先する
操作画面は、写真よりも文字の鮮明さが重要です。不要な余白や個人情報を切り取り、記事で説明する範囲を大きく見せます。横長画面をそのまま縮小して文字が読めなくなる場合は、1枚へ詰め込まず、画面を分けて掲載します。
WARNING
個人情報と管理画面の情報を確認
スクリーンショットには、メールアドレス、ユーザー名、サイトURL、APIキー、通知、顧客名などが写り込むことがあります。アップロード前に原寸で確認し、必要な部分は確実に隠してください。
WordPressへ画像を入れる前の6ステップ
STEP 1 画像を使う場所と表示比率を確認する
アイキャッチ、本文、サイドバーなど、表示場所の幅と縦横比を確認します。
STEP 2 必要な範囲へトリミングする
重要な被写体や文字を安全な位置へ置き、不要な背景を減らします。
STEP 3 ピクセル数を縮小する
用途に合う横幅へリサイズします。小さな画像を無理に拡大すると、輪郭がぼやけます。
STEP 4 画質を見ながら圧縮する
文字、人物の輪郭、グラデーションを原寸と縮小表示で確認し、容量だけを追いません。
STEP 5 用途に合う形式で保存する
写真はWebPやJPEG、透過が必要な図はWebPやPNGなど、内容と対応環境に合わせます。
STEP 6 アップロード後の表示を確認する
PCとスマホで、切れ方、文字の読みやすさ、ぼやけ、読み込み速度を確認します。
WordPressが自動生成する画像サイズ
WordPressの「設定」→「メディア」では、サムネイル、中サイズ、大サイズの最大寸法を設定できます。画像をアップロードすると、これらの中間サイズやテーマが追加したサイズが生成される場合があります。
また、WordPressの開発者向け資料では、大きな画像のしきい値は標準で2560pxです。画像の幅または高さがしきい値を超える場合、縮小版が最大の利用可能サイズとして扱われます。ただし、テーマやプラグイン、コードによって設定が変更されている可能性があります。
WordPressの「設定」→「メディア」では、サムネイル・中サイズ・大サイズの最大寸法を確認できます。テーマ独自の画像サイズは別途生成される場合があります。INFO
設定変更は新しい画像から反映される
メディア設定やテーマの画像サイズを変更しても、過去にアップロードした画像の派生ファイルが自動で作り直されるとは限りません。既存画像への適用は、バックアップを取ったうえで再生成方法を確認してください。
画像サイズ変更・圧縮・WebP変換の違い
画像を軽くするときは、作業の役割を分けると迷いません。サイズ変更はピクセル数を減らす作業、圧縮は見た目を保ちながらデータ量を減らす作業、WebP・AVIF変換は保存形式を変える作業です。
- ブラウザ上で寸法を整えたい：無料の画像サイズ変更サイト7選
- アップロード前に容量を減らしたい：無料の画像圧縮サイト7選
- WordPress上で自動化したい：WordPressの画像を圧縮する方法
- 次世代形式を設定したい：WordPressのWebP・AVIF設定方法
画像が多いサイトは自動最適化も検討する
記事数や画像数が増えると、毎回同じ設定で圧縮・変換する作業が負担になります。運用を自動化したい場合は、画像最適化プラグインの無料枠、月ごとの処理数、元画像のバックアップ、WebP・AVIF対応を比較してください。
ShortPixelを実際に導入する場合は、WordPressへの追加方法と失敗しにくい初期設定を確認してください。画像が少ない段階は手動圧縮、継続的に増える段階は自動圧縮という分け方も解説しています。
ShortPixelを候補にする場合は、無料枠・買い切りクレジット・Unlimitedで課金の考え方が異なります。導入前にShortPixelの料金とクレジットの仕組みを確認すると、画像数に合うプランを判断しやすくなります。
WordPressの画像サイズに関するよくある質問
共通の正解はありません。テーマの推奨比率と表示幅を確認してください。16:9で運用するEDIT.では1600×900pxを標準にしています。
一律の上限ではなく、用途と画質で判断します。まずアイキャッチ150〜300KB、本文画像100〜250KB程度を目安にし、文字や輪郭が崩れる場合は画質を優先してください。
WordPressは複数の画像サイズを生成し、大きな画像を縮小する仕組みも備えています。ただし、圧縮品質やテーマの出力方法まで常に最適になるとは限りません。アップロード前のリサイズと公開後の確認は必要です。
Web表示では、dpiの数字だけでなく実際のピクセル数とファイル容量を確認します。同じ1600×900pxなら、画面上の表示サイズはCSSやレイアウトで決まります。
設定変更だけでは、既存画像の派生サイズが作り直されない場合があります。バックアップ後に、テーマや利用中のプラグインに合う再生成方法を確認してください。
まとめ
WordPress画像は、数値を一つ覚えるより、表示場所、縦横比、必要な横幅、容量の順に決めることが大切です。アイキャッチは一覧とOGP、本文画像は記事カラム、スクリーンショットは文字の読みやすさを基準にします。
まずは1600×900pxのアイキャッチと横幅1200px前後の本文画像を出発点にし、実際のテーマで確認してください。そのうえで圧縮やWebP・AVIF変換を組み合わせれば、見た目と表示速度を両立しやすくなります。
