8 April 2026 · 2 min read
WebP, JPEG or PNG: choosing the right image format
Format choice often saves more than any quality setting. A short decision guide, plus the one habit that doubles file sizes needlessly.
Choosing the wrong image format can double a file before compression even starts. Here is the whole decision in one page.
The short answer
| Content | Format |
|---|---|
| Photograph on a web page | WebP |
| Photograph leaving your control | JPEG |
| Logo, icon, or anything with transparency | PNG (or SVG if it is vector art) |
| Screenshot with text | PNG |
| Diagram or chart | SVG if possible, PNG otherwise |
JPEG
Thirty years old and still everywhere, because it does one job extremely well: compressing smooth tonal variation. Photographs are exactly that. It cannot store transparency, and it smears sharp edges — which is why text and diagrams look poor in JPEG at any reasonable quality setting.
Use it when compatibility beats efficiency: files going to a print service, an older CMS, or anyone whose software you cannot predict.
PNG
Lossless, with full transparency support. Perfect for logos, icons, screenshots and any graphic with large flat areas of colour, where its compression is genuinely efficient.
The expensive mistake: using PNG for photographs. Because PNG discards nothing, a photo saved as PNG is routinely five to ten times larger than the same photo as JPEG or WebP, with no visible benefit. This single habit is responsible for an enormous amount of unnecessary page weight on the web.
WebP
Google's format, and the sensible default for the web today. It compresses photographs roughly 25–35% smaller than JPEG at matching visual quality, and it also supports transparency, so it covers PNG's territory too. Every current browser supports it.
The only real reason to avoid it is when the file leaves your control and might be opened by older software.
A note on SVG
For logos, icons, charts and any artwork that was drawn rather than photographed, SVG beats all three. It is a vector, so it is razor sharp at any size, usually tiny, and can be styled with CSS. It cannot represent photographs.
What about AVIF?
AVIF compresses better than WebP again — often 20% smaller. Browser support is now broad, but encoding is slow and tooling is thinner. If you are automating a build pipeline, it is worth adding as a first choice with WebP as the fallback. For hand-processing images one batch at a time, WebP remains the practical answer.
Convert in one pass
The image compressor converts between JPEG, PNG and WebP while it compresses, and hides the WebP option automatically if your browser cannot produce it. Drop a folder of PNG photographs in, select WebP, and watch the total drop by 80% or more.