WebP and AVIF for e-commerce: when they actually help

WebP and AVIF both produce smaller files than JPEG at comparable quality. The figures usually quoted are around 25 to 35% smaller for WebP and 40 to 50% for AVIF.

Whether that is useful to you depends on a question the comparisons never ask: who serves the image to the shopper?

The distinction that decides it

On your own site, you serve the file. Choosing a better format directly reduces what your visitors download, and that is worth real money in page speed.

On a marketplace, you upload a file and they re-encode it. Amazon, Etsy, eBay and Walmart all process uploads into their own formats at their own sizes and serve those. Your carefully optimised AVIF is decoded, resized and re-encoded into whatever they use.

So on a marketplace, the format you upload affects almost nothing about what shoppers receive. It affects only whether your upload is accepted and how long it takes.

Which means, for marketplace sellers

Upload JPEG. It is universally accepted, it is what every uploader expects, and the recipient will re-encode anyway. Choosing a clever format buys you nothing and risks a rejection.

The one exception is file size limits. Walmart's own guidance recommends 2000 x 2000 while capping at 1MB, which is a tight combination on a detailed product. If a format is accepted and gets you under a limit without dropping quality as far, it is worth using. Check acceptance first, several marketplaces still list only JPEG, PNG and sometimes GIF.

For your own store

Here it genuinely matters, and the answer is to serve several formats and let the browser choose.

<picture>
  <source srcset="product.avif" type="image/avif">
  <source srcset="product.webp" type="image/webp">
  <img src="product.jpg" alt="Product name">
</picture>

The browser takes the first format it supports. Modern browsers get AVIF, slightly older ones get WebP, anything else falls back to JPEG. No detection code, no server logic.

Shopify, WooCommerce and most hosted platforms do a version of this automatically. If you are on one of those, generating WebP yourself is duplicated effort.

The formats compared honestly

JPEG. Universal. No transparency. Compresses photographs well and hard edges badly. Twenty-five years of tooling behind it.

PNG. Lossless, supports transparency. Files are much larger for photographs, often five to ten times a JPEG, because lossless compression cannot exploit the fact that you will not notice small changes. Right for logos, graphics and anything needing a transparent background.

WebP. Both lossy and lossless modes, supports transparency, roughly 25 to 35% smaller than JPEG at similar quality. Supported everywhere that matters now. The pragmatic modern default for the web.

AVIF. Best compression of the four, supports transparency and wide colour. Encoding is noticeably slower, often several times slower than JPEG for the same image, which matters when you are processing four hundred. Support is good but marginally behind WebP.

Two things the comparison charts leave out

Encoding time is not free. On a batch of several hundred images, AVIF encoding can turn a two-minute job into a ten-minute one. On a single hero image, irrelevant. On a catalogue, it is the difference between a coffee and an afternoon.

Quality numbers do not transfer between formats. WebP quality 80 is not JPEG quality 80. The encoders use different scales entirely, and porting a number across usually produces either a bloated file or a visibly worse one. Judge by result, or by file size target.

How to find out what a marketplace actually serves

You do not have to take anyone's word for what happens to your upload, including mine. Check it directly.

Open one of your own live listings, right-click the main product image and choose "Open image in new tab". Look at the URL and the file extension. Then open your browser's network inspector, reload, and find the image request: the response headers will name the content type outright.

What you will typically find is that the file you uploaded has been resized to several fixed dimensions, re-encoded, and served from a content delivery network under a generated filename. Often in WebP, to browsers that accept it.

Do this once for each marketplace you sell on and you will know precisely how much your upload format matters, which for most sellers turns out to be less than the optimisation guides imply.

What survives re-encoding and what does not

Re-encoding is lossy, so it is worth knowing what it costs you.

Sharpness survives poorly. A downscale-and-re-encode softens fine detail. This is an argument for uploading a sharp image rather than a large one, extra pixels beyond the marketplace's target size are discarded, but sharpness within the target size carries through.

Colour usually survives, provided the file was tagged sRGB. An untagged wide-gamut file is where colour goes wrong, and the marketplace's re-encode will faithfully preserve the mistake.

Transparency does not survive on most marketplaces, because they composite onto a background, often white, sometimes black. An accidental transparent area in a PNG can arrive as a black patch.

Metadata does not survive. EXIF, including orientation and colour profile, is usually stripped. Which is why the rotation has to be applied to the pixels before upload rather than left as a tag.

A simple policy

• Marketplace listings: JPEG at 85 to 92, unless a size limit forces otherwise.
• Your own store: WebP as the default, AVIF as an additional source if your platform makes it easy, JPEG as the fallback.
• Anything needing transparency: PNG, or WebP if your platform supports it.
• Masters and archives: keep the original RAW or a lossless copy. Never re-save a JPEG repeatedly.

The reason to have all four available is not that you will use all four. It is that the right answer differs between the marketplace listing and the product page on your own site, and those are two different files from the same photograph.