Lossy vs lossless
JPG is lossy — it discards data the human eye is bad at noticing. PNG is lossless — every pixel is preserved, but files are larger. WebP and AVIF do both, with better compression than JPG at equal quality.
The right quality setting for the web
For photos: 70–80% JPG quality is the sweet spot. Below 60% you'll see blocking on flat regions; above 90% you're paying for bytes nobody can see.
Resize first, compress second
A 4000px image displayed at 800px wastes 95% of its pixels. Always resize to the actual rendered size before compressing — the savings are far bigger than any quality knob.
Modern formats
WebP saves 25–35% over JPG. AVIF saves another 20%. Both are supported in every current browser. Use them where you control the delivery (your own site); fall back to JPG/PNG when uploading to platforms that don't accept them.