How to Compress Images Without Losing Quality: The Numbers Behind It
Take a photo with any modern phone and you will get a file between 3 and 8 megabytes. Upload that photo to a website and you have just made the page several times heavier than it needs to be. The fix everyone reaches for — "compress it" — is correct, but most people do not actually know what happens when an image is compressed, which is why they either make the photo look terrible or barely shrink it at all. This guide explains the mechanics and gives you numbers you can actually use.
What "compression" really means
There are two very different operations that both get called compression, and conflating them is the source of most mistakes.
The first is lossless compression. Think of it as folding a shirt more tightly so it fits in a smaller drawer — nothing is thrown away, it is just arranged more efficiently. When you save a PNG, the encoder finds repeated patterns and stores them once instead of over and over. A flat screenshot with large areas of identical color will shrink dramatically; a noisy photo will not, because there are no patterns to exploit.
The second is lossy compression, and this is the one that matters for photos. Here the encoder discards information that your eyes are unlikely to notice, then saves the rest. JPEG has been doing this for decades, and WebP and AVIF are its modern, more aggressive successors. This is why a 4 MB phone photo becomes a 300 KB file with no visible difference: the encoder threw away the fine detail your retina cannot resolve anyway.
The quality/size curve, in real numbers
To give you a concrete sense of the trade-off, here is what happens to a typical 4000×3000 phone photo as you lower the quality setting:
- Quality 90 — roughly 1.2 MB. Indistinguishable from the original on any screen. This is the default "high" setting in most tools.
- Quality 80 — roughly 600 KB. The sweet spot. You can only see artifacts if you zoom in to 300% and squint.
- Quality 60 — roughly 300 KB. Slight softening around edges and in gradients. Perfectly fine for a blog header or a product thumbnail.
- Quality 40 — roughly 150 KB. Visible blocking in flat areas. Acceptable for a tiny avatar, not for anything you want to look crisp.
For most web use, quality 80 is the number to remember. It typically cuts file size by 80–90% while remaining visually identical in normal viewing. Going lower than 60 is rarely worth it unless the image is very small on screen.
Size and dimensions are separate problems
Compression reduces bytes. Resizing reduces pixels. They are often both needed, and doing them in the right order matters.
If your image will be displayed at 800 pixels wide, there is no reason to keep all 4000 pixels. Resize down to 1600 pixels first (twice the display size, to stay sharp on high-density screens), then compress. Resizing before compressing is the single biggest size win most people miss — a 4000px-wide image has 16 times the pixels of a 1000px one, and no amount of compression can fully make up for that.
Metadata is free size you are paying for
A photo from a camera or phone carries a hidden payload: the camera model, the lens, the shutter settings, and — most importantly — the GPS coordinates of where you took it. This EXIF data can add tens of kilobytes and, more seriously, can leak your location when you share the image.
A good compression step strips this automatically. If you are about to upload a photo of your home or your kids to a public forum, removing EXIF data is not an optimization, it is a privacy decision. It is also the cheapest way to shrink a file: it costs no visual quality at all.
Which format should you pick?
The short version: use WebP if your platform supports it, JPEG as the safe default, and PNG only for graphics with text, logos, or transparency (screenshots, diagrams).
- JPEG — the universal photo format. No transparency, lossy, but supported everywhere since the 1990s.
- WebP — 25–35% smaller than JPEG at the same quality, with transparency. Supported by every modern browser.
- AVIF — even smaller than WebP, but slightly less universal and slower to encode.
- PNG — lossless, so it is wrong for photos (files stay huge) but right for screenshots and graphics where every pixel matters.
Converting a photo to WebP is a one-click, reversible-looking win: you typically get a noticeably smaller file with the same apparent quality. The main thing to verify is that your target platform actually displays WebP — some older content management systems and email clients still do not.
A workflow you can steal
Here is the order I use every time a batch of photos needs to go online:
- Resize to 1600px on the long edge (double your largest display width).
- Convert to WebP if the platform allows it, otherwise keep JPEG.
- Compress at quality 80.
- Verify the EXIF data was stripped — especially for anything personal.
This reliably turns a 5 MB phone photo into a 200–400 KB web-ready image that loads instantly and looks identical. The tools that do all of this run entirely in your browser, so the photos never leave your device — which matters when the photo in question is a passport scan or a picture of your house.
Next time you are about to drag a raw photo straight into an upload box, remember the difference between resizing and compressing, aim for quality 80, and strip the metadata. Your readers' data plans will thank you.