ImgSprint

Compression

How to Compress Images Without Losing Quality

Learn how image compression works, when lossy is fine, and how to shrink JPG, PNG, and WebP files while keeping them sharp for the web.

By ImgSprint 6 min read

A photo that looks great on your camera can be far too heavy for a website, an email, or a chat app. Compression is how you fix that — but a badly compressed image develops blocky patches, smeared detail, and muddy colors. The good news is that you rarely have to choose between a small file and a sharp picture. You just have to understand a few trade-offs.

What compression actually does

Image compression reduces file size in one of two ways.

Lossless compression rewrites the data more efficiently without discarding anything. Open the file and you get exactly the same pixels back. PNG uses lossless compression, and it is ideal for screenshots, logos, and line art where every edge matters.

Lossy compression discards visual detail that the human eye is unlikely to notice. JPEG is the classic lossy format, and WebP and AVIF can be lossy too. By throwing away fine detail, lossy formats can shrink a photo to a fraction of its original size.

Most photos should be lossy. Most text-heavy graphics should be lossless.

The single most important number: quality

Lossy encoders use a “quality” value, usually from 0 to 100. Lower quality means a smaller file and more visible artifacts. The trick is that the relationship is not linear:

  • Moving from 100 to 85 usually removes a large chunk of the file size with almost no visible change.
  • Moving from 85 to 70 saves more, with a slight softening that is often acceptable for the web.
  • Going below 60 starts to produce obvious blocking, halos, and banding.

For most web photos, quality 75–85 is the sweet spot. Start at 80, compare the result, and adjust from there.

Compress the right way

  1. Start from the largest original you have. Re-saving an already compressed image again and again stacks artifacts on top of artifacts. Keep a master copy.
  2. Resize before (or while) you compress. There is no point storing a 6000-pixel-wide photo if it will display at 1200 pixels. Fewer pixels means a smaller file at the same quality.
  3. Choose the right format. Photos go to JPEG, WebP, or AVIF. Screenshots and graphics go to PNG.
  4. Compare, don’t guess. Open the compressed file at 100% zoom and look at fine texture, edges, and gradients.

You can do all of this with the Imgsprint compress tool, which runs entirely in your browser.

How low can you go?

It depends on how the image will be used:

Use case Suggested quality Notes
Full-width hero photo 75–85 Overlay text can hide minor softness
Thumbnails 70–80 Small display size hides artifacts
Detailed product photos 85–92 Buyers inspect close-up
Screenshots and UI Lossless (PNG) Text edges punish lossy encoding
Print or archive 95+ or lossless Storage is cheap, quality is not

A realistic workflow

  • For a blog post: resize the photo to about 1600 pixels wide, export as WebP at quality 80, and keep a JPEG fallback only if you must support very old browsers.
  • For a portfolio: export at quality 88–92 and serve the full resolution only when someone clicks to enlarge.
  • For a marketplace listing: aim for balance. A 90-quality image that loads instantly beats a 100-quality image that makes buyers wait.

Common mistakes

  • Compressing the wrong format. Saving a screenshot as a JPEG introduces fuzzy text; save it as PNG or WebP instead.
  • Chasing the smallest possible file. The last 10% of savings usually costs a visible amount of quality.
  • Forgetting metadata. Photos can carry GPS coordinates and camera details. If you are sharing publicly, strip EXIF metadata with the remove EXIF tool before or after compressing.
  • Using one setting everywhere. Different images tolerate different amounts of compression. A detailed forest scene needs more generous quality than a smooth sky.

The bottom line

Compression is not a button you press once; it is a decision about how an image will be seen. Resize first, pick the right format, start around quality 80, and check the result at full size. Do that, and you will get files that load quickly without looking cheap.

Try it yourself

These free tools run entirely in your browser — your images never leave your device.

Have a topic you would like us to cover? Tell us about it.