You're about to upload an image and somewhere in the export dialog there's a setting you've probably clicked past a hundred times without thinking about it: lossless or lossy. Pick wrong, and either your photo gallery loads like it's 2009, or your "perfectly compressed" logo comes out of the other end looking like it was photocopied through a fax machine.
Most people guess. Some avoid the decision entirely by leaving everything at default settings and wondering later why their site is slow or their icons look blurry. The actual decision isn't complicated once you understand what each method is doing to your file — it just rarely gets explained without a computer science lecture attached. So here's the version without the lecture.
Lossless compression shrinks a file without removing any image data — decompress it and you get back the exact original pixels. Lossy compression shrinks a file by permanently discarding data the eye is least likely to notice, producing much smaller files at a small, often invisible, quality cost. Use lossless for logos, icons, screenshots, and anything with text or hard edges. Use lossy for photos, banners, and hero images, where the 50–90% size savings matter far more than pixel-perfect accuracy.
1. What lossless and lossy compression actually are
Both lossless and lossy compression do the same basic job: make a file smaller. The difference is entirely in how they get there, and what happens to the data along the way.
Lossless compression: nothing is thrown away
Lossless compression finds smarter, more efficient ways to describe the exact same information — it doesn't remove anything. Think of it like writing "10 red pixels in a row" instead of listing "red, red, red, red, red, red, red, red, red, red." Same information, fewer characters. When you decompress a losslessly compressed file, you get back data that is bit-for-bit identical to the original. PNG, for example, is built entirely around this guarantee — every pixel decoded from a PNG matches the source exactly.
Because nothing is discarded, lossless compression has a ceiling. Once you've found the most efficient way to describe the data, you can't shrink it further without actually losing something. That ceiling is usually a 10–30% reduction on real-world images, occasionally more on flat graphics with large areas of repeated color.
Lossy compression: discard what won't be missed
Lossy compression takes a different approach entirely. Instead of just describing the same data more efficiently, it identifies information the human eye is statistically unlikely to notice is missing, and removes it permanently. JPEG does this by discarding high-frequency color detail the eye is less sensitive to. Lossy PNG and WebP tools do it by reducing millions of possible colors down to a smaller palette of the most visually important ones.
Once that data is gone, it's gone — there's no decompression step that restores it. But because the algorithm is choosy about what it removes, the visual cost is often far smaller than the file-size benefit. This is the whole reason lossy compression exists: trading information you can't perceive for file sizes you definitely can.
2. Why this choice matters more than people think
It's tempting to treat this as a minor technical setting buried in an export dialog. In practice, picking the wrong one has compounding consequences that show up in places you wouldn't expect.
It directly controls how fast your site loads
Image weight is consistently the largest contributor to page size on the web. A photo gallery using lossless PNGs instead of lossy JPEG or WebP can be 3–10× heavier for identical visual results. That difference shows up directly in load time, bounce rate, and — for any site that cares about it — Core Web Vitals and search ranking signals.
It determines whether your image survives editing
If an image is going to be cropped, recolored, layered, or re-exported multiple times before it's final, lossy compression at every intermediate step compounds the damage — each re-save throws away a little more. This is called generational loss, and it's the reason professional workflows keep a lossless master file and only export a lossy copy at the very end, for delivery.
It affects whether small details stay legible
Lossy compression is least kind to fine detail, high-contrast edges, and small text — exactly the things screenshots, diagrams, and UI mockups are full of. Compress a screenshot with code or fine text using aggressive lossy settings, and you'll see fuzzy artifacts right where the eye is supposed to be reading something precisely. This is the single most common reason lossy compression gets a bad reputation it doesn't deserve everywhere else.
3. Step-by-step: choosing the right one for any image
Instead of guessing, run every image through the same short checklist. It takes seconds and removes the ambiguity entirely.
Ask what the image actually contains
Photographic content (gradients, textures, lots of colors) tolerates lossy compression extremely well. Flat content with hard edges (logos, icons, text, line art) is far more sensitive to it.
Ask if this is a master file or a delivery copy
If you'll need to re-edit this file later, keep a lossless master. If this is the final version going to a browser, an inbox, or a print queue and won't be re-edited, lossy is usually fine.
Ask how forgiving the use case is of tiny imperfections
A hero banner photo can absorb a little lossy softness invisibly. A medical scan, a legal document scan, or a screenshot someone will zoom into cannot.
If lossy, start around quality 80–85
This range gives most of the file-size benefit with the least visible cost. Drop lower only if file size is critical and you've visually confirmed it still looks acceptable.
Always check the result at 100% zoom
A file size number tells you nothing about how it looks. Before shipping a lossy export, view it at full size — not the thumbnail — and compare it against the original.
4. Common mistakes people make with both
Lossless preserves every photographic detail, including subtle camera noise and texture variation that lossy algorithms would discard anyway because nobody can see it. The result is a file 3–10× larger than it needs to be, for zero visible benefit.
Flat graphics with hard edges and text are exactly where lossy artifacts are most visible — fuzzy edges, color bleeding around text, banding in solid color fills.
Every lossy re-save discards more data on top of what's already gone. Open a JPEG, edit it, save as JPEG again, repeat a few times, and quality degrades noticeably even at the same quality setting.
A "quality 60" setting can look perfectly fine on one image and visibly broken on another — it depends entirely on the image's content. Trusting a number blindly skips the only check that actually matters.
Lossless has a hard ceiling on how much it can shrink a file — usually 10–30%. If a lossless file is still too large for its use case, no amount of lossless-only optimization will fix that; the format or strategy itself needs to change.
5. Real examples, side by side
A 4000×3000 DSLR product photo
The lossless version preserves every pixel but is still enormous for a web product page. The lossy version at quality 85 is roughly 92% smaller than the original and visually indistinguishable on a typical screen — exactly the case lossy compression was built for.
A flat 512×512 app icon, 14 colors
Here lossless optimization (just switching color type) already does most of the work — there are so few colors that there's barely anything left for lossy compression to discard. The lossy version saves a little more, but the gap is small because the image was never color-heavy to begin with.
A 1920×1080 screenshot with code and small text
The JPEG is smaller, but zoom in on the text and you'll see soft ringing artifacts around every character — JPEG's lossy algorithm struggles with the high-contrast edges that text and UI elements are made of. This is a case where the smaller file is the wrong choice; lossless PNG is the better fit despite the larger size.
6. Lossless vs lossy: full comparison table
| Factor | Lossless | Lossy |
|---|---|---|
| What happens to the data | Re-encoded more efficiently, nothing removed | Permanently discards data deemed least noticeable |
| Typical file size reduction | 10–30% | 50–90% |
| Visual quality after compression | Identical, always | Near-identical at quality 80+, degrades below that |
| Best for | Logos, icons, screenshots, text, line art, master files | Photos, banners, hero images, social graphics |
| Re-compression behavior | No degradation, ever — re-save endlessly | Generational loss — quality drops with each re-save |
| Common formats | PNG, lossless WebP, GIF, lossless TIFF | JPEG, lossy WebP, lossy AVIF |
| Risk if used incorrectly | Bloated, slow-loading files | Visible artifacts, blurred text/edges |
7. Compress your images now
Knowing the theory is one thing — actually seeing the trade-off on your own image is what makes the decision obvious. Run the same file through both modes and compare the result before you decide.
If your image is already a photo, you'll usually get better results going straight to a format built for lossy compression from the start, rather than forcing a lossy pass onto a PNG.
8. Frequently asked questions
Is lossy compression bad for image quality?
Not at sensible settings. At quality 75–90, lossy compression is usually indistinguishable from the original to the human eye, while cutting file size by 60–90%. Quality only becomes visibly bad below roughly quality 50, or after repeated re-compression of the same file.
Which is better, lossless or lossy compression?
Neither is universally better — they solve different problems. Lossless is better when you need pixel-perfect accuracy: screenshots, text, logos, source files. Lossy is better when you want the smallest possible file and a tiny, usually imperceptible, quality loss is acceptable: photos, hero images, social graphics.
Does lossy compression reduce image quality every time you save it?
Yes — this is called generational loss. Each time a lossy file is decompressed and re-compressed, more detail is discarded on top of what was already removed. This is why you should always compress from the original master file, never from an already-compressed copy.
Can you tell the difference between lossless and lossy images?
At high quality settings (80+), most people cannot tell the difference in a side-by-side comparison, especially on a typical screen. The difference becomes visible mainly in large flat color areas, fine text, or after aggressive compression below quality 50.
Should I use lossless or lossy for my website images?
For most websites, lossy is the right default for photos, banners, and hero images, since page speed matters more than pixel-perfect fidelity at that point. Use lossless only for logos, icons, UI screenshots, and any image where exact pixels matter — diagrams with small text are a good example.
Does lossless compression actually make files smaller?
Yes, but modestly. Lossless compression re-encodes the same data more efficiently — typically 10–30% smaller — without removing anything. It will never match the size reductions lossy compression achieves, because it isn't allowed to discard any information.
What's the safest setting if I'm not sure which to pick?
If the image has a lot of fine detail, color variation, or is photographic, start with lossy at quality 85 and check it visually. If it's flat, has text, or has hard edges, default to lossless. When genuinely unsure, compress both ways and compare the file size and the look side by side — it takes seconds and removes the guesswork entirely.
Can I convert a lossy file back to lossless to "undo" the compression?
No. Once lossy compression has discarded data, re-saving the file as a lossless format (like PNG) just locks in the already-degraded image losslessly from that point forward — it cannot restore the original detail. Always keep an untouched master file if there's any chance you'll need the original quality again.