PNG圧縮の仕組み
PNGはDEFLATEアルゴリズム(ZIPと同じ)に基づく可逆圧縮を使います。ピクセル行に予測フィルタを適用してから結果を圧縮します。すべてのピクセルが正確に保持され、画質が損なわれることはありません。
PNG最適化は、より効率的なエンコード経路を見つけ、不要なメタデータを取り除きます。表示結果は元のピクセルとバイト単位で完全に一致します。
PNG圧縮の結果
| 画像の種類 | 元のサイズ | 最適化後 | 削減 |
|---|---|---|---|
| スクリーンショット(UI) | 1.8 MB | 720 KB | 60% |
| 図表・グラフ | 950 KB | 380 KB | 60% |
| 透過付きアイコン | 85 KB | 42 KB | 51% |
| PNGで保存した写真 | 4.1 MB | 3.2 MB | 22% |
プロのヒント:PNGで保存した写真は極端に肥大化します。まず写真をJPGまたはWebPに変換しましょう — サイズが80〜90%小さくなります。PNGは図形、スクリーンショット、透過が必要な画像に使いましょう。
PNGを使うべき場面
- スクリーンショット — 鋭い文字やUI要素がくっきり保たれる
- 文字を含む図形 — ロゴ、図解、インフォグラフィック
- 透過が必要 — 透明背景の商品画像
- ピクセルアート — 1ピクセルが重要、圧縮ノイズなし
- 元データ — 後で編集する画像(世代劣化なし)
PNGを使うべきでない場面
- 写真 — 写真のPNGはJPGの3〜5倍のサイズです。JPGまたはWebPを使いましょう。
- Webパフォーマンス — サイズが重要でわずかな劣化が許容できるなら、WebPは透過対応のままより高い圧縮率を提供します。
- 大きな画像 — 4000×3000のPNGは10MBを超えることも。WebP可逆(30%小さい)を検討しましょう。