Big images are the number one reason pages load slowly. Not scripts, not fonts — images. A single unoptimized photo off a phone runs 5–8 MB, and a page with a dozen of them makes even a fast connection crawl. The good news: you can usually cut 60–80% of that weight and no one will see the difference. Here's how, and where people go wrong.
resize first, compress second
This is the step everyone skips. A phone shoots at 4000+ pixels wide. Your blog column is maybe 800 pixels. Serving the full file means the browser downloads four times the data and throws most of it away.
Resize to the largest size it'll actually display, then compress. Resizing alone often does more than any quality slider. A full-width hero: 1920px is plenty. An in-article image: 1000–1200px. A thumbnail: 400px.
quality 75-80 is the honest sweet spot
For JPEG and WebP, quality runs 0–100, and the returns fall off a cliff above about 85. Drop from 100 to 80 and you cut the file roughly in half while the difference stays invisible on a normal screen. Go below 60 and you start seeing blocky artifacts in skies and skin tones.
So: 75–80 for most photos, 85 for a detailed product shot you're worried about, 65 when you need it tiny and the image is forgiving. Don't sit at 100 “to be safe.” You're just shipping bloat.
pick the right format for the job
- Photos → WebP or AVIF. Big savings, no visible loss.
- Logos, icons, sharp-edged screenshots, anything with transparency → PNG, or WebP lossless.
- Graphics with few colors → PNG run through pngquant, which trims the palette and can cut a PNG 60–70%.
Converting a photo to PNG is the classic mistake. PNG is lossless, so a photo balloons instead of shrinking. Save PNG for flat graphics.
strip metadata you don't need
Every phone photo carries EXIF — camera model, settings, GPS coordinates. For a web image none of that matters, and the GPS especially is worth removing before you publish someone's location by accident. Most compressors strip it for you. Small saving in bytes, real one in privacy.
work in batches
You won't keep this up if it's tedious. Whatever tool you use, make sure it takes a folder at once. Resize, set quality, run the batch, done.
Want to try it now? You can compress images or convert to WebP right here — pick a width, set quality around 78, watch the size drop. The common formats run in your browser, so nothing leaves your device.