Improved Compression with Automatic Content Negotiation

AVIF and WebP are both modern image formats that offer exceptional compression performance with minimal loss in quality. AVIF, based on the AV1 codec, often produces smaller files than WebP and supports advanced features such as HDR, wide color gamut, and better transparency handling. WebP, developed by Google, also supports lossy and lossless compression, transparency, and animation.

Historically, support for these formats varied across browsers. But today, all major browsers—including Chrome, Firefox, Safari (14+), Edge, and Opera—support AVIF and WebP, enabling developers to safely adopt them in production.

Using these formats can significantly reduce image file sizes. Our customers typically see images reduced to about half their original file size—with no perceptible drop in quality. To make the most of these efficiencies, Imgix provides Automatic Content Negotiation (auto=format), which automatically serves AVIF or WebP (depending on browser support) without requiring any additional logic on your end.

For a complete list of output formats supported by Imgix, including AVIF, WebP, PJPEG, and JPEG XR, refer to the format parameter documentation.

How Automatic Content Negotiation Works

Choosing the best format for each user can be tricky. For instance, delivering AVIF to a browser that doesn’t support it will result in broken images. Imgix simplifies this with auto=format, which intelligently determines the best output format based on browser headers and user agents, serving AVIF, WebP, or the fallback format accordingly—and caching the result properly.

Just add auto=format to your image URL:

Edit in Sandbox

This will return AVIF for browsers that support it, WebP for those that don’t support AVIF but do support WebP, and JPEG (or another fallback format) for older browsers.

You can still use the q (quality) parameter to control output quality across all formats:

Edit in Sandbox

Graceful Fallback with fm

To ensure consistency and transparency across all devices, use the fm (format) parameter as a fallback in addition to auto=format. For example, to ensure alpha transparency is preserved, you might specify fm=png:

https://static.imgix.net/feature-retina.png?fm=png&auto=format

This combination will serve AVIF or WebP if supported, and fall back to PNG when needed.

Both AVIF and WebP support lossless modes. To explicitly request lossless compression:

https://static.imgix.net/feature-retina.png?fm=png&auto=format&lossless=1

Results and How We Measured

We’ve seen an average decrease in file size of 41% across all of our customers for images served in the newer file formats (WebP and JPEG XR). One particularly photo-heavy customer saw file size decreases of 18-74% for every image in their entire image set.

Because it was mentioned in a Hacker News thread, here’s an explanation of how we obtained our numbers.

1. We randomly sampled ~1% of image requests from the set of image requests from our customers who were testing content negotiation in our beta. This yielded 1,159,515 records for about a 48 hour window.

2. We isolated and de-duplicated all requests that were returned as JPEG, or PNG. This yielded 118,037 unique image requests.

3. We isolated and de-duplicated all requests that were returned as WebP or JPEG XR. This yielded 119,303 unique image requests. A single JPEG or PNG may be served as both WebP and JPEG XR depending on the browser support or never served as one of these formats. This is why the numbers differ from the previous bullet.

4. We outer-joined unique original formats to unique new formats. This gave us the ability to compare the file size of JPEG or PNG against their WebP and JPEG XR equivalents. This yielded 123,791 comparisons.

5. We then measured the comparisons to arrive at the numbers we included in this tutorial. We included statistical percentiles and average numbers.