PNG・JPG・WebP・AVIF を横並びで比較——2026 年の画像フォーマット選び
Web で使われる画像の 95% を 4 つのフォーマットがカバーしています。選択を誤ると、ファイルが倍になり、透過が消え、配信先プラットフォームに拒否されることもあります。この記事は概念より判断ポイントに集中し、実データとともに「いつどれを使うか」を提示します。
本文での変換ツール：paste-to-download.com/ja/compress——ブラウザローカル、アップロード不要、4 形式すべて対応。
4 フォーマット一覧
| 形式 | 圧縮方式 | 透過 | アニメーション | HDR | 普及年 |
|---|---|---|---|---|---|
| JPG | 非可逆 | なし | なし | なし | 1992 |
| PNG | 可逆 | あり（alpha） | なし（APNG はまれ） | なし | 1996 |
| WebP | 両方 | あり | あり | なし | 2010（Google） |
| AVIF | 両方 | あり | あり | あり（10/12 bit） | 2019（AOM） |
JPG と PNG は 1 MB が大画像だった時代の設計。WebP と AVIF は Web のために設計された現代フォーマット——強い圧縮と見た目の劣化ゼロを両立させる目的で。
ファイルサイズの実測
1600 × 1000 ピクセルの商品写真（カメラ撮って出し、中性背景、通常コントラスト）：
| 形式 | サイズ | PNG 比 |
|---|---|---|
| PNG（可逆） | 2,140 KB | 100% |
| JPG（品質 90） | 612 KB | 29% |
| JPG（品質 80） | 318 KB | 15% |
| WebP（品質 90） | 410 KB | 19% |
| WebP（品質 80） | 184 KB | 9% |
| AVIF（品質 80） | 132 KB | 6% |
品質 80 で AVIF は JPG の 2.4 分の 1、画質はほぼ同等。WebP は JPG の 1.7 分の 1。PNG は本当に可逆が必要な場面のみ。
文字入りスクリーンショット（細部少、平面多い）：
| 形式 | サイズ | PNG 比 |
|---|---|---|
| PNG（可逆） | 720 KB | 100% |
| パレット PNG（256 色） | 168 KB | 23% |
| JPG（品質 90） | 380 KB | 53% |
| WebP（可逆） | 312 KB | 43% |
| WebP（品質 95） | 84 KB | 12% |
| AVIF（品質 95） | 62 KB | 9% |
スクリーンショットでは WebP・AVIF が JPG を圧倒。PNG はエディタ間で画質を保ったまま往復させる必要がある場合のみ勝ちます。
2026 年のブラウザとプラットフォーム対応
| 形式 | Chrome | Safari | Firefox | メール | CMS アップロード | SNS |
|---|---|---|---|---|---|---|
| JPG | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ |
| PNG | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ |
| WebP | ✅ | ✅（14 以降） | ✅ | ⚠️（Outlook 2013 以前で失敗） | ✅（主流） | ✅（多く） |
| AVIF | ✅ | ✅（16 以降） | ✅ | ❌ | ⚠️（一部受領） | ⚠️（X は可、IG は不可） |
実務的結論：2026 年、Web 用途では WebP が安全。AVIF も Web では安全だがメールと一部 CMS にリスクが残る。JPG・PNG は最大公約数のフォールバック。
同サイズでの画質比較
ファイルサイズを 100 KB に揃えると：
- JPG：文字にブロック歪み、グラデーションに軽いバンディング
- WebP：グラデーション滑らか、文字エッジが鋭く、ときに細部がわずかにソフト
- AVIF：全体的に最良、特に色とグラデーションの遷移
色の多い画像（夕焼け、グラデーション、商品写真）で差が最大。グレースケールや低コントラストではどれも 100 KB で似た見栄え。
判断ツリー——10 秒で形式を決める
写真
- Web（一般向け） → WebP 品質 80
- Web（先端、モダンブラウザのみ） → AVIF 品質 75
- メール or フォールバック → JPG 品質 85
- 印刷 or アーカイブ → JPG 品質 95 か PNG
文字入りスクリーンショット
- Web → WebP 品質 90
- メール or フォールバック → PNG（または JPG 品質 95）
- ストレージ / アーカイブ → PNG
ロゴ・図形
- 透過が必要 → PNG（or より小さい WebP）
- 透過不要、色数少ない → パレット PNG
- Web で写真と組み合わせる → アルファ付き WebP
アニメーション
- モダンな Web → WebP か AVIF（アニメ版）
- メール / フォールバック → GIF（依然として唯一の汎用アニメ形式）
知っておくと得な細部
JPG とカラープロファイル。Adobe RGB や ProPhoto などのプロファイルを埋め込んだ JPG は、プロファイルを尊重しない配信先で色がまったく違って見えます。SNS 用途は事前に sRGB へ。
アニメ WebP vs GIF。同品質でアニメ WebP は GIF より約 30% 小さいが、対応範囲は狭い。どこでも再生できる必要があるミームは GIF が今も最強。
iOS の AVIF。Safari は iOS 16 以降ネイティブ対応。観客層が企業ユーザ（古い iPad、iOS 15）の場合は移行前にテスト。
ロスレス WebP vs PNG。ロスレス WebP は PNG より一般に 20〜30% 小さい。ツールチェーンが対応していれば、スクリーンショットや図形にはロスレス WebP を。
変換方法
paste-to-download.com/ja/compress を開き、画像をドロップ。上部のフォーマットセレクタでターゲット形式と品質を選択。すべてブラウザ内で動作——画像はデバイスから出ません。
PNG スクリーンショットのフォルダを WebP へ一括変換するなら、フォルダごとドラッグ、WebP-80 を選択、「すべて zip でダウンロード」。数秒で完了。
2 行の結論
2026 年の多くの Web 用途で：WebP 品質 80 が答え。JPG より約 50% 小さく、画質はほぼ同等、透過対応、想定される配信先で動作する。
AVIF は Outlook と一部の旧 CMS を切り捨てる覚悟があれば。JPG/PNG は配信先が明示的に要求するときに。変換は paste-to-download.com/ja/compress で数秒。