JPG, PNG, WebP or AVIF?
Four formats, one decision. Here is the short version and the reasoning behind it.
· Tirth Enterprise
The honest answer is that it depends on two things: what kind of image it is, and where it is going. Everything else is detail.
The short version
- Photograph for the web → WebP, or AVIF if you can afford the encode time
- Photograph for anything else → JPG
- Screenshot, logo, diagram, or anything needing transparency → PNG, or WebP on a website
- Uploading to a form → JPG, always
Why photographs and graphics differ
JPEG was designed around human vision. It discards the fine tonal variation eyes are bad at noticing, which works brilliantly on photographs because they are mostly gradual change — skin, sky, foliage.
Graphics are the opposite. A screenshot is flat colour with hard edges, and JPEG's approach smears those edges into visible fringes around text. PNG instead looks for repeated patterns, which is exactly what flat colour is: a PNG screenshot is both smaller and perfect, where a JPEG one is larger and ugly.
Get this backwards and both formats look bad. That is the single most important distinction.
The newer two
WebP is around 25-30% smaller than JPEG at the same visual quality, supports transparency, and works in every current browser. For website images it is close to free — smaller pages, no visible difference. It remains a poor choice anywhere outside a browser.
AVIF compresses better again, often 30-50% below JPEG, and handles wide colour and high dynamic range. The costs are real though: encoding is slow, and support outside browsers is still thin. Worth it for a high-traffic site where bandwidth is a genuine expense; overkill for most people.
What about HEIC?
HEIC is what your iPhone shoots. Compression is excellent, compatibility outside Apple is poor, and no browser displays it. Treat it as a capture format and convert before sharing.
Quality settings that make sense
For JPEG and WebP, 80-85 is the practical sweet spot: files shrink by two thirds and nobody notices. Go to 90-95 for printing or archiving. Below 60 the artefacts become obvious.
Do not repeatedly re-save a JPEG. Each save runs the compression again on already-compressed data, and the damage accumulates. Edit from the original every time.
A rule of thumb
Keep a lossless master — the RAW, the PNG, the original HEIC — and export lossy copies for wherever they are going. Storage is cheap and quality lost in a re-encode never comes back.
Convert between any of these in your browser.