UltKit

AVIFをWebPに変換

AVIFは新しく、たいていはより軽量なWeb向け画像形式ですが、対応している端末やCMSの数ではいまもWebPが上回ります。古いiPhoneやMacでもサイトを表示させたいときや、CMSがアップロードを受け付けないときは、AVIFをWebPに変換しましょう。最新の圧縮効率と透過はそのまま保てます。

画像変換

またはJPG, JPEG, JPE … ファイルをここにドロップ ·

1ファイルあたり最大95 MB· 最大20ファイルまで· 30分後に削除

出力

ファイルは当社のサーバーで処理され、30分後に削除されます。

このツールの使い方

  1. 1

    AVIF画像を追加する

    デザインの書き出しデータ、画像CDNからのダウンロード、サイトのバックアップなどにある .avif ファイルを、1つ95 MBまで、最大20個アップロードします。

  2. 2

    非可逆か可逆かを選ぶ

    音質の初期値は85で、すでに非可逆のAVIFになっている写真に適しています。詳細設定の可逆にチェックを入れるのは、フラットなグラフィックや、可逆で保存されたAVIFの場合だけにしてください。

  3. 3

    「WebPに変換 →」を押す

    WebPを1つずつ、またはZIPにまとめてダウンロードします。透明部分は透明のまま残り、ファイルは30分後に削除されます。

結論から言うと、ブラウザー、プラグイン、ホストがAVIFに対応していない場合は、品質85でAVIFをWebPに変換してください。サイズ効率はわずかに下がりますが、透過は保たれ、現在使われているほぼすべてのデバイスで読み込めるファイルになります。

2026年にAVIFをWebPに変換する理由

AVIFは2019年にAlliance for Open Mediaが公開した形式で、動画コーデックのAV1を静止画に使っています。同じ見た目の品質なら、特になめらかなグラデーションのある写真で、たいていWebPよりサイズが小さくなります。ただし対応は段階的に進みました。Chrome 85が2020年、Firefox 93が2021年、Safariは2022年のバージョン16からで16.4まで不具合があり、Edgeは2024年1月のバージョン121とかなり遅れました。

WebPは2010年にGoogleが公開した形式で、2020年のSafari 14以降、主要なブラウザーすべてで表示できます。iPhone 7や6sのようにiOS 15までしか使えないスマートフォンでも、WebPは表示できますがAVIFは表示できません。更新できない環境でAVIFが表示されない場合、WebPが最も近い代替です。両者の違いについては、AVIF、HEIC、WebPの解説もご覧ください。

ブラウザとWordPressのAVIF・WebP対応状況

from ↓ · to →AVIFWebP
Chrome 85以降Chrome 85以降 to AVIF: yesChrome 85以降 to WebP: yes
Firefox 93以降Firefox 93以降 to AVIF: yesFirefox 93以降 to WebP: yes
Safari 16.4以降Safari 16.4以降 to AVIF: yesSafari 16.4以降 to WebP: yes
Safari 14–16.3– Safari 14–16.3 to AVIF: noSafari 14–16.3 to WebP: yes
Edge 121以降Edge 121以降 to AVIF: yesEdge 121以降 to WebP: yes
Edge 18–120– Edge 18–120 to AVIF: noEdge 18–120 to WebP: yes
WordPress 5.8–6.4– WordPress 5.8–6.4 to AVIF: noWordPress 5.8–6.4 to WebP: yes
WordPress 6.5以降WordPress 6.5以降 to AVIF: yesWordPress 6.5以降 to WebP: yes
supported not offeredSafari 16.0–16.3では、OSのバージョンによって一部のAVIF画像が表示されます。非対応として扱ってください。WordPress 6.5以降は、サーバーの画像ライブラリがデコードできる場合にのみAVIFを受け付けます。

AVIF

AV1 Image File Format

AVIFは、AV1動画コーデックで圧縮した静止画と画像シーケンスを保存する形式で、2019年にAlliance for Open Mediaが仕様を確定しました。同じ見た目の品質なら、通常JPEGやWebPよりファイルが小さくなり、透過、アニメーション、広色域、HDRにも対応します。エンコードは従来の形式より遅く、低品質設定では非常に細かいテクスチャーがなめらかになりすぎることがあります。主要なブラウザーはすべてAVIFを表示できますが、多くのデスクトップアプリ、SNS、古い端末では開けません。

圧縮方式
非可逆または可逆
透過
対応
アニメーション
対応
登場時期
2019 · Alliance for Open Media
AVIF 変換

WEBP

WebP 画像

