I've spent an embarrassing amount of time over the last few years obsessing over image file sizes. Every few months, a client sends me a 12MB hero image that needs to be under 200KB. Every time, I go through the same routine: which tool, which format, which settings?
After enough of these cycles, I've landed on a workflow that actually works. No magic, no secret settings—just a practical understanding of how image formats and compression work. Let me save you some of that trial and error.
Know Your Formats First
Before picking a tool, you need to understand what you're compressing. Different image types need different formats, and using the wrong one is like putting diesel in a petrol car—it runs, but badly.
| Format | Best For | Compression | Transparency |
|---|---|---|---|
| JPEG | Photos, gradients | Lossy, adjustable | No |
| PNG | Screenshots, graphics, text | Lossless | Yes |
| WebP | Almost everything | Both, very efficient | Yes |
| AVIF | Next-gen photos | Best compression ratio | Yes |
The JPEG Sweet Spot
JPEG quality settings confuse a lot of people. Here's the practical truth: quality 75-85 is almost always indistinguishable from the original at normal viewing sizes. Going above 85? You're just inflating file size for zero perceptible gain. Dropping below 60? You'll start seeing artifacts around edges and in flat color areas.
My default for web photos is quality 80. If the image has a lot of fine detail—hair, fabric textures, distant foliage—I might nudge it to 85. For background images or thumbnails where nobody's looking closely, 70 works fine.
PNG: Not Always Better
People love PNG because it's lossless. "Lossless" sounds great until you realize your 4MB PNG could have been a 120KB WebP with zero visible difference. PNG is the right choice for screenshots (especially with text), logos, and anything that needs pixel-perfect rendering. But for photographs? It's almost always the wrong call.
One common mistake: saving a JPEG screenshot as PNG. You're preserving all the JPEG artifacts at full quality, which means a larger file that looks worse than the original JPEG. If your source is already lossy, stick with a lossy format for the output.
WebP: The Practical Upgrade
WebP has been around since 2010, and browser support is essentially universal now (even Safari got on board years ago). It typically produces files 25-35% smaller than equivalent JPEG quality, with lossy and lossless modes plus transparency support.
For most web use cases, WebP should be your default output format. Convert JPEGs to lossy WebP at the same visual quality and you'll get a smaller file. Convert PNGs to lossy WebP and the savings are often dramatic.
The only reasons not to use WebP in 2026 are if you specifically need maximum browser compatibility for very old clients, or if you're working in a pipeline that doesn't support it yet.
AVIF: Amazing but Slow
AVIF is the hottest format in image compression right now, and with good reason—it can be 50% smaller than JPEG at equivalent quality. But there's a catch: encoding is slow. Painfully slow. A batch of 100 images that takes 10 seconds with WebP can take several minutes with AVIF.
My take: use AVIF for images you'll serve to lots of users and where encoding time doesn't matter (like a static site build step). For quick, day-to-day optimization, WebP is still the better balance of speed vs. compression.
The Biggest Mistake: Re-encoding Lossy Formats
This one burns people constantly. Here's the scenario: you compress a JPEG to quality 70. Then you open that compressed version, tweak something, and save it again at quality 70. You've now compressed an already-lossy image a second time.
Lossy compression artifacts accumulate. Each re-encode degrades quality further. It's like making a photocopy of a photocopy—each generation looks worse. After 3-4 re-encodes, even quality 90 won't save you.
The fix is simple: always compress from the original source file. If you don't have the original anymore and you need to make changes, keep re-encoding to an absolute minimum. Better yet, work in a lossless format (PNG or TIFF) while editing, and only do the final JPEG/WebP export once.
What to Look for in a Compression Tool
Not all image optimizers are created equal. Here's what actually matters:
- Format support — Can it output WebP and AVIF, not just JPEG/PNG?
- Quality control — Does it let you set a target quality or just a generic "compress" slider?
- Batch processing — If you're doing more than 2-3 images, one-at-a-time tools are a dealbreaker.
- Client-side processing — Do your images stay on your device, or are they uploaded to a server?
- Speed — AVIF is great, but if the tool takes 30 seconds per image, it's not practical for daily use.
My Workflow (2026 Edition)
After years of tweaking, here's what I actually do:
- Product photos for web → Original → WebP at quality 80. Usually cuts 60-70% off the original.
- Screenshots with text → Keep as PNG, strip metadata, run through a lossless optimizer.
- Social media images → WebP at quality 75-80. Nobody on Instagram is pixel-peeping.
- Hero/banner images → AVIF with effort=4-6 as a build step. The size savings compound at scale.
- Icons and logos → SVG where possible. If raster, keep as PNG with lossless compression.
Simple enough to remember, flexible enough for most situations. The key insight is that there's no single "best" setting—just the right tool and format for the job at hand.
Compress images directly in your browser — no upload, no sign-up, no quality surprises.
Try it free on Vaultool →