Image Tools·4 min read

Lossy vs Lossless Compression: Which One Your Images Need

A slow product page and a bounced email have the same root cause surprisingly often: photos that weigh five times more than they need to. Understanding lossy vs lossless compression is the difference between shrinking a file on purpose and simply guessing. This guide walks through what each approach actually discards, a real compression run on a phone photo, the settings that protect visual quality, and the mistakes that leave images either bloated or visibly damaged. Everything maps to the Image Compressor on this site, which runs the whole process in your browser.

Open the free Image Compressor All insights

Why compressing images is the highest-value fix on a slow page

One line in a report, one big win.

Run any page speed audit and oversized photos sit near the top of the complaint list. A 4 MB hero photo takes several seconds on a mid-range phone connection, and every product thumbnail below it joins the queue. Compressing those files is usually worth more than any script optimization you could make the same afternoon.

Email and upload forms have the same problem with a harder wall. Attachment limits around 25 MB mean a batch of ten straight-off-the-phone photos simply won't send, and job or exam portals often reject anything over 50 or 100 KB. Compress each file to the limit and it goes through, with no quality complaints from anyone viewing it on a laptop screen.

Lossy vs lossless compression, in plain terms

One throws data away. The other repacks it.

Lossy compression discards information your eye is unlikely to miss: subtle color transitions get simplified, fine texture gets approximated, and the file shrinks dramatically. JPG and WebP in their usual modes work this way, and the quality setting decides how aggressive the approximation gets.

Lossless compression repacks the exact same pixels more efficiently, like zipping a folder. PNG works this way, which is why screenshots and logos stay razor sharp but photographs saved as PNG come out enormous. The rule of thumb: photos want lossy, graphics with text and hard edges want lossless.

This has a practical consequence for size targets. A PNG has no quality dial, so the only way to force it under a small KB limit is to reduce its pixel dimensions. For targets like 20 or 50 KB, choose JPG or WebP output instead.

A worked example: compressing one 4032x3024 phone photo

Real numbers from a default run.

Take a typical phone photo: 4032x3024 pixels, saved as a JPG of around 4 MB. Drop it into the Image Compressor with the defaults: Compress by Quality, Medium quality (75) and the format set to Keep original. In Quality mode the dimensions don't change unless you type a max width or height.

Press Compress and the tool re-encodes the photo at quality 75. You get the same 4032x3024 frame at a fraction of the weight, and the compare slider and before and after readout show the exact result for your specific file. The download carries a compressed- prefix so it never overwrites the original. Switching the format to WebP typically pushes the size down further at similar visual quality.

Now try a tight target. Switch Compress by to Target file size and tap the 100 KB preset, or type any value of 5 KB or more in the KB box. When lowering quality alone cannot get there, the compressor also reduces the pixel dimensions until the file fits. If exact dimensions matter, resize first, as described below.

Compression mistakes that cost quality or waste bytes

Five ways it goes wrong.

Most bad results come from a handful of repeatable errors rather than from bad tools.

Compressing the same JPG repeatedly. Each lossy save stacks new artifacts on old ones, so always work from the original file.
Saving photographs as PNG. Lossless formats can make a photo ten times heavier with no visible benefit.
Choosing a rock-bottom quality value for photos with faces. Skin tones show blockiness first, and viewers notice.
Ignoring dimensions entirely. A 4032 pixel wide image in a 400 pixel slot wastes bandwidth no quality setting can recover.
Compressing text-heavy screenshots with aggressive lossy settings. Letters develop halos and smears fast.

Settings that keep quality where people look

Two dials, one target.

Start with the quality presets and only change them when a specific photo misbehaves. High works for portfolio pieces, Medium suits most web content, and Low is for thumbnails nobody inspects closely.

Then use the target size as your guarantee. Presets run from 20 KB to 2 MB, and the box beside them takes any value. Setting 500 KB for blog images or 1 MB for hero photos means no single file can blow the budget, whatever the source looked like. The quality value shapes the output, and the size target enforces the ceiling. One more habit worth keeping: run your whole image folder in one batch. Every file gets the same settings, each row shows its new size, and Download all saves compressed-images.zip, so swapping files into a project stays a copy-paste job.

Compress first, or resize first? Where the related tools fit

The order matters.

If an image is both oversized in pixels and heavy in bytes, run the Image Resizer first to bring dimensions down to the display size, then compress the result. Shrinking 4032 pixels wide to 1200 before compressing gives a far smaller file than either step alone. The resizer also has its own KB limit that only lowers quality and never changes the dimensions you set, which suits forms that state both a pixel size and a file size.

For big folders, the Bulk Image Compressor applies one target across the whole batch and can resize in the same pass. And when a photo is heavy because of unneeded background, Crop Image may remove more bytes than any encoder can. Compression is the last step of the pipeline, not the only one.