JPG vs PNG vs WebP: which format to use and when

Choosing an image format is usually presented as a quality question. It is really a question about what is in the image. The same photograph and the same screenshot want different formats, and the reason has to do with how each format's compression works.

The one distinction that matters: lossy or lossless

Lossless compression stores the image exactly. Decompress it and you get back the identical pixels you started with. Nothing degrades, no matter how many times you save it.

Lossy compression throws information away in order to get much smaller files. It targets detail the human eye is bad at noticing — subtle colour variation, fine gradient shifts — and discards it.

Neither is better. Lossy compression is enormously effective on photographs, where the discarded detail genuinely is invisible. It is poor on images with hard edges and flat colour, where the discarded detail is exactly what defines the image.

JPG

JPG is lossy and has been the default photographic format for three decades. Its compression is built around the assumption that the image is a photograph: smooth gradients, no hard-edged flat regions, no transparency.

On that kind of content it performs superbly. A photograph at JPG quality 80 is typically a fraction of the size of the lossless equivalent and visually identical at normal viewing size.

On the wrong content it fails visibly. Compress a screenshot or a logo as JPG and you get "ringing" — a halo of noise around every sharp edge and letter. Once that noise is in the file it cannot be removed.

JPG also has no alpha channel, so it cannot store transparency. Save a transparent PNG as JPG and the transparent areas become solid, usually white.

One more property is worth knowing: JPG degrades cumulatively. Every save re-compresses the already-compressed image, so repeatedly editing and re-saving a JPG slowly destroys it. Keep an original in a lossless format if the image will be edited more than once.

• Use for: photographs, and anything else that is mostly continuous tone.
• Avoid for: screenshots, logos, line art, text, anything needing transparency.

PNG

PNG is lossless and supports full alpha transparency. Its compression looks for repeated patterns and runs of identical colour, which makes it extremely efficient on exactly the content JPG handles worst.

A screenshot of a user interface — large areas of flat colour, crisp text, hard borders — often compresses better as PNG than as JPG, and it stays perfectly sharp.

The reverse is also true. A photograph saved as PNG has almost no repetition to exploit and will often be several times larger than the JPG equivalent with no visible benefit.

Because it is lossless, PNG is the right working format for images that will be edited and re-saved repeatedly. It never degrades.

• Use for: screenshots, logos, icons, diagrams, line art, anything with transparency, and any image you will edit again later.
• Avoid for: photographs, where it produces needlessly large files.

WebP

WebP is the newest of the three and unusual in offering both a lossy and a lossless mode in one format, plus transparency in either mode.

In lossy mode it typically produces files noticeably smaller than JPG at equivalent perceived quality. In lossless mode it is usually smaller than PNG on the same image. It is, on the numbers, the better format almost across the board.

The historical objection was support, and that objection has largely expired. Every current major browser decodes WebP. The remaining friction is outside the browser: some older desktop software, some printing services, and some corporate document systems still do not accept it.

There is also an asymmetry worth knowing about — a browser can decode WebP more reliably than it can encode it. Safari in particular only gained WebP export in relatively recent versions, so a browser-based conversion tool may be able to open a WebP but not create one on older systems.

• Use for: images on your own website, where you control the delivery and browser support is guaranteed.
• Be cautious for: files you send to other people, upload to third-party systems, or need to print.

Choosing by content, not by format

A shortcut that gets it right nearly every time:

• Photograph, for the web → WebP lossy. For anywhere else → JPG.
• Screenshot or UI capture → PNG. WebP lossless if it is for your own site.
• Logo or icon with transparency → PNG, or WebP if it is for your own site.
• Image you will keep editing → PNG. Export a lossy copy at the end.
• Attaching to an email or uploading to an unfamiliar system → JPG for photos, PNG for everything else. Compatibility beats file size when you cannot control the other end.

Quality settings, briefly

For lossy formats, the quality slider matters more than the format choice. A few rules of thumb that hold up in practice:

Quality 90 and above is effectively indistinguishable from the original for almost any purpose, and produces large files. This is worth it for images that will be viewed closely or printed.

Quality 75 to 85 is the sweet spot for most web use. Differences are visible only under close comparison.

Quality 60 to 75 is fine for photographs viewed at normal size, and where file size genuinely matters — email attachments, slow connections.

Below 60, artefacts become visible on most content, particularly around edges. Sometimes that is an acceptable trade. It should be a deliberate one.

The honest answer is that no fixed number is right for every image. A busy photograph with lots of texture hides compression far better than a portrait against a smooth background. Compare the output against the original before committing.

What about the other formats

GIF still exists, mostly for short animations. For still images it is obsolete — it is limited to 256 colours and PNG beats it on every axis.

AVIF compresses better than WebP again and has good current browser support, but encoding it is slower and tooling is less universal. It is a reasonable choice for a site you control and a poor one for files you hand to other people.

HEIC is what modern iPhones shoot by default. It is efficient, and outside the Apple ecosystem it is frequently rejected. If you are sending photos to someone else, converting to JPG first avoids a predictable problem.