当ウェブサイトは第三者配信の広告配信事業者を利用しております。

AVIF WebP 各ブラウザ 対応状況

AVIF WebPブラウザ対応状況 情報通信技術
2024.06.11

AVIFとWebPの各ブラウザの対応状況をまとめました。

調査背景

当ウェブサイトを運営していくにあたり画像フォーマットはJPEG・PNG使用と考えていましたが画像品質を維持した上でもっと圧縮率の高いフォーマットであるAVIFとWebPの存在を知りました。圧縮率が高い＝ファイル容量が少ない＝ウェブサイトの表示が早くなる、なのでAVIFやWebPを使う利点はあります。（尚、AVIFの方がWebPよりも同一画像品質において圧縮率が高いのでAVIFを積極的に使う方が良さそうです）

しかしブラウザのバージョンが古い場合に表示出来ないという問題があるので各ブラウザが対応開始時期を調べてみる事にしました。

※尚、下記情報の公開日やバージョンは調べた限りでは正しいと思われる情報を記載していますが、多少違いがある可能性がありますのでご了承下さい

AVIF 対応開始バージョン

公開日ブラウザバージョン
2020/8/25Google Chrome85〜
2020/9/15Opera71〜
2021/10/5Mozilla Firefox93〜
2022/10/24Apple Safari16.1〜※
2024/1/25Microsoft Edge121〜
※macOS Venturaが必要（macOS Monterey以前は非対応）

WebP 対応開始バージョン

公開日ブラウザバージョン
2011/2/3Google Chrome9〜
2011/3/22Opera11〜
2018/1/29Mozilla Firefox65〜
2018/10/2Microsoft Edge18〜
2020/11/12Apple Safari14.0.1〜※
※macOS Big Surが必要（macOS Catalina以前は非対応）

各ブラウザ毎のまとめ

Google Chrome

AVIFやWebP共に早くから対応済み、かつ、基本的に自動更新なのでどちらも問題無さそうです。

Mozilla Firefox

AVIFやWebP共に比較的早くから対応済みなのでどちらも問題無さそうです。

Opera

AVIFやWebP共に比較的早くから対応済みなのでどちらも問題無さそうです。

Apple Safari

留意が必要に思いました。
WebPはmacOS Big Surを使う前提がありますが2020年11月公開のバージョンから対応しているので大きな問題は無いかと思います。（Big Surの前のCatalinaが2024/12/31にサポート終了予定なので使用されてる方が少なめ、かつ、今後減少すると思われます）

一方AVIFはmacOS Venturaを使う前提、かつ、2022年10月公開のバージョンから対応なので時間的にまだ同環境に移行されて無い方も比較的多くいらっしゃる可能性があるので留意する必要がありそうです。（Venturaの前のMotereyは2026/12/31にサポート終了予定なので暫くは継続して使用される方がいらっしゃると思われます）

Microsoft Edge

留意が必要に思いました。
WebPは比較的早くから対応済なので問題無いと思いますが、AVIFは2024年1月からの対応なのでまだAVIF未対応バージョンを使用されている方もいらっしゃると思うので留意が必要に思います。

まとめ

WebPについてはどのブラウザでも問題になる事が少ない筈なのでJPEG・PNGの代わりが務まると思われます。

一方AVIFについてはWebPよりファイル容量を減らせるものの、SafariとEdgeで表示出来ない方が一定数出てしまうと考えられます。ウェブサイトに来訪して頂ける方が使われるブラウザにSafariとEdgeが少ないなら割り切ってAVIFを使っていく考え方も有りと思います。（SafariとEdgeでも今後AVIF対応バージョンに少しづつ切替る筈ですし）

下記の補足情報にも記載しましたがJPEGやPNGから変換する場合、WebPよりAVIFの方が変換に時間が掛かりますので、その辺りも含めて総合的に判断するのが良いかと思います。

尚、HTML記述で「AVIF表示 → 表示出来ない場合はWebP表示 → 表示出来ない場合はJPEG表示」とさせるのが一番良いかもしれませんが、手間が掛かる事と各画像ファイルを用意する必要もあるのでサーバ容量を使ってしまうのが欠点です。

補足情報 変換方法

AVIFやWebPをウェブサイトで使うにあたってはJPEGやPNGのファイルを変換する必要があります。手軽なのはブラウザで「squoosh」を使って変換する方法です。尚、WebPに比べAVIFの変換の方が時間が掛かります。（ブラウザを使うものの実際の変換はサーバではなくPC内で行われている様なので高性能PCであれば変換が早く終わる＝気にならない程度なのかも知れません）

AVIFやWebPへの変換方法はこちら