> ## Content Index
> Fetch the complete content index at: https://www.sakashita.page/llms.txt
> Use this file to discover other available public pages before exploring further.

# AVIFを使っていこうと思った話
- URL: https://www.sakashita.page/avif-image-format-usage/
- Published: 2025-12-19T13:00:38.000Z
- Updated: 2025-12-19T13:00:38.000Z
- Author: Sakashita Yasunobu
- Tags: 技術

## 以前の記事の振り返り

以前、[ブログで使うWeb用の画像のフォーマットについて検討する](https://www.sakashita.page/blog-image-formats-for-web/)で「Web用の画像フォーマット」を比較して、当時は **WebPがいちばん現実的**という結論にしていた。

[ブログで使うWeb用の画像のフォーマットについて検討する背景と目的 普段から写真撮影を行っていると、画像ファイルが占める容量は無視できない規模になる。現在はNASとAmazon Photosに保存しているため、容量的な制約は少ないものの、ファイルサイズが小さくできるのであれば小さくしておく方が合理的だ。特にWeb公開を前提とする場合、ファイルサイズはアップロード・ダウンロード、そしてページ表示時間に直結するため、可能な限り小さい方が望ましい。 これまでは現像ソフトからJPEG品質100で出力し、Web用途など容量削減が望ましいケースではWebPに変換してきた。RAWファイルは別途バックアップしてアーカイブとして保存している。目視で画質劣化が認められないのであれば、全てWebPで保存しても問題ないのではないかと考えたが、より優れたフォーマットが存在する可能性があるため、現在利用可能な画像フォーマットについて調査した。 主要な画像フォーマットの特徴 JPEG 最も広く普及している画像フォーマットで、互換性に関する信頼性は高い。しかし、規格自体が古く、現代的な圧縮技術と比較すると効率は劣る。 JPEGについて知っておくべきすべての![](https://storage.ghost.io/c/94/1f/941f9972-ad5c-4231-a438-ca329c85433f/content/images/icon/logo-1-3.png)SakashitaのブログSakashita Yasunobu![](https://storage.ghost.io/c/94/1f/941f9972-ad5c-4231-a438-ca329c85433f/content/images/thumbnail/blog-image-formats-for-web.webp)](https://www.sakashita.page/blog-image-formats-for-web/)

その後も基本はWebP運用で困っていなかったのだけれど、最近読んだ記事がかなり腑に落ちたので、ここで方針を更新しておく。

---

## きっかけになった記事

Qiitaのこの記事を読んだ。

- [画像圧縮するベストな方法（2025）](https://qiita.com/fukushima1981/items/deaf8e97df2d1b9d6865/likers)

[画像圧縮するベストな方法（2025） - Qiita![](https://storage.ghost.io/c/94/1f/941f9972-ad5c-4231-a438-ca329c85433f/content/images/icon/apple-touch-icon-ec5ba42a24ae923f16825592efdc356f-3.png)Qiita![](https://storage.ghost.io/c/94/1f/941f9972-ad5c-4231-a438-ca329c85433f/content/images/thumbnail/https-3A-2F-2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F214677%2Fprofile-images%2F1694592405)](https://qiita.com/fukushima1981/items/deaf8e97df2d1b9d6865/likers)

要点は、QP値をそろえて比較するのは「全く意味がありません．」という指摘と、比較するなら「横軸にbpp，縦軸に評価指標を並べたグラフを**RD曲線**と呼びます．」という話。

そしてまとめとしては「いろいろグラフをプロットして見ると，比較した範囲内では，AVIF（OpenCVでも使える）が性能が最も良さそうなことがわかりました．」という結論。

自分の理解としては、これまで「次世代フォーマット＝とりあえずWebPが無難」くらいの気持ちでいたけど、ちゃんとRD曲線で見ると、WebPは宣伝されているほど圧倒的でもない場面があるっぽい。

それなら、現状のブラウザ対応も含めて、写真用途はまずAVIFでいってよさそう、という判断になった。

---

## AVIFに寄せる判断

自分の用途は「写真をWebで見せる」なので、最優先は次。

- 見た目の品質を保ったまま軽くしたい
- 主要ブラウザで普通に表示できること
- 変換はバッチでやるので、エンコードが遅いのはある程度許容できる

この前提だと、

- **圧縮効率が強い**
- **デコード（表示）側は実用上そこまで問題になりにくい**

という点で、AVIFを優先していくのは合理的に思えた。

---

## 運用メモ（暫定）

当面はこの方針でいく。

- 写真の公開用は **AVIFを第一候補**

[GitHub - AOMediaCodec/libavif: libavif - Library for encoding and decoding .avif fileslibavif - Library for encoding and decoding .avif files - AOMediaCodec/libavif![](https://storage.ghost.io/c/94/1f/941f9972-ad5c-4231-a438-ca329c85433f/content/images/icon/pinned-octocat-093da3e6fa40-9.svg)GitHubAOMediaCodec![](https://storage.ghost.io/c/94/1f/941f9972-ad5c-4231-a438-ca329c85433f/content/images/thumbnail/libavif-1)](https://github.com/AOMediaCodec/libavif?tab=readme-ov-file)

- 互換性が気になる場面はフォールバックとして **JPEG / WebP** を併用
- 現像ソフトから直接出せない場合は、従来どおり中間生成（JPEG品質高めなど）→ 変換という流れ
- Ghost（少なくとも公式テーマ）だと、アップロード画像は結局リプロセス（変換・再圧縮）が入る前提で考えた方がよさそう。なので「勝手にWebP化される」こと自体は割り切りつつ、雑に大きい画像を投げるのは避ける（参考: [GhostPro supports webp or avif?](https://forum.ghost.org/t/ghostpro-supports-webp-or-avif/52595)）。

[GhostPro supports webp or avif?Hello, I searched here: And on this forum and don’t see my question answer already. For GhostPro customers are the official themes set to convert images to webp and/or avif? If not, how can I do that? So far I just see info on how to do this for self-hosted Ghost sites, editing the img helper, which I don’t think applies to GhostPro customers. Expected user story: for GhostPro customers any image they upload is converted to webp or avif. If not, if I upload webp will GhostPro serve that f…![](https://storage.ghost.io/c/94/1f/941f9972-ad5c-4231-a438-ca329c85433f/content/images/icon/f381b3b952df5ad42fe691a8b14aa7f0c96c461a_2_180x180-1.png)Ghost Forumneotint![](https://storage.ghost.io/c/94/1f/941f9972-ad5c-4231-a438-ca329c85433f/content/images/thumbnail/8d4e1be1543b3ed506f105953a0d062b84797e42-1.png)](https://forum.ghost.org/t/ghostpro-supports-webp-or-avif/52595)

---

## 今後やりたいこと

- 自分のブログで実際に「AVIF化でどれだけ軽くなったか」を数例でログとして残す
- 変換コマンドと設定（品質、速度、色差など）を固定して手順化する