JPG, PNG, WebP or AVIF: which image format to use, with measured sizes

The same two photos encoded to equal visual quality in four formats. AVIF came out 40–45 % smaller than JPEG; WebP did not. When each format is the right choice, and when a PNG is a mistake.

The short version

For photographs, JPEG is still fine and AVIF is much smaller; WebP sits in between and its advantage over a well-encoded JPEG is smaller than the usual marketing figure. For screenshots, logos, diagrams and anything with flat colour or transparency, PNG or lossless WebP — never JPEG. Below are the numbers behind that, from an actual encode run rather than a vendor chart.

What “smaller” has to mean

Comparing formats at the same “quality 80” setting is meaningless: the quality scale is different for every encoder. The only fair comparison is same visual result, what size? For this article each format was encoded at rising quality until it reached the same structural similarity (SSIM 0.98 against the original, measured on luminance) and the size at that point was recorded. Two test photographs: an espresso cup on a table (1200 × 800) and a portrait (1024 × 1024), both public-domain sample images. Encoders: libjpeg-turbo, libwebp (method 6) and libavif (speed 4) through Pillow 12; the site’s own tools use MozJPEG, which typically shaves a further 5–10 % off the JPEG figure.

Format Photo 1 (1200×800) Photo 2 (1024×1024) Setting reached
JPEG 95 KB 86 KB q68 / q66
WebP 104 KB 76 KB q86 / q84
AVIF 59 KB 47 KB q60 / q58
PNG (lossless) 1 223 KB 1 034 KB —
WebP lossless 860 KB 701 KB —

Two things stand out. AVIF is 38–46 % smaller than JPEG at the same SSIM — that part of the story is true. WebP, on these photos, is roughly a wash with JPEG: 9 % larger on one, 12 % smaller on the other. The often-quoted “25–34 % smaller than JPEG” comes from Google’s 2010 study against an unoptimised JPEG encoder at fixed quality settings; against a modern encoder at matched quality the gap mostly closes. One caveat in WebP’s favour: it handles fine detail and sharp edges a little better than JPEG at low bitrates, which SSIM under-rewards. Another against: WebP caps chroma at 4:2:0 subsampling, so saturated red text on a photo blurs slightly where a JPEG at 4:4:4 would not.

A caveat on the test itself: both sources were JPEGs already, so every encoder was compressing compression artefacts along with the picture. Starting from a RAW or PNG original, all three lossy formats would come out a little smaller, and the ranking would not change.

PNG is for a different kind of picture

The table shows PNG at twelve times the size of the JPEG. That is not PNG being bad; it is PNG being asked to do the wrong job. PNG is lossless — every pixel comes back exactly — and photographs have noise in every pixel, which does not compress. On the third test image, a cut-out illustration with flat colour and a transparent background (900 × 600), the picture reverses:

Format Size
PNG 66 KB
WebP lossless 55 KB
AVIF q80 54 KB
JPEG q90 76 KB, and the transparency is gone

Flat colour, text, screenshots, charts, logos: PNG or lossless WebP. A JPEG of a screenshot shows ringing around every letter and is usually larger than the PNG. A photo saved as PNG is a megabyte-scale mistake that shows up in page-load times and e-mail bounces.

Browser and app support, honestly

  • JPEG: everything, since 1992. The safe choice for anything leaving your control — printing services, government forms, old Android phones, Word documents.
  • PNG: everything since about 2005.
  • WebP: all current browsers (Safari from 14, 2020). Windows Photos opens it; older versions of Office, most photo kiosks and many upload forms still do not.
  • AVIF: Chrome 85+, Firefox 93+, Safari 16.4+ (2023), Edge 121+. Outside the browser, support is thin: Windows needs a Store extension, macOS Ventura+ opens it natively, most other software does not. As of 2026 it is a format for serving images on the web, not for handing them to people.
  • HEIC: Apple devices only, for practical purposes — see What is HEIC.

Which to pick

  • Sending a photo to a person or a form: JPEG, quality 80–85. Anything above 90 doubles the size for a difference no one can see.
  • Photos on your own website: AVIF with a JPEG fallback (<picture>), or WebP if your image pipeline cannot produce AVIF yet.
  • Screenshot, logo, diagram, anything with transparency: PNG; lossless WebP if the consumer is a browser.
  • Archiving your own photos: keep the original whatever it is; do not “convert to save space” — every lossy re-encode subtracts.

Convert moves between all four formats in the browser, and compress shows the before and after side by side with the size it will produce, so you can stop at the quality that actually looks the same rather than the one the slider defaults to.

Tools in this article