How to reduce image file size without wrecking the picture
Most oversized images are oversized for one boring reason: the dimensions are far larger than anywhere they're displayed. Fix that first, then compress.
Published Updated 8 min read
A 4.2 MB image on a page that displays it 800 pixels wide is not a compression problem. It is a dimensions problem. Phone cameras produce 4000-pixel-wide files; websites, email clients and chat apps almost never show them at more than 1600. Before you touch a quality slider, ask what size the image is actually seen at.
Step 1 — Resize to the size it's displayed at
File size scales with pixel count, which scales with the square of the dimensions. Halving width and height removes about 75% of the pixels, and usually a similar share of the bytes — with zero visible loss, because those pixels were never displayed. Practical targets: 1600px wide for a full-width web image, 1200px for a blog body image, 800px for a card or thumbnail, 2x those numbers only if you're serving retina explicitly.
Step 2 — Pick the format that fits the content
| Content | Best format | Rough saving vs. a big PNG |
|---|---|---|
| Photograph | WEBP, JPG as fallback | 85–95% |
| Logo or flat graphic | PNG, or WEBP if transparency plus size matter | 0–40% |
| Screenshot with text | PNG (WEBP lossless if supported end to end) | 10–30% |
| Transparent product cut-out | WEBP | 60–80% |
Step 3 — Set quality, and look at the result
For JPG and WEBP, quality 75–85 is the working range for almost everything. Below 70 you begin to see artefacts in flat areas and around sharp edges; above 90 you're paying a lot of bytes for detail nobody perceives. Change the slider, look at the output at full size, and check the byte count — all three, every time. A number that looks reasonable is not evidence.
Hitting a specific KB limit
Upload forms often impose hard caps: 2 MB, 500 KB, sometimes 200 KB. Guessing at quality values to land under a cap is tedious, so our resizer takes the target size directly and searches for it — it encodes, measures the real output, adjusts quality, and repeats until the file fits. If the target is impossible at the current dimensions, reduce the width first and try again rather than pushing quality into the twenties.
Five things that quietly waste quality
- Compressing first and resizing after. You throw away detail, then throw away the pixels holding it. Always resize first.
- Re-saving the same JPG over and over. Each cycle adds permanent damage; go back to the original instead.
- Upscaling a small image to 'improve' it. Nothing is added — you get a bigger, softer file.
- Using PNG for photographs. It cannot compress photographic noise and produces files several times larger than needed.
- Judging quality on a zoomed-out preview. Artefacts only become obvious at 100%.
A recipe for the common case
- Crop away anything the image doesn't need.
- Resize the long edge to 1600px for a full-width image, 1200px for body content.
- Convert to WEBP at quality 80, and keep a JPG at 85 if you need broad compatibility.
- Check the reported saving. If it says 'Larger', your source was already well optimised — keep it.
Every step above runs entirely in your browser on TryImager. Your files never leave your device, so you can do this with client photos, ID documents or unreleased product shots without thinking about it.
Tools for this
Keep reading
- JPG vs WEBP: is it worth converting your images?WEBP typically saves 25–35% over an equivalent JPG. Here is where that saving is real, where it isn't, and what you give up.
- JPG vs PNG: which one should you actually use?One throws away detail to stay small, the other keeps every pixel and every transparent edge. Here is how to pick without guessing.