写真のファイルサイズが小さくなる仕組み — 解像度・品質・サブサンプリング・メタデータ
写真の容量を決める5つの要素(解像度、品質と量子化、クロマサブサンプリング、メタデータ、形式)を解説し、200KBのような目標サイズに合わせるとき、品質と解像度をどの順で調整すれば画質の劣化を抑えられるかをまとめました。
写真ファイルの容量は、「いくつのピクセルを、1ピクセルあたり何ビットで、どんな付加情報と一緒に」保存するかで決まります。スマートフォンの写真1枚が3〜5MBなのに、応募書類のアップロード画面では100〜500KBを求められることはよくありますが、この差を縮める方法は大きく分けて5つあります。この記事では、それぞれの方法がファイルサイズと画質にどう影響するか、そして目標サイズに合わせるときにどの順で調整するのがよいかを説明します。
1. 解像度 — 最も確実に小さくなる要素
圧縮前の生データのサイズは横ピクセル × 縦ピクセル × 3バイト(RGB)です。4032×3024ピクセルの写真なら約1,219万ピクセル、生データで約36MBです。縦横をそれぞれ半分にするとピクセル数は4分の1になるため、圧縮後のファイルサイズもおおむね同じ割合で小さくなります。
| 横×縦(px) | ピクセル数 | 生データ(RGB) | 用途の例 |
|---|---|---|---|
| 4032×3024 | 約1,219万 | 約36.6MB | スマートフォンの元画像 |
| 2016×1512 | 約305万 | 約9.1MB | ブログ本文の高画質 |
| 1080×1350 | 約146万 | 約4.4MB | Instagramの縦長投稿 |
| 413×531 | 約22万 | 約0.66MB | 旅券写真(韓国のオンライン申請推奨サイズ) |
応募書類の写真のように必要なピクセルサイズが決まっているなら、まずそのサイズに縮小してください。それだけで目標サイズをクリアできることがよくあります。韓国外交部のオンライン旅券写真は413×531ピクセルを推奨し、500KB以下を求めていますが、このサイズに縮小したJPGは、通常は高い品質でも余裕をもって制限をクリアします。
2. 品質と量子化 — JPG・WebPの「品質」スライダーの役割
JPGは画像を8×8ブロックに分けて周波数成分に変換したあと、各成分を量子化テーブルの値で割って丸めます。品質値を下げるとこの割る数が大きくなり、丸めたあとに0になる高周波成分が増えます。0が長く続くと、その後のエントロピー符号化(ハフマン符号)がこれをごく短く表現できるため、ファイルサイズが小さくなります。
- 品質90以上:目では元画像と区別しにくいのに、ファイルサイズが急激に大きくなる領域です。
- 品質70〜85:写真で最も効率のよい領域です。ほとんどのWeb上の写真はこの範囲にあります。
- 品質50以下:空や肌の階段状のムラ、境界周りのにじみ(リンギング)、8×8ブロックの境界が見え始めます。
品質値とファイルサイズの関係は直線ではありません。品質を95から85に下げるとサイズは大きく減りますが、60から50に下げるときは減る幅が小さいうえに画質の劣化はより目立ちます。そのため、品質を60未満まで下げなければならない状況なら、解像度を下げたほうが良い結果になります。
3. クロマサブサンプリング — 色の情報を少なく保存する
人の目は明るさの変化には敏感ですが、色の変化にはそれほど敏感ではありません。そこでJPGと非可逆WebPは、RGBを輝度(Y)と色差(Cb、Cr)に変換したうえで、色差を縦横半分の解像度で保存する方式(4:2:0)をよく使います。これだけで色の情報が4分の1になり、生データ全体が半分になります。
写真ではほとんど違いがわかりませんが、赤い文字・細いカラーの線がある画像では、文字の縁がにじんで見えることがあります。非可逆WebPは仕様上つねに4:2:0を使うため(MDN)、色付きの文字が重要なグラフィックにはPNGや可逆WebPのほうが適しています。
4. メタデータ — 写真の中に隠れた数十KB
スマートフォンの写真には、撮影機器、日時、GPS座標などのEXIF情報と、プレビュー用の小さなサムネイル、カラープロファイル(ICC)が一緒に含まれています。通常は数KB〜数十KBで全体に占める割合は小さいものの、100KB以下のように目標が小さい場合は無視できません。何より、位置情報がそのまま残る点が問題です。ブラウザのCanvasで再エンコードすると、こうした情報のほとんどは取り除かれます。詳しくはEXIFメタデータと個人情報をご覧ください。
5. 形式の選択 — 同じ画質をより少ないバイト数で
同じ画質なら新しいコーデックほど小さくなります。Googleは非可逆WebPが同じSSIM画質でJPGより25〜34%小さいと発表しており、AVIFはたいていそれよりさらに小さくなります。ただし、提出先がJPGしか受け付けない場合は形式を変えられないため、この方法は主にWeb掲載用で使います。形式ごとの違いはJPG vs PNG vs WebP vs AVIFにまとめています。
品質値は形式どうし、ソフトどうしで互換性がない
「品質80」は規格で定められた単位ではありません。エンコーダーが品質値を量子化の強さに変換する方法はそれぞれ異なるため、同じ80でもJPGとWebP、AVIFでは結果の画質とファイルサイズが異なり、同じJPGでもソフトごとに少しずつ違います。したがって「いくつで保存すべき」という絶対的な基準よりも、結果のファイルを元画像と拡大比較しながら決めることが確実です。複数枚を同じ条件で処理するときは、まず1枚で試してから残りに適用してください。
プログレッシブJPG
JPG規格(T.81)は、上から下へ一度に描画するベースライン方式のほかに、ぼやけた全体像を先に表示して徐々に鮮明にしていくプログレッシブ方式も定義しています。遅い回線で大きな写真を見るときに体感速度が良くなる利点があります。ファイルサイズの差は写真によって異なり、一部の古い機器やソフトはプログレッシブJPGを読み込めないため、提出用にはベースライン方式が無難です。
例で見る調整の流れ
スマートフォンで撮った4032×3024の写真(約3〜4MB)を「横1000ピクセル以下、200KB以下」でアップロードしなければならないとします。
- まず横を1000ピクセルに縮小します。縦は比率に従って750ピクセルになり、ピクセル数は元画像の約6%に減ります。この段階だけでほとんどの場合は数百KB以下になります。
- その状態で品質85で保存し、200KBを超えるか確認します。超えたら品質を80、75の順に下げるか、二分探索で探します。
- 夜景写真のようにノイズが多く、品質を60未満まで下げる必要があるなら、横900ピクセルまでもう少し縮小したほうがきれいな結果になります。
目標サイズ(KB)に合わせる手順
「200KB以下でアップロードしてください」のような条件に合わせるときは、次の順序が最も画質の劣化を抑えられます。
- 必要なピクセルサイズにまず縮小します。 規格が決まっていればそのサイズ、なければ画面に表示されるサイズ(例:横1200〜2000px)に合わせます。
- 品質を二分探索で探します。 品質50と95の間の中央の値で保存してみて、目標より大きければ下半分を、小さければ上半分をさらに分割します。7〜8回で、目標以下のうち最も高い品質が見つかります。
- 品質が下がりすぎたら、解像度をもう少し下げます。 縦横を10%縮小するとピクセル数は約19%減ります。そのあと2を繰り返します。
- KBの基準を確認します。 1KBを1,000バイトとするところと1,024バイトとするところがあります。基準がわからない場合は1,000バイトで計算して小さめに合わせれば、どちらの基準もクリアできます。
- 「未満」と「以下」を区別します。 「100KB未満」なら、ちょうど100KBのファイルは通りません。
画像圧縮ツールはこの手順を自動で行います。目標KBを入力すると品質を二分探索し、品質の下限に達すると解像度を下げながら、目標以下で最も鮮明な結果を選びます。
よくある失敗
- 小さくしたファイルを再び大きく保存する:すでに品質60で保存したJPGを品質95で保存し直しても、ファイルサイズが大きくなるだけで画質は戻りません。
- 何度も繰り返し圧縮する:保存するたびに劣化が積み重なります。必ず元画像から一度で目的の結果を作ってください。
- スクリーンショットをJPGで圧縮する:文字がつぶれ、かえってPNGより大きくなることもあります。画面キャプチャはPNGのままにするか、解像度を下げてください。
よくある質問
品質100で保存すれば元画像とまったく同じになりますか?
JPGは品質100でも色変換や丸め処理による劣化が残るため、完全な可逆ではありません。また、品質90以上では目に見える違いはほとんどないのに、ファイルサイズだけが大きく増えることがよくあります。
解像度を下げると画質が悪くなりませんか?
画面で見るサイズより大きい解像度はどのみち縮小して表示されるため、下げても体感の差は小さくなります。逆に、必要なサイズより小さく縮小してから再び拡大するとぼやけるので、最終用途のピクセルサイズを先に確認してください。
同じ設定なのに写真ごとにファイルサイズが違うのはなぜですか?
圧縮効率は写真の内容によって大きく変わります。青空のような単純な写真は小さく、木の葉・砂・ノイズの多い夜景写真のように細部の多い写真は大きくなります。
今すぐ試す