Uploading a screenshot as a JPG and wondering why it looks fuzzy? Emailing a PNG photo and wondering why it weighs 12 MB? Both mistakes come from the same root: choosing an image format by habit instead of by job. Here is the decision made simple.
The one question that decides everything
Does the image need transparency or pixel-perfect edges?
- Yes → PNG (or WebP with lossless mode)
- No → JPG for photos, WebP for everything else
That single question resolves 90% of format choices. Here is why.
PNG: lossless and pixel-perfect
PNG compresses without discarding any information. Every pixel comes back exactly as it went in. That makes it the only right choice for:
- Screenshots (text must stay crisp — lossy compression smears letters)
- Logos and icons, especially with transparency
- Diagrams, charts, and anything with flat colors and sharp edges
The cost: photos saved as PNG are enormous. A 4000×3000 phone photo as PNG can easily weigh 10–20 MB, versus 2–4 MB as a high-quality JPG. Same image, wildly different sizes — because photographic detail (noise, skin texture, foliage) is exactly what lossy compression is designed to exploit.
JPG: the photo workhorse
JPG throws away information the human eye is bad at noticing — subtle color variations, fine high-contrast detail — to achieve huge size reductions on photographic content.
- Great for: photos, scanned documents of photos, backgrounds
- Bad for: text, sharp lines, flat colors (you get ringing artifacts and fuzz around edges)
- No transparency — a JPG always has a background
Quality settings are where people go wrong. JPG quality is a slider of diminishing returns: 90→80 saves enormous space and is usually visually indistinguishable; 80→40 saves more space but starts visibly smearing. Quality 75–85 is the sweet spot for the web.
WebP: the modern default
WebP does both jobs. It supports lossy compression that typically beats JPG by 25–35% at the same visual quality, plus lossless mode that beats PNG, plus transparency, plus animation. Every modern browser supports it (Chrome, Firefox, Safari, Edge — since 2020–2021), so compatibility is no longer a reason to avoid it.
Practical consequences:
- Photos for the web: WebP quality 80 is the new JPG quality 85 — same look, smaller file
- Screenshots and graphics: lossless WebP is consistently smaller than PNG
- Faster pages: smaller images mean faster load times, which is a ranking signal and a user-experience win in one
The remaining niche for old formats: maximum-compatibility exports (some old software still wants JPG), and PNG for logos where you may need the file to work in tools that never learned WebP.
A simple decision table
| You have... | Use |
|---|---|
| A photo for the web | WebP (quality ~80) |
| A photo to email/print | JPG (quality 85+) |
| A screenshot with text | Lossless WebP or PNG |
| A logo with transparency | WebP lossless or PNG |
| An animated short clip | WebP or GIF (WebP is smaller) |
Compression is a spectrum, not a cliff
"Lossless vs. lossy" is not a binary quality verdict. Moderate lossy compression is frequently imperceptible — the art is finding the highest compression that still looks untouched at the size it will actually be viewed. An image displayed at 800px wide does not need the detail of a 4000px original; downscaling to display size alone often cuts file size by half before any compression.
The two cheapest wins, in order:
- Resize to the actual display size (nobody needs a 4000px image in a 800px slot)
- Convert JPG → WebP at quality 80 (typically 25–35% smaller, same look)
Convert without uploading anything
Image privacy matters more than people assume — photos carry location data and capture more than you intended, and client or product shots may be unreleased. The KitWharf Image Compressor resizes and converts PNG, JPG, and WebP entirely in your browser using WebAssembly: your photos never leave your device, there are no daily limits, and you can preview the result side-by-side before saving.
Frequently asked questions
Does converting JPG to WebP improve quality? No — conversion cannot add information that was already discarded. But re-encoding an existing JPG as WebP usually keeps the same look at a smaller size, which is the win people actually need.
Why is my PNG bigger than the original photo? PNG's lossless compression is built for sharp edges and flat color, not photographic noise. A photo as PNG can be 5–10× larger than the identical JPG — that is the format doing its job badly on the wrong content.
What quality should I use for the web? WebP at 75–85 is the sweet spot for photos; for lossless screenshots and graphics, use WebP lossless or PNG and win size by resizing to display dimensions instead.