You publish a page, open it on your phone away from wifi, and watch the pictures crawl in one band at a time. Almost always the cause is the same: the images went up exactly as they came off a camera or a designer’s export. A single untouched photo can weigh more than every other part of the page combined, and it’s usually the easiest thing on the whole site to fix.
A 6 MB photograph, 4000 pixels wide, sitting in a column roughly 700 pixels across. That exact mismatch turns up in more of the uploads we see than any other single problem. Nothing is wrong with the picture itself — it is simply around thirty times larger than the page has any use for, and every visitor pays for the difference.
Why your images are heavier than they need to be
- They’re far bigger than the space they sit in. Browsers scale a 4000-pixel image down to fit a 700-pixel column, but the visitor still downloads all 4000 pixels first.
- The format doesn’t match the content. A photograph saved as PNG can easily be five times the size of the same photo as JPG, with no visible gain.
- Exports keep quality at maximum by default. Most design tools save at 100% quality, well past the point where anyone can see a difference.
- Hidden data rides along. Camera metadata, colour profiles and thumbnails add weight that no visitor will ever see.
The fastest fix: compress in your browser
If you want the file smaller right now, use a browser-based tool. Our free image compressor re-encodes your image at a sensible quality level and strips the data the web doesn’t need, typically cutting 60–80% off the file with nothing you can spot at normal viewing size.
It runs entirely on your own device, so nothing is uploaded to a server. That matters if you’re working with client photos, product shots that haven’t launched yet, or anything else you’d rather not hand to a third party.
Compressing properly: a practical checklist
- Resize before you compress. This is the step that does the heavy lifting, and most people skip it. Bring the image down to the largest width it will ever actually be shown at using our image resizer — usually 1600–2000 px for a full-width banner, and far less for anything in a column.
- Crop away what you don’t need. Empty sky and background are still pixels you’re paying to send. A tighter crop often improves the picture as well as the file size.
- Choose the right format. Photos want JPG or WebP; logos, icons and screenshots want PNG or WebP. Our image converter handles the switch, and there’s more detail in our guide to JPG vs PNG vs WebP.
- Then compress. Around 75–85% quality is the sweet spot for photographs. Below roughly 60% you start to see it.
- Keep the original. Compression is one-way. Store one clean master copy so you can start again if you ever need a bigger version.
- Check it at full size on a real screen. Zoom to 100% and look at faces, fine text and any flat areas of sky or wall — that’s where problems show first.
What to actually aim for
Useful targets rather than rules, for typical website images:
- Full-width hero image: 1600–2000 px wide, under 200 KB.
- In-article or blog image: 1000–1200 px wide, under 100 KB.
- Product thumbnail or card: 400–600 px wide, under 40 KB.
- Logo or icon: exact display size, under 20 KB.
- Whole page: try to keep every image on it adding up to under 1 MB.
If a single image on your site is over 500 KB, it’s almost certainly resizeable rather than un-compressible.
When compression genuinely shows
Some images resist compression, and it’s worth knowing which so you don’t blame the tool. Screenshots containing small text go mushy quickly, because the sharp edges are exactly what lossy compression discards first. Large flat gradients — a clear sky, a plain studio backdrop — can develop visible banding. Illustrations with hard lines suffer in the same way photographs don’t.
The pattern we run into most is people compressing an already-compressed file. Each pass discards a little more, and after three or four rounds a photo looks visibly rough for no extra saving. If an image already looks slightly soft before you start, go back to the original rather than squeezing it again. For anything with text or sharp edges, switch it to PNG or WebP instead of pushing the JPG quality lower.
Questions people ask about compressing images
How much can I compress an image before it looks bad?
For photographs, 75–85% quality is invisible to almost everyone. The visible threshold usually sits somewhere around 60%, and lower for images containing text.
Should I resize or compress?
Both, in that order. Resizing removes pixels you never needed; compressing makes the remaining pixels cheaper to store. Resizing saves far more.
Does compressing images actually help SEO?
Indirectly, yes. Page speed is a ranking signal and image weight is usually the largest single factor in it. The bigger effect is on visitors, who leave slow pages.
Is WebP worth switching to?
For the web, generally yes — typically 25–35% smaller than JPG at matching quality, with support in every current browser. Keep a JPG if the file also has to open in older desktop software.
Will compressing remove my image’s metadata?
Usually, and that’s normally a good thing for the web. If you need to keep copyright or camera data, check the tool’s behaviour and keep an untouched original either way.
Before you upload
Resize first, pick a format that suits the content, compress once, and keep the master copy. Those four habits will take most sites from sluggish to quick without changing a single line of code. When your images are ready, run them through our image compressor and check the saving before you upload.
Handy tools for this topic
70+ free tools, zero sign-up
Every ToolBrainy tool runs right in your browser — no accounts, no watermarks and no limits. Compress a PDF, generate a strong password, convert an image and plenty more.
