AVIFify

WebP

.webp

Google's raster format with near-universal browser support, transparency, and animation. A practical fallback when you serve AVIF to capable clients.

rasterbothTransparencyAnimation97% browser support

WebP is the format you pair with AVIF as a fallback when you want maximum compression today without leaving any visitor behind. Google released it in 2010 as a still-image spin-off of the VP8 video codec, and by 2026 it reaches roughly 97% of browsers — wide enough to catch the few clients that cannot yet decode AVIF. This page explains where WebP sits relative to AVIF: the features it shares, the speed it wins on, the bytes AVIF saves over it, and the exact <picture> markup that serves both.

Need a smaller image right now? Convert in your browser with no upload: Convert JPG to AVIF, Convert PNG to AVIF, Convert AVIF to JPG, and Convert AVIF to PNG.

Where WebP came from

WebP is a Google image format built on the VP8 video codec. Google announced it on 30 September 2010, months after acquiring VP8 with the On2 Technologies purchase. The pitch was simple: JPEG dated to 1992 and PNG to 1996, while video codecs had advanced far past both.

The format grew in stages:

  • 2010 — lossy-only first release, derived from VP8 intra-frame coding.
  • 2011–2012 — lossless mode, 8-bit alpha transparency, and animation added.
  • 2018–2020 — the last major browsers shipped support, completing adoption.

AVIF followed the same playbook nine years later. AVIF is the still-image profile of the AV1 video codec, just as WebP is the still-image profile of VP8. Reading the AVIF format overview alongside this page shows two generations of the same idea.

What WebP and AVIF share

WebP and AVIF cover the same four capability classes: lossy compression, lossless compression, alpha transparency, and animation. That overlap is why they slot together in one <picture> element so cleanly.

The shared feature set breaks down as:

  • Lossy mode — VP8 prediction in WebP, AV1 prediction in AVIF, both beating JPEG.
  • Lossless mode — WebP's dedicated lossless codec, AVIF's lossless AV1 path.
  • Alpha transparency — full 8-bit alpha in WebP, up to 12-bit alpha in AVIF.
  • Animation — multi-frame sequences in both, replacing animated GIF.

For choosing between lossy and lossless in either format, see Lossy vs Lossless Compression.

How much smaller WebP is than JPEG

WebP files are typically 25–34% smaller than JPEG at matched visual quality. The saving comes from VP8's neighbour-aware block prediction, which JPEG's independent 8×8 DCT blocks cannot replicate.

The advantage is content-dependent:

  • Smooth-toned photos — largest savings, because prediction is highly effective.
  • Logos and flat-fill graphics — lossless WebP runs roughly 25% smaller than PNG.
  • Noisy or heavily textured images — smaller savings, since prediction has little to exploit.

These numbers are the baseline AVIF then improves on. See AVIF vs JPG for matched-quality JPEG test images.

Why WebP is the ideal AVIF fallback

WebP reaches about 97% of global browsers in 2026, per WebP support tables on caniuse. AVIF reaches roughly 93%, so WebP covers the ~4-point gap exactly.

The browser timeline closed slowly:

  • Chrome and Opera — support from the 2010–2011 launch window.
  • Firefox — version 65, January 2019.
  • Safari — version 14, September 2020, on macOS Big Sur and iOS 14.

That Safari 14 milestone is what makes WebP safe as a universal second tier. The remaining ~3% is legacy Internet Explorer in regulated enterprises and unpatched Android WebViews. A JPEG or PNG <img> covers even that tail. The AVIF Browser Support guide details the full fallback chain.

Where WebP beats AVIF

WebP wins on speed and tooling maturity, not compression. Two concrete advantages keep it relevant:

  • Encoding is 5–10× faster — WebP encodes a typical photo in milliseconds; high-effort AVIF can take seconds. This matters for on-the-fly conversion and large build pipelines.
  • Decoding is roughly 2× faster — on older mobile CPUs, AVIF can add 20–50ms per image to render time, partly offsetting its byte savings.

WebP's tooling is also more mature. libwebp, Sharp, ImageMagick, Pillow, and Photoshop (since 23.2, February 2022) all handle WebP without friction. For an end-to-end speed walkthrough, see AVIF Optimization.

Where AVIF beats WebP

AVIF is 20–25% smaller than WebP on photographic content at equivalent quality, the widest margin at low and medium bitrates. It also exceeds WebP on colour fidelity.

AVIF's structural advantages over WebP are:

  • 10-bit and 12-bit colour — WebP is 8-bit only, so AVIF shows far less gradient banding.
  • HDR and wide gamut — AVIF supports BT.2020 and Display P3; WebP supports neither.
  • Film grain synthesis — AVIF re-adds grain on decode, which WebP cannot do.

The trade-off is encoding cost, covered in AVIF Compression Settings. For a full head-to-head, see AVIF vs WebP.

Serve AVIF first, WebP second, JPEG last, using the <picture> element. The browser picks the first source it can decode, with no JavaScript:

<picture>
  <source type="image/avif" srcset="/photo.avif" />
  <source type="image/webp" srcset="/photo.webp" />
  <img src="/photo.jpg" alt="…" width="1200" height="675" loading="lazy" decoding="async" />
</picture>

This ordering gives each visitor the smallest file their browser supports. AVIF users get the maximum saving; the ~4% without AVIF still get WebP; the final ~3% get JPEG. In Next.js, set images.formats to ["image/avif", "image/webp"] and next/image negotiates the same chain automatically. Cumulative byte savings here directly improve Core Web Vitals for images.

Frequently asked questions

Should I still use WebP if AVIF exists?

Yes — as the fallback, not the primary. AVIF is 20–25% smaller, but ~4% of browsers cannot decode it. Pairing AVIF with WebP captures the best compression while keeping near-universal reach.

Is WebP better than JPEG and PNG?

Yes for the web. WebP is 25–34% smaller than JPEG and ~25% smaller than PNG at matched quality, with alpha transparency in both modes. Keep JPG or PNG only for email and Open Graph images, where decoder support is inconsistent.

Does WebP support transparency and animation?

Yes to both. WebP offers a full 8-bit alpha channel and multi-frame animation, the same feature classes as AVIF. GIF, by contrast, allows only 1-bit transparency.

Can I convert WebP to AVIF on this site?

Convert via a common source format. This site converts JPG and PNG to and from AVIF entirely in your browser: Convert JPG to AVIF and Convert PNG to AVIF. Camera formats like HEIC follow the same convert-before-publishing rule.

Sources and further reading

Related comparisons