Image · 5 min read
JPEG vs PNG vs WebP vs AVIF: which image format should you use?
Four formats, all 'good for images' — but each is a tradeoff between file size, quality, transparency, and how widely it's supported. Here's the simple version: when to pick each, with rough numbers for how much smaller you'll get.
By UltraConvert Editorial · Published · Updated
JPEG: photos, when in doubt
JPEG is the universal photo format — 30 years old, supported literally everywhere. It's lossy (so re-saving repeatedly degrades quality), but at quality 80–85 you get a great balance of size and visual quality. Use it for camera photos, social media uploads, and email attachments. Don't use it for logos, screenshots, or anything with sharp edges and flat colors — JPEG smudges them.
PNG: logos, screenshots, anything with sharp edges
PNG is lossless: every save preserves the exact pixels. Perfect for logos, UI screenshots, diagrams, or images with text. The downside: PNG photos are typically 5–10× larger than JPEG. PNG also supports transparency (the alpha channel), which JPEG doesn't. If your image has flat color regions or transparency, PNG. If it's a photo, almost never PNG.
WebP: better than JPEG, almost everywhere
WebP (Google, 2010) does what JPEG does but ~25% smaller for the same visual quality, and it supports transparency too. Browser support is now universal (every major browser since Safari 14 in 2020). For websites, social uploads, and CDN-served images, WebP at quality 80 is the safe default. The only reasons to avoid WebP: legacy systems that don't recognize it, and editing tools that don't open it (Preview on macOS pre-Monterey, for example).
AVIF: the new champion, with caveats
AVIF (2019) is built on the AV1 video codec. It compresses ~50% better than JPEG at the same perceived quality — a massive win for web performance. The downsides: encoding is slow (libaom can take 5–30 seconds per image vs JPEG's <1 second), Safari only added support in 16.4 (2023), and editing tools are still catching up. For modern websites where bandwidth matters, AVIF + WebP fallback is the gold standard. For everywhere else, WebP is fine.
Rule of thumb
Photos shared with humans → JPEG (q85). Photos on a website → WebP or AVIF. Logos and screenshots → PNG. Tiny icons and emoji → SVG (not on this list, but worth knowing — it's vector, scales infinitely, tiny). Don't store master copies in any lossy format — keep originals as PNG/TIFF/RAW and re-export to lossy formats when delivering.