A single unoptimized photo can be 5-10MB. Multiply that across a website with dozens of images, and you've got a page that takes forever to load, frustrates visitors, and gets penalized by search engines. The good news: you can usually shrink an image by 60-80% with no visible difference in quality, if you understand a few basics.
Lossy vs. Lossless Compression
There are two fundamentally different approaches to compression. Lossless compression (used by PNG) reduces file size without discarding any image data — the tradeoff is a smaller size reduction. Lossy compression (used by JPG and WEBP) selectively discards data the human eye is least likely to notice, allowing for much bigger size reductions.
For most photographs, lossy compression at a well-chosen quality level is visually indistinguishable from the original, while cutting file size dramatically. The key is finding that sweet spot rather than over-compressing.
The Compression Quality Sweet Spot
Image quality settings typically range from 0-100. Here's what actually matters:
- 90-100%: Barely any size reduction, rarely worth it
- 75-85%: The sweet spot for most photos — significant size reduction with no visible quality loss
- 50-70%: Noticeable size reduction, minor quality tradeoff acceptable for thumbnails or background images
- Below 50%: Visible artifacts start appearing — only use for very small preview images
As a rule of thumb, 80% quality is a safe default for most web photography — you'll rarely notice a difference from the original, but the file size drop is substantial.
Resize Before You Compress
One of the most overlooked steps: if your image is being displayed at 800 pixels wide on your site, there's no reason to keep it at its original 4000-pixel camera resolution. Resizing to the actual display dimensions first, then compressing, will shrink your file size far more effectively than compression alone — often by another 50% or more.
Common Mistakes That Hurt Quality
- Compressing the same image multiple times (each pass loses more data — always compress from the original)
- Using PNG for photographs (massively larger file size for no visual benefit over JPG/WEBP)
- Not resizing oversized images before compressing
- Compressing too aggressively to hit an arbitrary file size target
A Simple Workflow That Works
- Start from your original, uncompressed image
- Resize it to the actual dimensions it will be displayed at
- Compress at 75-85% quality
- Preview the result before publishing — trust your eyes over the percentage number
You can run through this entire workflow — resize and compress — for free and entirely in your browser using our Compress Image tool. Since everything processes locally on your device, your photos are never uploaded anywhere.