WebP and AVIF images: why modern formats make product pages faster

WebP and AVIF produce images far smaller than JPEG or PNG at similar quality. See how to serve them on your store and how the audit checks it.

2 min read

Area

Speed

Severity

Low

Fix effort

Small

Stores failing

17%

Of 177 stores we scanned where this check applies, 17% fail it and 46% pass. See all benchmarks.

Modern image formats such as WebP and AVIF compress photos much better than JPEG or PNG at the same visible quality. Serving them cuts image weight, which is the largest part of most ecommerce pages. This check looks at whether your images arrive in a modern format.

Why it matters

Product photography is the reason shoppers trust a store, and also the reason pages are heavy. A format change cuts the bytes without touching the photo, so it is one of the cheapest speed fixes available.

Hosted platforms often convert automatically when the source image is sensible. Self-hosted stores usually need a plugin or a CDN to do it.

What the audit looks at

The audit looks at what share of your images are served as WebP or AVIF.

What usually causes it

  • Images uploaded as PNG when a JPEG or WebP would do
  • A self-hosted store with no image optimisation plugin or CDN
  • Theme images hard-coded with .jpg or .png paths
  • Third-party widgets serving their own unoptimised images

How to fix it

Serve images as WebP or AVIF instead of JPEG or PNG. The effort is small, usually a setting or a paste and under 30 minutes.

  1. WebP is typically 25-35% smaller than JPEG at the same visual quality, and is supported everywhere that matters.
  2. Convert at the source rather than at request time so the saving is permanent.

On Shopify

  1. Anything served from the Shopify CDN is already format-negotiated per browser -- Shopify returns AVIF or WebP on its own, whatever size you ask for, including from a hardcoded img tag.
  2. The ones still in the original format are images hosted outside the Shopify CDN (an app's own host, a pasted external URL) or theme code forcing format: "jpg" or "png" on image_url. Those are what to find.

On WooCommerce

  1. Install an image optimisation plugin with WebP conversion and run a bulk pass over the existing library.
  2. Confirm it serves WebP through a element or content negotiation, not only for new uploads.

How to check it yourself

  1. Open Chrome DevTools, go to Network, filter by Img and look at the Type column.
  2. Right-click a product image and open it in a new tab. The file extension and a size check show the format served.
  3. Compare file sizes before and after converting a sample image.

Frequently asked questions

Do all browsers support WebP and AVIF?

WebP is supported by all current major browsers. AVIF support is also broad, and tools that serve it normally fall back to another format where it is missing.

Will converting images reduce quality?

At sensible settings the difference is not visible to shoppers, and the file is often a third to a half of the size.

Check your own store

See whether your store passes this check

Paste your store URL. The audit loads your pages in a real browser and shows the result for this check with the evidence behind it.

Part of Speed checklist for ecommerce stores