画像圧縮ガイド：WebP・AVIF・JPEG・PNG の比較

Web ページで最も重い要素はたいてい画像です。用途に合った形式と品質を選べば、画質を保ちながら容量を大きく減らせます。

非可逆 vs 可逆

非可逆（JPEG・WebP・AVIF）は目立たない情報を捨てて容量を大きく削減します。可逆（PNG）は全ピクセルを保持し、ロゴや透過に向きますが写真では容量が大きくなります。

どれを使うか

• 写真・サムネイル：WebP が基本。JPEG より 25〜35% 小さく対応も広い。
• 最新環境で最小容量：AVIF。
• 最大の互換性：JPEG。
• ロゴ・アイコン・透過：PNG または可逆 WebP。

品質値の決め方

• WebP・JPEG：品質 70〜80 がバランス点。
• AVIF：50〜60 から始めても同等の体感画質。
• PNG は品質設定なし。容量が大きいなら写真の可能性が高く WebP へ。

品質を少しずつ下げて変換前後を比較し、画質が目に見えて落ちる直前の値を選びましょう。

まとめ

Web 写真は WebP（品質 75）、最小容量は AVIF、透過は PNG。Scrunch ならブラウザ内で複数枚をまとめて変換できます。