WebP は、ウェブページの表示を速くするために Google が 2010 年に公開した画像形式です。非可逆圧縮と可逆圧縮の両方、アルファ透過、アニメーションを 1 つの形式で扱えます。非可逆 WebP は、同程度の画質の JPEG と比べて一般に 25–35% 小さくなり、可逆 WebP も通常は PNG より小さくなります。現行のブラウザーはすべて対応していますが、古いデスクトップソフト、印刷サービス、アップロードフォームの中には、今でも受け付けないものがあります。Windows、macOS、最近のほとんどの画像編集ソフトで WebP を開けます。

圧縮方式
非可逆または可逆
透過
対応
アニメーション
対応
登場時期
2010 · Google
WEBP 変換

AVIFをWebPに変換するのは、最新の圧縮と透過を維持しながら、AVIFにまだ対応していないブラウザー、スマートフォン、CMSホストでも表示できるようにするためです。WebPからAVIFへの変換はその逆で、すべての訪問者がデコードできる環境で、さらにバイト数を削減する目的で行います。

AVIFからWebPに変換すると何が変わるか

WebPで得られること

  • 古いSafari、Edge、iOS 15の端末でも表示できる
  • WordPress 5.8以降で、ほぼどのホストでも受け付けられる
  • アルファチャンネルを保持できる
  • 低性能なスマートフォンでもエンコード・デコードが速い

手放すこと

  • ファイルは通常AVIFよりやや大きくなる
  • 8ビットのみのため、HDRや10ビットのAVIFは平坦化される
  • 非可逆の元画像では2回目の非可逆エンコードになる

AVIFをWebPに変換:画質と可逆圧縮の設定

設定は、AVIFがどのように作られたかに合わせてください。Web上のAVIFの多くは非可逆の写真なので、品質85の非可逆WebPなら、見た目を保ったまま軽量にできます。単色の面、文字、シャープな輪郭を持つグラフィックでは可逆が効果的です。WebPの可逆モードは、まさにそうした画像のために設計されているからです。

WebPにはそれ以上のビット深度がないため、HDRや10ビットのAVIFは8ビットにトーンマッピングされます。Web配信では色空間をsRGBのままにしてください。<picture> 要素用のフォールバックを用意する場合は、元のAVIFをWebPと一緒に残しておきます。どちらの形式も不要なページには、すべて可逆で保てるAVIFをPNGに変換が便利です。

AVIFのWebP変換に関するよくある質問

AVIFのほうが軽いのに、なぜWebPに変換するのですか?

ファイルが小さくても、表示されなければ意味がないからです。バージョン16.4より前のSafari、iOS 15以降に更新できないiPhone、バージョン121より前のEdge、そして多くのWordPressホストは、AVIFに対応していないか、一部しか対応していません。WebPならそのすべてで表示でき、JPGやPNGよりはるかに軽量です。

AVIFをWebPに変換すると画質は落ちますか?

非可逆のAVIFを非可逆のWebPに再エンコードすると、圧縮が2回かかるため、細部がわずかに失われます。品質85であれば、写真での差はほとんど分かりません。非可逆のAVIFを可逆のWebPに変換しても失われた細部は戻らず、ファイルがはるかに大きくなるだけです。

AVIFをWebPに変換するとき、「可逆圧縮」はいつ選ぶべきですか?

AVIF自体が可逆の場合や、ロゴ、グラフ、UIのスクリーンショットのようなフラットなグラフィックの場合です。可逆WebPなら、そうした画像を劣化なくコンパクトに保存できます。写真には、80〜90の非可逆WebPが適切な設定です。

透過AVIFはWebPに変換しても透過のままですか?

はい。どちらの形式も完全なアルファチャンネルを持つため、商品の切り抜き画像やロゴは、塗りつぶし色なしで透明な背景のまま保たれます。

WordPressでAVIFをアップロードできないのはなぜですか?

WordPressは2024年のバージョン6.5でAVIFに対応しましたが、サーバーの画像ライブラリが処理できる場合に限られます。古いバージョンのWordPressや、GDまたはImagickがAVIFに対応していないホストでは、アップロードに失敗します。WebPはバージョン5.8から受け付けられており、ほぼすべてのホストで扱えます。

AVIFとWebPを併用して配信すべきですか?

HTMLを自分で管理できるなら、その通りです。<picture> 要素の中でAVIFを先に、WebPを後に指定すれば、各ブラウザーが対応している最初の形式を選びます。変換すれば、そのWebPのフォールバックが用意できます。どちらも不要なアプリ向けには、AVIFをJPGに変換をご利用ください。

ほかのファイルをWebPに変換
PNGをWebPに変換JPGをWebPに変換GIFをWebPに変換
SVGをWebPに変換HEICをWebPに変換画像をWebPに変換