テクニカル
AVIF
AV1動画技術ベースの次世代画像フォーマット。WebPよりさらに高い圧縮率を誇る。
AVIFとは？
AVIF（AV1 Image File Format）は、動画コーデックAV1の技術を画像に応用した次世代フォーマットです。
WebPやJPEGよりさらに高い圧縮率を実現し、同画質でより軽量になります。
高画質を保ちつつ大幅な軽量化ができるため、表示速度（LCP）改善の切り札になります。
対応ブラウザは拡大中で、フォールバックを用意すれば実用段階です。
AVIFの使い方・実践方法
AVIF活用のポイントは次のとおりです。
<picture>でAVIF→WebP→JPEGの順にフォールバック- 変換に時間がかかるためビルド時に事前生成
- 写真など階調の多い画像で効果が大きい
- 対応状況を確認しつつ段階導入
AVIFで押さえるべきポイント
AVIFは圧縮率が高い反面、エンコードに時間とCPUを要します。
配信時に都度変換するのではなく、ビルドやアップロード時に事前生成しておくのが、運用負荷を抑えつつ恩恵を得るコツです。
AVIFを実践するなら
Saguru なら、月額270円から、SEOキーワード調査・上位サイト分析・自サイトSEO診断のすべてが使えます。
「AVIF」を理解した上で、すぐに実践に移せます。
登録なしで1日5回まで無料 ／ メール登録で1日30回 ／ ベーシック月額270円 ／ 自サイトをSEO診断
AVIFについてよくある質問
AVIFはWebPの上位互換？
圧縮率は上ですが、対応範囲と変換速度ではWebPに分があります。
両者の併用が現実的です。
両者の併用が現実的です。
AVIF非対応ブラウザはどうなる？
<picture>で指定すれば、自動的にWebPやJPEGにフォールバックします。導入のデメリットは？
エンコードが重い点です。
事前生成で運用負荷を回避できます。
事前生成で運用負荷を回避できます。