Everything You Need to Know About Compressing Images the Right Way
Most people compress images wrong — either they go too aggressive and end up with blurry photos, or they barely compress at all and wonder why their site is slow. This guide walks you through how to get it right, what settings actually matter, and when to use which format. Whether you're a developer optimizing a production site, a designer prepping assets for a client, or just someone trying to send a photo without it bouncing back from an email server — this covers everything you need.
What Quality Setting Should You Actually Use?
The short answer: 80% for almost everything. Here's why — the human eye stops noticing quality differences somewhere around 75-80%. Below that, you start seeing artifacts on edges and gradients. Above 90%, you're mostly just adding file size without any visible benefit. The difference between a 90% and 100% quality JPEG is often invisible to the naked eye, but the file size difference can be 2-3x.
That said, there's no single right answer — it depends on what the image is and where it's going. A hero banner on a landing page deserves more care than a thumbnail in a product grid. A good rule of thumb based on what you're doing:
- Thumbnails and icons — 40-60% is fine. Nobody's zooming in on a 60px avatar.
- Blog posts and social media — 70-80% hits the sweet spot. Good quality, fast load.
- Portfolio or product photos — 80-90% keeps details sharp without bloating the file.
- Print or archival use — stay at 95-100%. You want every pixel intact.
One thing worth knowing: the quality percentage doesn't mean the same thing across formats. 80% WEBP and 80% JPG will produce different results — WEBP tends to look better at the same percentage because its compression algorithm is more modern. So if you're switching formats, don't assume the same number gives the same output.
JPG, PNG, or WEBP — Which One to Pick?
This trips up a lot of people. The format matters as much as the quality setting, sometimes more. Picking the wrong format can mean your file is 3x larger than it needs to be, or that transparency breaks when you open it in another app.
- JPG — Great for photos. Handles gradients and complex colors well. No transparency. If your image is a photograph with lots of color variation, JPG is almost always the right call. It's also the most universally supported format.
- PNG — Use it when you need transparency (logos, icons, UI elements, screenshots with clean backgrounds). File sizes are larger, but quality is lossless. Don't use PNG for photos — you'll end up with massive files for no reason.
- WEBP — The best of both worlds for modern browsers. Smaller than JPG, supports transparency like PNG. If your audience is on modern devices and browsers (which is almost everyone now), WEBP is the smart default for web use.
A practical tip: if you're building a website and you have a mix of photos and graphics, convert everything to WEBP. You'll typically see 25-35% smaller files compared to JPG at equivalent quality, and all modern browsers handle it natively. The only exception is if the file is going somewhere that doesn't support it — like some email clients or older CMS platforms that strip or reject WEBP files.
Compressing Multiple Images at Once
If you're preparing images for a website launch, an e-commerce catalog, or a photo gallery, doing them one by one is a waste of time. Upload everything at once, set your quality and format, and download the whole batch as a ZIP. The filenames stay exactly as they were — no renaming needed, no "compressed-image-1.jpg" nonsense.
The results table shows you exactly how much each file shrank, so you can spot any outliers — like a PNG that barely compressed because it was already optimized, or a photo that went from 4MB to 300KB without any visible change. If something looks off, hit Preview to compare the original and compressed versions side by side before downloading.
For large batches, it's worth running a quick sanity check on a few files before downloading everything. Pick the most visually complex image in your set and preview it at your chosen quality. If that one looks good, the rest will too.
The Max Width Setting — More Useful Than It Looks
A lot of people skip the Max Width field, but it's one of the most effective ways to reduce file size. Here's the thing — if you're displaying an image at 800px wide on your website, there's zero benefit to having a 3000px source image. All that extra resolution is just dead weight that the browser has to download and then scale down anyway.
Set Max Width to match the largest size the image will actually be displayed at. For a blog post image, that's usually 1200-1400px. For a thumbnail, maybe 400px. Combined with quality compression, this can reduce file sizes by 80-90% compared to the original — without any visible difference to the end user.
EXIF Data — Should You Keep It or Strip It?
EXIF data is the metadata embedded in photos — things like camera model, shutter speed, GPS coordinates, and timestamp. By default, this tool preserves it. But there are good reasons to turn that off.
If you're publishing photos online and privacy matters, stripping EXIF removes the GPS location data that's often embedded in smartphone photos. If you're optimizing for file size, removing metadata shaves off a small but real amount. And if you're processing images for a web app where metadata is irrelevant, there's no reason to keep it.
On the other hand, if you're archiving photos, sharing work with clients who need to know the camera settings, or maintaining a professional photo library, keep it on. The metadata is part of the file's value in those cases.
Your Files Never Leave Your Device
This tool runs entirely on your device. There's no upload happening in the background — compression is done locally, which means your photos, client work, or sensitive documents stay on your machine. No server, no storage, no data retention. You can verify this yourself by opening your browser's network tab while compressing — you won't see any outgoing requests for your image files.
It also means it works offline once the page is loaded, and there's no file size limit imposed by a server. The only practical limit is your device's available memory, which for most modern computers means you can comfortably process dozens of high-resolution images in a single batch.
A Few More Tips That Actually Make a Difference
- If you're converting format (e.g., PNG to WEBP), do it here during compression — you save a step and the output is already optimized in one go.
- WEBP at 80% quality is almost always smaller than JPG at the same quality. If you're optimizing for web, it's worth switching even if your source files are JPGs.
- Don't compress images that are already compressed. Re-compressing a JPG introduces generation loss — each round of compression adds more artifacts. If you need to re-process, always start from the original.
- For product images on e-commerce sites, 85% quality with Max Width set to 1200px is a solid default that works well across most platforms.
- If you're sending images via email and they keep bouncing, try 70% quality with Max Width at 1600px. That usually gets most photos under 500KB without looking noticeably different.
That's Really All There Is to It
Image compression doesn't need to be complicated. Pick a sensible quality, choose the right format, set a max width if the images are oversized, and let the tool do the work. The before/after preview is there if you want to double-check anything before downloading. If you need to go further with your images — upscaling low-res photos, removing backgrounds, or converting formats — check out the other tools in our image tools collection.