数年ごとに、より小さなファイルとより高い品質を約束する新しい画像フォーマットが登場します。そのほとんどは忘れ去られていきます。しかしAVIFは違います。Google、Apple、Mozilla、Microsoft、Netflix、Amazonを含むコンソーシアムであるAlliance for Open Media(AOM)の支援を受け、AVIFはこれまでに開発された最も効率的な圧縮技術の一つであるAV1ビデオコーデックの上に構築されています。これは実験的な試みではありません。Netflixが数十億のサムネイルを配信するために使用し、Androidがデフォルトのスクリーンショットフォーマットとして採用し、すべての主要ブラウザがサポートしているフォーマットです。
AVIFは同等の視覚品質で、JPEGより30〜50%、WebPより20〜30%小さいファイルを一貫して生成します。HDR、広色域、透過、アニメーションにも対応しています。スペック上では、現在利用可能な最高の画像フォーマットです。
しかしAVIFには現実的な制限もあります。エンコードはJPEGやWebPよりも大幅に遅くなります。ブラウザ対応は急速に拡大していますが、WebPが享受する約97%のほぼユニバーサルな水準にはまだ達していません。また、フォーマットの複雑さゆえに、一部のツールやプラットフォームではまだ適切に処理できません。
このガイドでは、AVIFについて知っておくべきすべてを網羅します。内部の仕組み、実際の圧縮データによるWebPおよびJPEGとの比較、2025年現在のブラウザ対応状況、そしてユーザーに影響を与えずに段階的に導入する方法を解説します。
AVIFの仕組み:画像のためのAV1イントラフレーム符号化
AVIFはAV1 Image File Formatの略です。AV1ビデオコーデックのイントラフレーム符号化技術を取り出し、AOM AVIF仕様で定義されたHEIF(High Efficiency Image File Format)コンテナにパッケージしたものです。基盤技術を理解することで、AVIFが旧フォーマットよりもはるかに優れた圧縮を実現する理由がわかります。
AV1イントラフレーム符号化
ビデオ圧縮において、イントラフレーム(Iフレーム)は他のフレームを参照せずに独立して圧縮されます。AVIFはAV1のイントラフレーム符号化パイプラインを使用しており、JPEGやWebPをはるかに超えるいくつかの技術が含まれています:
柔軟なブロック分割。 JPEGは固定の8×8ブロック、WebPは4×4と16×16ブロックを使用します。AV1は最大128×128ピクセルのスーパーブロックをサポートし、さまざまなサイズに再帰的に分割できます。滑らかな領域には大きなブロック、詳細な領域には小さなブロックを使い、重要な部分にビットを配分します。
高度な予測モード。 AV1はJPEGのゼロ、WebPの13に対して、50以上の方向性イントラ予測モードを提供します。より正確な予測は保存すべきデータの削減を意味し、グラデーション、パターン、幾何学的形状に対して劇的に優れた圧縮をもたらします。
マルチシンボル算術符号化。 AV1のエントロピーコーダーは画像データの統計的特性に適応し、JPEGのハフマン符号化のような単純なコーダーが取りこぼす節約を絞り出します。
インループフィルタリング。 AV1はデコード中にデブロッキングフィルタ、制約付き方向性強調フィルタ(CDEF)、ループ復元フィルタを適用します。これによりブロック境界のアーティファクトが軽減され、視覚品質を維持しながらより積極的な量子化(より小さなファイル)が可能になります。
HDR、広色域、その他の機能
AVIFの機能セットは圧縮効率をはるかに超えています:
- 色深度:チャンネルあたり8ビット、10ビット、12ビット(JPEGとWebPは8ビットに制限)。高いビット深度により、微妙なグラデーション(夕焼け空、肌の色調、スタジオの背景)でのバンディングが解消されます。
- 広色域:BT.2020とBT.2100のサポートにより、JPEGやWebPでは表現できないsRGB色域外の鮮やかな色を表現できます。
- HDR伝達関数:PQとHLGのサポートにより、HDRディスプレイ向けの真のHDR画像が可能になります。HDRモニターの普及に伴い、その価値はますます高まっています。
- アルファ透過:非可逆・可逆の両モードでサポートされ、アルファチャンネルの独立した圧縮が可能です。
- アニメーション:HEIFコンテナ内の画像シーケンスは、GIFやアニメーションWebPに代わる高品質な選択肢を提供しますが、ツール対応はまだ発展途上です。
AVIF vs WebP vs JPEG:圧縮比較
画像フォーマットの真価は、実際の画像でどのようなパフォーマンスを発揮するかで決まります。同等の視覚品質でJPEG、WebP、AVIFの3フォーマットで5枚のテスト画像を圧縮し、その差を測定しました。
テスト方法
- ソース画像:一般的なWebコンテンツを代表する5枚の画像 — 風景写真、ポートレート、白背景の商品写真、テキスト入りスクリーンショット、フラットカラーのグラフィックイラスト。
- 品質キャリブレーション:同じ数値の品質設定(各フォーマットで意味が異なる)ではなく、約0.95のSSIM(構造的類似性指標)スコアを生成するよう設定をキャリブレーションしました。これはWeb配信に適した高い視覚品質を表します。
- JPEG設定:品質82、プログレッシブエンコーディング、4:2:0クロマサブサンプリング。
- WebP設定:品質80、非可逆モード。
- AVIF設定:品質65(AVIFの品質スケールは異なり、JPEG/WebPに比べて低い数値でも高品質を生成)、速度4(エンコード速度のバランス設定)。
- 変換ツール:MacBook Pro(M2、16 GB RAM)のChrome 122でクライアントサイド実行のImgCompress.app。
結果
| 画像タイプ | 解像度 | JPEG (Q82) | WebP (Q80) | AVIF (Q65) | AVIF vs JPEG | AVIF vs WebP |
|---|---|---|---|---|---|---|
| 風景写真 | 2400×1600 | 485 KB | 362 KB | 245 KB | −49% | −32% |
| ポートレート | 1800×2400 | 390 KB | 295 KB | 198 KB | −49% | −33% |
| 商品(白背景) | 2000×2000 | 310 KB | 240 KB | 175 KB | −44% | −27% |
| テキスト入りスクリーンショット | 1920×1080 | 265 KB | 195 KB | 155 KB | −42% | −21% |
| フラットイラスト | 1200×800 | 95 KB | 72 KB | 58 KB | −39% | −19% |
データが示すもの
AVIFはすべての画像タイプでJPEGを39〜49%上回ります。 節約効果は写真コンテンツで最も顕著で、AV1の高度な予測モードと柔軟なブロック分割が威力を発揮します。フラットイラストでも39%の削減を達成しています。
AVIFはWebPを19〜33%上回ります。 WebP対JPEGほどの差はありませんが、それでも相当な差です。風景写真では、AVIFはWebPに対してさらに117 KB(32%)の節約を実現しています。
写真コンテンツが最も恩恵を受けますが、すべてのタイプで改善が見られます。 スクリーンショットとイラストではWebPに対して19〜21%の節約で、マージンは狭くなります。これはWebPがシャープなエッジとソリッドカラーをすでにうまく処理しているためですが、AVIFは一貫して勝っています。
ブラウザ互換性:2025年のAVIFの現状
ブラウザ対応は、AVIFを本番環境で実際に使用できるかどうかを決定する重要な要素です。2025年初頭のCan I Useデータに基づく現在の状況は以下の通りです。
現在の対応状況
| ブラウザ | AVIF対応 | 対応バージョン | 年 |
|---|---|---|---|
| Chrome | 完全対応 | 85 | 2020 |
| Firefox | 完全対応 | 93 | 2021 |
| Edge | 完全対応 | 85 | 2020 |
| Opera | 完全対応 | 71 | 2020 |
| Safari | 完全対応 | 16.4 | 2023 |
| Samsung Internet | 完全対応 | 14.0 | 2021 |
| iOS Safari | 完全対応 | 16.4 | 2023 |
グローバル対応率
Can I Useによると、2025年初頭時点でAVIFのグローバルブラウザ対応率は約93%です。2023年にSafariが対応したことでAppleのエコシステム全体が加わり大幅に増加しましたが、WebPの約97%のカバレッジにはまだ及びません。
残りの約7%は主に以下から構成されています:
- macOS Monterey以前の古いSafariバージョン(Safari 15以下)
- Internet Explorer 11(サポート終了済みだが、一部の企業環境にはまだ存在)
- OSアップデートを受けていないデバイスの古いモバイルブラウザ
- 一部のニッチブラウザや組み込みブラウザ
実際の運用における意味
93%の対応率は、フォールバック付きの主要フォーマットとしてAVIFを使用するには十分に高いですが、フォールバック戦略なしにAVIFのみを配信するには十分ではありません。実用的なアプローチは、対応ブラウザにはAVIFを配信し、それ以外にはWebPまたはJPEGにフォールバックすることです。これはまさに<picture>要素が設計された目的です。
良いニュースは、AVIFの対応率は増加し続けているということです。すべての主要ブラウザベンダーがこのフォーマットにコミットしており、古いブラウザバージョンがインストールベースから退出するにつれて、対応率はWebPの97%レベルに向かって上昇し続けるでしょう。
チュートリアル:ImgCompress.appで画像をAVIFに変換する
ImgCompress.appを使って画像をAVIFフォーマットに変換する手順を解説します。プロセスを確認し、ご自身の画像で結果を評価してみてください。
ステップバイステップの変換手順
-
ブラウザで画像変換ツールを開きます。すべての変換はブラウザ内でローカルに行われ、画像がサーバーにアップロードされることはありません。
-
ソース画像(JPEG、PNG、またはWebP)をアップロードエリアにドラッグ&ドロップします。バッチ変換のために複数ファイルをアップロードできます。
-
フォーマットドロップダウンから出力フォーマットとしてAVIFを選択します。
-
品質設定を調整します。ほとんどのWeb画像では、品質60〜70がファイルサイズと視覚品質の優れたバランスを提供します。品質が重要なヒーロー画像や商品写真には75〜85を使用してください。
-
変換をクリックします。AVIFエンコードはJPEGやWebPよりも計算負荷が高いため、やや長い処理時間が予想されます。画像の解像度とデバイスの処理能力に応じて、通常1枚あたり2〜5秒です。ImgCompress.appはWeb Workerを使用してエンコード中もインターフェースの応答性を維持します。
-
圧縮前後の比較を使って結果をプレビューします。特に以下の点に注意してください:
- グラデーション領域(バンディングアーティファクトの確認)
- 細かいテキストとシャープなエッジ(ぼやけの確認)
- 微妙なテクスチャのある領域(ディテール保持の確認)
-
変換されたAVIFファイルを個別にまたはZIPアーカイブとしてダウンロードします。
用途別の推奨品質設定
| 用途 | 品質設定 | JPEG比の一般的な節約率 | 備考 |
|---|---|---|---|
| サムネイルとプレビュー | 50〜60 | 55〜65% | 小さな表示サイズがアーティファクトを隠す |
| ブログ画像・コンテンツ | 60〜70 | 45〜55% | ほとんどのWebコンテンツに適したバランス |
| ヒーロー画像 | 70〜80 | 35〜45% | 目立つ画像には高品質 |
| 商品写真 | 75〜85 | 30〜40% | ズーム表示のために細部を保持 |
| アーカイブ / 可逆 | 可逆 | PNG比20〜30% | ビットパーフェクトな品質保持 |
変換のヒント
- 品質65から始めて調整する。 AVIFの品質スケールはJPEGとは異なり、低い数値が必ずしも劇的に悪い品質を意味するわけではありません。AVIFの品質65は、JPEG品質82と同等に見えることが多いです。
- 実際の表示サイズで比較する。 AVIFのアーティファクトは、Webサイトで実際に表示されるサイズでは見えないことが多いです。ユーザーがフル解像度で表示する可能性のある画像の品質を確認する場合のみ、100%にズームしてください。
- テキスト入りグラフィックには可逆を使用する。 レンダリングされたテキスト、図表、ピクセルアートを含む画像には、シャープなエッジ周辺の圧縮アーティファクトを避けるために可逆AVIFを使用してください。
対応するすべてのフォーマット間の変換に関する幅広い概要については、画像フォーマット変換ガイドをご覧ください。
AVIFの利点と制限
AVIFは印象的なフォーマットですが、完璧ではありません。強みと弱みの両方を理解することで、いつ、どのように使用するかについて情報に基づいた判断ができます。
利点
クラス最高の圧縮効率。 テストデータが示すように、AVIFは同等の視覚品質で一貫して最小のファイルを生成します。写真コンテンツでは、JPEG(40〜50%)およびWebP(20〜33%)に対する節約は、ページ読み込み時間と帯域幅コストに有意な影響を与えるほど大きいです。
グラデーションと滑らかなトーンの優れた処理。 AVIFの10ビットおよび12ビット色深度サポートにより、微妙なグラデーションを持つ画像で8ビットのJPEGやWebPを悩ませるバンディングアーティファクトが解消されます。夕焼け空、スタジオの背景、ポートレートの肌の色調などが該当します。
将来を見据えたHDRサポート。 HDRディスプレイがノートPC、スマートフォン、モニターの標準になるにつれ、AVIFのネイティブHDR機能の価値はますます高まります。広くサポートされている他のWeb画像フォーマットで、同等のHDRサポートを提供するものはありません。
ロイヤリティフリーでオープン。 AVIFはロイヤリティフリーとして特別に設計されたAV1に基づいています。複雑な特許ライセンスを持つHEIC(HEVC/H.265ベース)とは異なり、AVIFはライセンス料なしで誰でも自由に使用できます。
強力な業界支援。 Alliance for Open Mediaには事実上すべての主要テック企業が含まれています。このレベルの支援により、当面の間、継続的な開発、最適化、ブラウザサポートが保証されます。
制限
遅いエンコード速度。 AVIFの最も重要な実用的制限です。エンコードにはJPEGの5〜20倍の時間がかかります。画像1枚あたりミリ秒ではなく数秒です。数百枚の画像をバッチ処理する場合、これは積み重なります。AV1エンコーダーの最適化は進行中で速度は大幅に改善されていますが、代替手段よりも遅いままです。
不完全なブラウザ対応。 グローバル対応率93%では、一部のユーザーを取り残さずにAVIFを唯一のフォーマットにすることはできません。フォールバック戦略が必要です。
限られたツールエコシステム。 主要ブラウザとOSはAVIFをサポートしていますが、多くの画像編集ツール、CMSプラットフォーム、CDNサービスはまだ追いついている最中です。一部の人気WordPressプラグインやWebサイトビルダーは、まだAVIFをネイティブに処理できません。
最大解像度の制約。 AV1はベースラインプロファイルで個々のフレームを8192×4352ピクセルに制限しています。事実上すべてのWeb画像には十分ですが、非常に高解像度の写真には制約となります。
実装の複雑さ。 AVIFの使用には、フォールバック用の<picture>要素、正しいMIMEタイプ設定(image/avif)、そしてAVIFバージョンを生成するためのビルドパイプラインの更新が必要になる場合があります。
段階的導入戦略:AVIF + WebP + JPEGフォールバック
AVIFの圧縮上の利点と現在のブラウザ対応の制限を考慮すると、2025年のほとんどのWebサイトにとって最適なアプローチは、各ブラウザが処理できる最良のフォーマットを配信する段階的導入戦略です。
3段階フォールバックパターン
HTML <picture> 要素を使用すると、優先順位で複数の画像ソースを指定できます。ブラウザはサポートする最初のフォーマットを選択します:
<picture>
<source srcset="hero.avif" type="image/avif" />
<source srcset="hero.webp" type="image/webp" />
<img src="hero.jpg" alt="画像の説明" />
</picture>
このパターンでは:
- 93%のブラウザがAVIFバージョン(最小ファイル)を受信
- 約4%のブラウザがWebPバージョン(JPEGよりはるかに小さい)を受信
- 約3%のブラウザがJPEGバージョン(ユニバーサルフォールバック)を受信
ブラウザがフォーマット選択を自動的に処理します。JavaScript不要、サーバーサイド検出不要、ユーザーエージェントスニッフィング不要。そのまま動作します。
実装上の考慮事項
ビルドプロセスで3つのフォーマットすべてを生成する。 画像最適化パイプラインを使用して、各画像のAVIF、WebP、JPEGバージョンを作成します。3バージョンのストレージコストは、各ユーザーに最適なフォーマットを配信することによる帯域幅の節約と比較すれば最小限です。
最も大きな画像にAVIFを優先する。 すべての画像の3バージョンを生成するのが過剰に感じる場合は、ヒーロー画像、商品写真、その他の大きな画像からAVIFバージョンの作成を始めてください。圧縮の節約効果が最も大きい画像です。アイコンやサムネイルなどの小さな画像は、WebPやPNGを引き続き使用できます。
サーバーのMIMEタイプを設定する。 Webサーバーが.avifファイルに対して正しいContent-Type: image/avifヘッダーを送信することを確認してください。ほとんどの最新Webサーバーとcdnは自動的に処理しますが、確認する価値はあります。
アナリティクスを監視する。 訪問者が実際にどのフォーマットを受信しているかを追跡してください。AVIFブラウザ対応が拡大するにつれ、最終的にはJPEGフォールバックを完全に廃止し、パイプラインをAVIF + WebPのみに簡素化できるかもしれません。
AVIFをスキップすべき場合(現時点で)
画像が主に小さなアイコンやロゴ(AVIFのWebPに対する優位性が控えめ)の場合、ビルドパイプラインが3つ目のフォーマットに対応できない場合、リアルタイム処理でエンコード速度がボトルネックになる場合、またはオーディエンス分析でAVIF対応ブラウザの使用率が低い場合は、WebP + JPEGにとどまることを検討してください。
写真コンテンツを配信するほとんどのWebサイトにとって、JPEGに対する30〜50%の節約はAVIFを導入する価値があります。各画像タイプに適したフォーマットを選択するための幅広い戦略については、画像圧縮完全ガイドをご覧ください。
AVIFの将来
AVIFの方向性は明確です。エンコーダーのパフォーマンスは向上し続けており、SVT-AV1は効率を維持しながらエンコード時間を短縮する大きな進歩を遂げています。Adobe Photoshop、GIMP、主要CDNプロバイダーがAVIFサポートを提供しており、ツールエコシステムは急速に追いついています。すべての主要ブラウザがこのフォーマットにコミットしているため、古いバージョンが退出するにつれてグローバル対応率は自然にWebPの97%レベルに向かって上昇するでしょう。アニメーションAVIFも成熟しつつあり、劇的に優れた圧縮でGIFに代わる高品質な選択肢を提供しています。
まとめ
AVIFは画像圧縮における真の世代的飛躍を表しています。すべての主要テック企業の支援を受けたAV1コーデックの上に構築され、同等の視覚品質でJPEGより40〜50%、WebPより20〜33%小さいファイルを生成します。ネイティブHDRサポート、広色域、10/12ビット色深度、ロイヤリティフリーライセンスを加えると、AVIFは現在Web向けに利用可能な最も高機能な画像フォーマットです。
2025年の実用的な現実として、AVIFは段階的戦略の一部として最も効果を発揮します。対応する93%のブラウザにはAVIFを配信し、さらに4%にはWebPにフォールバックし、JPEGをユニバーサルなセーフティネットとして維持します。<picture>要素を使用したこの3段階アプローチは実装が簡単で、すべての訪問者がブラウザが処理できる最小のファイルを受け取ることを保証します。
エンコード速度のトレードオフは現実的ですが管理可能です。事前処理されたアセット(ブログ画像、商品写真、マーケティンググラフィック)の場合、追加のエンコード時間はすべてのページビューで帯域幅削減として回収される一度きりのコストです。ユーザーアップロードのリアルタイム処理には、AVIFエンコーダーが高速化するまでWebPがより実用的な選択肢です。
まだAVIFを試していない場合、評価する最良の方法はご自身の画像で試すことです。最も大きな写真をいくつか変換し、現在のJPEGまたはWebPバージョンとファイルサイズと視覚品質を比較してみてください。数字が物語ってくれるでしょう。
画像をAVIFに変換する準備はできましたか?無料フォーマットコンバーターをお試しください。ブラウザ内で完全に動作し、JPEG、PNG、WebPとともにAVIFをサポートし、ダウンロード前に結果を比較できます。
関連記事:
