Most people compress images backwards. They take a photo straight from their camera, drag the quality slider down until the file is small enough, and end up with a blurry, blocky mess. The actual secret to compressing images without losing quality has very little to do with the quality slider at all. It's almost entirely about size, and most people never resize anything before compressing.
The biggest mistake: compressing before resizing
A photo straight from a modern phone is often 4000 pixels wide or more. If that photo is going to appear on a website as a 600 pixel wide thumbnail, you don't need all those extra pixels. Shrinking the dimensions down to roughly what the photo will actually be displayed at does more to reduce file size than any amount of quality adjustment ever could, and it does so without any visible loss in sharpness, because those extra pixels were never going to be seen anyway.
Always resize first, then compress the smaller version. Trying to compress a huge photo down to a tiny file size using only the quality slider is what produces that blocky, smeared look people associate with over compressed images.
Why some photos shrink more easily than others
A photo with lots of fine detail, like leaves on a tree, strands of hair, or a crowd of people, contains far more visual information than a photo of a plain blue sky or a product on a white background. Detailed photos need a slightly higher quality setting to stay sharp, while simple images can go lower without anyone noticing. This is also why PNG files of real photographs are always huge. PNG refuses to throw away any information at all, which is great for logos and screenshots but completely unnecessary for a holiday photo.
A simple routine that actually works
- Always keep your original photo somewhere safe before you touch it. Never edit the only copy you have.
- Resize the image to the actual dimensions it needs for wherever it's going. A website header rarely needs to be wider than 1600 pixels. A product photo for an online store rarely needs to exceed 1200 pixels on its longest side.
- Choose JPG for ordinary photographs or WebP if your website supports it. Save logos, icons, and transparent images as PNG instead.
- Set the quality to somewhere around 80. Don't trust the number blindly. Look at the actual result and zoom in on faces, text, and fine detail.
- Compare the new file size against the original. You should typically see a drop of 60 to 90 percent with barely any visible difference.
The image compressor shows you the original size and the new size side by side immediately after processing, so you can see exactly what you saved instead of guessing.
How to tell when you've gone too far
Over compressed images have a few telltale signs once you know what to look for. Skies and solid color backgrounds start showing visible blocky patches instead of a smooth gradient. Text becomes smudged and loses its crisp edges. Faces lose fine detail around the eyes and skin takes on a slightly plastic, smeared appearance. If you zoom into any of these areas and see these issues, bump the quality setting back up by 10 or 15 points and try again.
A common trap is checking the result only as a tiny thumbnail, where none of these problems are visible. Always view the compressed image at the actual size it will be displayed, and once more at full zoom, before deciding it's good enough.
Compression for websites specifically
If you're adding images to a website, don't upload the same enormous file everywhere and let the browser shrink it down visually. That wastes bandwidth and slows down your page for every visitor. Instead, resize each image to roughly the dimensions it will actually be displayed at on the page, then compress it. If the same photo needs to appear at different sizes on different pages, it's worth creating a couple of different sized versions rather than using one oversized file everywhere.