WebP, AVIF and JPEG

This page is about the formats themselves rather than about our plugin, and none of it will change when the software ships. If you are deciding what to switch on, this is the background.

The three formats worth caring about#

JPEG is thirty years old, universally supported, and still perfectly good at photographs. It has no transparency and no lossless mode worth using.

WebP is supported by every browser in current use, including Safari since version 14 (2020). At equivalent perceived quality it is roughly 25–35% smaller than JPEG for photographic content. It supports transparency, which means it can replace PNG as well.

AVIF is smaller again — commonly 20–30% below WebP — and is supported by Chrome, Firefox, Edge and Safari 16.4 onwards. Its weakness is encoding cost: AVIF is markedly slower to produce than WebP, which matters when you are converting ten thousand images rather than one.

Why the original is always kept#

Converted images are served through a <picture> element, which offers each format in turn and lets the browser take the first one it understands:

<picture>
  <source srcset="/uploads/2026/03/harbour.avif" type="image/avif" />
  <source srcset="/uploads/2026/03/harbour.webp" type="image/webp" />
  <img
    src="/uploads/2026/03/harbour.jpg"
    alt="Fishing boats at low tide"
    width="1600"
    height="1067"
  />
</picture>

The <img> at the end is not a formality. It is what a browser without AVIF or WebP support gets, what an email client gets when somebody copies your post, and what survives if the converted derivatives are ever deleted. Deleting the original to save disk is the one optimisation here that cannot be undone.

Quality settings, honestly#

Encoder quality numbers are not comparable between formats. WebP at 80 is not “the same as” JPEG at 80, and AVIF’s scale is different again. The useful approach is:

1. Pick one representative image from your site — a photograph with a large flat area, like a sky, is the cruellest test.
2. Encode it at a few settings and look at the flat area at full size. Banding and blotching show up there first.
3. Use the lowest setting where you cannot see the difference, and then leave it alone.

For photographic content, WebP somewhere in the high 70s to mid 80s is where most sites land. Screenshots and line art are a different problem: they compress badly in lossy formats and are better served as PNG or as lossless WebP.

What this means for EXIF#

Camera files carry metadata: exposure, lens, often GPS coordinates. Re-encoding is the moment that metadata is either preserved or dropped, and it is worth being deliberate about which.

What to read next#

Bulk regenerate covers applying a format decision to a library that already exists, and why that is a resumable queue rather than a button.