WebPで解決
WEBで使う画像として最適だと言われたWebP。
私のサイトにある画像はすべてWebPに置き換えました。
このWebPは、つい先日出てきたばかりと記憶していますが、おじさんの時間感覚なんでしょうね。
Wikipediaには2010年に登場とありました。
AVIF
颯爽と登場
今度は新たな規格としてAVIFというものが登場しました。
WebPを上回る画像圧縮率を誇り、その他にもアニメーション画像にも対応していたりします。
2019年に規格が定まったとWikipediaにありました。
2024年1月、AVIFが主要ブラウザで対応
大きなインパクトですね。
AVIFが主流になる道筋ができあがったように感じます。
うちのサイトもAVIFにしようかな・・・。
対応アプリ
Photoshopの標準機能ではAVIFの出力に対応していないのね。
Gimpで対処しましょうかね。
一括で変換するなら、ImageMagickとかのツールかな。
サンプル画像
画像は横400px、縦711pxのものです。
元画像のJPEG(表の左)を使って、GimpでWebPとAVIFに出力しました。
品質70
形式 | JPEG | WebP | AVIF |
---|---|---|---|
画像 | |||
品質 | 100 | 70 | 70 |
サイズ | 205KB | 25KB | 24KB |
品質50
形式 | JPEG | WebP | AVIF |
---|---|---|---|
画像 | |||
品質 | 100 | 50 | 50 |
サイズ | 205KB | 20KB | 19KB |
所感
WebPとAVIFの違いがわかりませんね。
見た目も容量ほぼ同じなので、どちらでも好きな方でって感じ。
画像の大きさが変わってくると、また違うのかな。
結論
まじめに検証されているサイトで確認しよう。