画像圧縮品質とファイルサイズ：JPEG・WebP比較を読む方法

損失圧縮と品質数値の意味

JPEGと損失 WebPは、元の情報をそのまま残す保存方式ではありません。ブラウザCanvasのquality引数はエンコーダに渡す設定であり、フォーマット間の共通の画質スコアではありません。品質100を選択しても、元のファイルやメタデータの保存を意味しません。

WebP形式自体は損失・ロスレスの両方をサポートしますが、Moyoutil目標容量ツールにはWebPロスレスモード選択機能がありません。 PNG品質スライダで同じ方法で目標容量を調整する機能もありません。

注: Google WebP圧縮技術, MDN Canvas toBlob.

同じ画像で比較すると守る条件

1. 同じオリジナルから始めてください。すでに圧縮した結果を連続して再圧縮すると、累積損失が比較に混じります。
2. 出力ピクセルサイズを同じに合わせて、品質とフォーマットのみを変更して比較します。
3. ファイルサイズを bytes として記録し、小文字、高コントラスト境界、グラデーションを拡大して確認します。
4. 透明画像のJPEG結果は白い背景なので、透明度を維持したWebPと用途が同じかも確認します。

単色図形や画面キャプチャ 1 枚の圧縮結果をすべての写真に一般化することはできません。以下の例は検証用の入力に限定され、特定の圧縮率を保証しません。

検証の例と設定の選択

2026年9月30日 Chromiumベースのブラウザで直接作成した1600×1000px PNGを処理しました。オリジナルはグラデーション・格子・固定された乱数パターンを含み、4,539,528bytesです。実際の写真ではなく検証用の合成画像なので、一般写真の予想圧縮率として使用しないでください。目標を10,000KBに十分高め、開始・最小品質を同じ値に固定し、ピクセル縮小なしで比較しました。

この入力では、品質50のJPEGが同じ数のWebPよりも小さくなりました。これは画質まで同じという意味ではなく、形式の普遍的な優劣を示す実験でもありません。ブラウザとエンコーダのバージョンが異なると、数値が変わる可能性があります。

別途JPEG、目標200KB、開始品質85、最小品質50、最大長辺2048px、追加縮小許容で実行しました。結果は1280×800ピクセル、品質70、185,666バイトでした。元のサイズから品質だけを下げると、この設定の目標に到達できず、ピクセルサイズも縮小されたケースです。

検証用オリジナルPNGダウンロード（約4.54MB） · 200KB目標結果JPEGダウンロード

用途に合わせて設定を選ぶ

写真を画面上で小さく見せる目的であれば、まず必要なピクセルサイズに縮小してから品質85から比較してください。小さな文字を読む必要がある文書・図表は、十分なピクセルサイズと高い最小品質を維持する方が良いです。ロスレス保存が必要な場合は、元のPNGを保存し、画像拡張子変更ツールのPNG出力を個別に確認してください。

目標容量を達成しても、オリジナルよりファイルが大きくなることがあります。小さなPNGをJPEGまたはWebPに再エンコードすることは、常に容量を節約するわけではありません。画面のオリジナル・結果バイト数を比較してからお使いください。

よくある質問