FORMAT COMPARISON
AVIF vs WebP
AVIFとWebPはどちらもWeb画像向けで、非可逆・可逆圧縮や透過などを扱えます。画質・容量・生成速度・対象環境を同じ画像で比較し、必要なら複数形式を配信します。
AVIFとWebP、どちらを選ぶ？
新しいWeb配信で候補を絞るなら、代表画像をAVIFとWebPの同じ条件で書き出し、見た目・転送サイズ・エンコード時間と配信先の対応を確認します。どちらか一方が常に優れるとは限らず、フォールバックも含めて決めます。
AVIF向き
Web画像
- 配信サイズを抑えたい写真や画像
- AVIFを扱える配信・閲覧環境
WebP向き
Web画像
- Web配信
- 写真
- 透過画像
基本情報を比較
AVIFとWebPの主な違いを確認できます。
| 項目 | AVIF | WebP |
|---|---|---|
| 拡張子 | .avif | .webp |
| MIME Type | image/avif | image/webp |
| 主な用途 | Web画像 | Web画像 |
| 圧縮 | 非可逆／可逆 | 非可逆／可逆 |
| ベクター | 非対応 | 非対応 |
| 開く方法 | 対応するWebブラウザではページ内画像として表示できます。ローカルファイルは、利用中のOSビューアや画像編集ソフトがAVIFに対応しているかを確認して開きます。 | 対応ブラウザや画像ビューア、編集ソフトで開けます。 |
| 書き出し・変換 | JPEGやPNGからAVIFへ変換する場合は、元画像を残し、画質設定と透過の有無を確認します。AVIFを別形式へ変換すると、出力形式にない機能やメタデータは保持されないことがあります。 | WebPからJPEGへ書き出すと透過を保持できず、非可逆圧縮になります。PNGへ書き出す場合は、静止画として出力するのか、アニメーションを別の方法で扱うのかを確認します。JPEGやPNGからWebPへ変換する場合も、可逆・非可逆、透過、アニメーションの要件を先に決めます。 |
用途別の選び方
作りたいものや使う場面から選べます。
配信サイズを抑えたい写真や画像
Web画像
AVIF向きAVIFを扱える配信・閲覧環境
Web画像
AVIF向きWeb配信
Web画像
WebP向き写真
Web画像
WebP向き確認ポイント 1
AVIFはAV1由来の画像符号化仕様に基づき、写真や透過画像などのWeb配信で容量最適化を検討できます。
使い分け確認ポイント 2
WebPもWeb向けの画像形式で、非可逆・可逆圧縮、透過、アニメーションを扱えます。
使い分け選ぶ理由を詳しく
- 圧縮結果、画質、エンコード負荷は元画像と設定で変わるため、同じ素材・同じ表示条件で実測します。