形式の助言はたいてい順位として書かれます。WebP は JPEG より上、AVIF は WebP より上、透明なら PNG。順位は覚えやすい一方で、しばしば間違っています。どの形式が正しいかは、画像の中身で決まり、そのファイルが今どう呼ばれているかでは決まらないからです。
そこで議論をやめて計測しました。公開している同じテストファイルをサイト内の 38 個のコンバーターに通し、出力バイト数をすべて記録しました。合計 98 件です。この記事はその表の実務的な読み方です。以下の数値はすべて実際のブラウザで実際に変換して得たもので、同じテストファイルをダウンロードして再現できます。
第一歩:あなたの画像の中身は何か
形式を選ぶ前に、手元のファイルを次の 5 つのどれかに分類してください。この 1 つの問いは、どんな形式の順位表よりも結果をよく予測します。
| 分類 | 見分け方 | 典型的な内容 |
|---|---|---|
| 写真 | 拡大すると輪郭がやわらかく、全体に粒状感がある | カメラ写真、商品写真 |
| スクリーンショット | 広い単色面、1 ピクセルの鋭い罫線、文字 | アプリや Web の画面 |
| フラットイラスト | 単色が数色だけ、グラデーションなし | 図表、概念図、簡単な絵 |
| 透明ロゴ | 色数が少なく輪郭が鋭い、背景が市松模様 | アイコン、バッジ、ステッカー |
| スキャン | スキャナー由来で、たいてい巨大かつ非圧縮 | TIFF・BMP の書類 |
写真:JPG か WebP、第三の選択肢はない
一般的な助言がそのまま当てはまるのはこの分類だけです。テスト写真は PNG で 1.88 MB、変換すると JPG で 288.4 KB(−85%)、WebP で 303.1 KB(−84%)になりました。元が 2.75 MB の非圧縮 BMP や TIFF スキャンなら、JPG で 288.4 KB、つまり 90% 減です。
数値が本当に警告しているのは逆方向です。写真を可逆形式に移すと膨れ上がります。
- JPG から PNG:330.2 KB → 2.07 MB(+542%)
- WebP から PNG:351.5 KB → 2.15 MB(+527%)
- JPG を SVG にトレース:330.2 KB → 7.49 MB(+2224%)
しかもどれも画質を取り戻しません。非可逆エンコーダーが捨てたものはすでに失われており、可逆形式は残りを圧縮痕跡ごと定価で保存するだけです。写真を PNG にする理由は 1 つ、これから編集する場合だけです。
すでに JPG で、もっと小さくしたい場合。WebP へ再エンコードしてもテスト写真では 9% しか減りませんでした(330.2 KB → 301.9 KB)。その JPEG がもともと効率よく圧縮されていたからです。圧縮のほうが効果的で −46%、幅 800 px へのリサイズではほぼ半分になりました。
スクリーンショット:WebP が正解、JPG は罠
この分類では順位がまるごと逆転し、多くの人がここで失敗します。18.0 KB の PNG スクリーンショットは JPG にすると 43.5 KB、142% 増でした。PNG がほぼ無料で保持していた鋭い罫線を JPEG はビットを使ってぼかす必要があるため、容量を余分に払ったうえで文字までにじみます。
正解は WebP です。同じキャプチャは 7.3 KB(−59%)になりました。太った JPG のスクリーンショットが元なら削減は劇的で、45.3 KB → 7.3 KB(−84%)です。2.75 MB の BMP キャプチャを抱えているなら、BMP から WebP は 7.3 KB を出しました。元と比べれば端数のような大きさです。
避けるべきは戻り道です。7.3 KB の WebP スクリーンショットを PNG にすると 82.3 KB、1034% 増になりました。WebP が生んだ圧縮ノイズを、PNG が忠実に保存しなければならないからです。
フラットイラスト:WebP が最良、ただし JPG も思ったほど悪くない
平面的な絵はほぼどこでもよく縮みます。34.7 KB のイラストは WebP で 10.2 KB(−71%)、そして意外にも JPG で 24.1 KB(−30%)でした。スクリーンショットの場合と違い、広い単色面は JPEG にぼかす対象をほとんど与えないため、これは本当の削減です。その絵をアイコンにするなら、PNG から ICO は 1.3 KB(−96%)まで持っていきました。
SVG へのトレースは魅力的に見えて多くの場合裏目に出る選択肢です。同じイラストは 117.0 KB(+238%)になりました。色の領域ごとにパスが生まれるからです。
透明ロゴ:JPG は絶対に選ばない
JPG にアルファチャンネルはなく、透明は白で塗られます。テストの透明ロゴは、どの JPG 変換でも背景に白い箱を伴って戻ってきました。うまくいったのは次の 3 つです。
- PNG から ICO:28.8 KB → 951 B(−97%)
- PNG を SVG にトレース:28.8 KB → 1.7 KB(−94%)、しかも無限に拡大可能
- PNG から WebP:28.8 KB → 7.5 KB(−74%)、透明も保持
この SVG の結果は、表全体でトレースが完勝した唯一の例であり、まさにトレースが想定していた条件です。色数が少なく、輪郭が鋭い。
正直に書く例外が 1 つ。4.3 KB の透明 GIF は WebP で 5.4 KB(+27%)になりました。これほど小さいファイルに対して、現代的なコーデックが取り戻せる余地はほとんどありません。それでも他の選択肢よりずっと良好です。同じ GIF は PNG で 26.0 KB(+507%)、JPG で 17.3 KB(+304%)でした。
スキャン:何をスキャンしたかで変換先が変わる
BMP と TIFF のテストファイルはどれもちょうど 2.75 MB でした。どちらも生のピクセルを保存するからです。どう変換しても削減は巨大ですが、正しい変換先は内容で反転します。
| スキャンしたもの | 最適な変換先 | 結果 |
|---|---|---|
| 写真 | JPG | 2.75 MB → 288.4 KB(−90%) |
| 文字・線画 | PNG | 2.75 MB → 22.9 KB(−99%)、しかも可逆 |
役に立つのは 2 行目です。書類のスキャンなら TIFF から PNG が JPG 版より小さく、かつピクセル単位で正確です。写真のスキャンは逆で、PNG は 2.25 MB(−18%)にしか下がりません。PNG は写真の粒状ノイズを圧縮できないからです。
ベクターと最新コーデック:2 つの特殊ケース
元が SVG の場合、ファイルサイズを決めるのは選んだ幅で、形式ではありません。574 バイトのテスト SVG は既定の幅 512 px で、WebP 6.6 KB、JPG 13.2 KB、PNG 17.9 KB になりました。まず本当に必要な最大サイズを決めてください。
元が AVIF の場合、表の中で最も効率の高いコーデックから離れることになるので、どの出口にも代償があります。1200 × 800 の UI キャプチャは AVIF ならわずか 1,472 バイトで、同じ画像が WebP で 6.9 KB(+378%)、JPG で 43.7 KB(+2942%)、PNG で 36.5 KB(+2442%)です。AVIF は置き換えず、残したまま WebP をフォールバックとして配信してください。
PDF:重さはページ数ではなく中身に従う
PDF の数値は同じことを何度も示します。5 ページのテスト文書から 3 ページ目(全面写真)を抽出すると 331.2 KB、4 ページ目(文字のみ)なら 1.4 KB です。その文字ページを削除するとファイルは 334.1 KB から 333.3 KB へ、ほぼ変化なし。写真ページを削除すると 3.4 KB が残りました。
つまり、結合では何も小さくならず(336.9 KB 入力、336.0 KB 出力)、回転ではサイズがまったく変わりません(334.1 KB のまま。フラグを立てるだけだからです)。小さくしたいなら圧縮で、テスト文書は半分の 167.6 KB になりました。圧縮は画像を再エンコードして文字には触らないので、文字だけの PDF には絞れるものがほとんどないという意味でもあります。
計測から学んだ 3 つのこと
非可逆から可逆への変換は、想像よりずっと高くつく。 20% 増ではなく、500%〜2700% 増です。PNG に変換しようとしているなら、可逆編集・透明・ピクセル単位の正確さが本当に必要かを確認してください。それらは正当な理由です。「画質が良くなるから」は理由になりません。画質はすでに失われています。
「どの形式が小さいか」は答えの出ない問いです。 WebP は PNG・JPG・BMP・TIFF が元なら必ず入力を下回りました。ところが 4.3 KB の透明 GIF では 27% 増えました。同じ JPG から PNG への変換が、スクリーンショットでは +61%、写真では +542% です。決めるのは中身であり、形式の名前ではありません。
計測は、自分たちが公開した助言を 5 回否定しました。 PDF のページは PNG のほうが JPG より小さい(文字ページでは違いました)、GIF から PNG は「少し」大きくなる(+125% と +507%)、GIF から WebP は他の 2 つより小さい(ロゴで +27%)、AVIF から WebP は「少しだけ」大きい(+92%〜+378%)、そして WebP は入力より大きくなったことがない — この 5 つです。すべて修正済みです。実測ラボが存在する理由、そしてテストファイルを公開している理由はここにあります。数値は信じるものではなく、確かめられるものであるべきだからです。