Convert images to WebP and cut blog load time by 30–40%
Tomoda HinataTool author & maintainerPublished Apr 18, 2026Updated Apr 26, 20269 min read
WebP is supported by every modern browser and typically cuts photo file sizes by 25–35% versus JPG at the same visual quality. The Core Web Vitals lift — especially LCP — is one of the highest-ROI changes a content site can make. Convert at quality 82, keep JPG fallback only for RSS, and skip the JPG → WebP double-pass when you have the original.
Tools used in this guide
Why WebP at all?
WebP combines lossy and lossless modes plus alpha channels in one format. For continuous-tone photos it ranges 25–35% smaller than equivalent JPG; for screenshots and graphics it can beat PNG by 50%+. Every browser since Safari 14 (2020) decodes it natively, so there is no compatibility tax on a modern blog audience.
What quality should I pick?
Quality 82 hits the best bytes-per-pixel ratio for photographs. Below 75 gradients show banding (skies, skin); above 90 the savings flatten. For PNG-style screenshots with text, use lossless WebP — it beats PNG by ~25% at zero quality cost.
Do I still need JPG fallbacks?
Effectively no. The last common holdouts (legacy iOS Safari, older Android browsers) phased out years ago. The only remaining edge case is RSS readers and Outlook desktop email previews, which sometimes show the alt text. Serve those via a separate feed that rewrites image URLs to JPG, rather than dual-encoding every image.
Should I convert existing JPGs to WebP?
Only if you do not have the original. Re-encoding JPG → WebP stacks two lossy compression passes, which produces visible artefacts. When you have the master (RAW, TIFF, PNG), export WebP directly to skip the double pass. If you only have JPG, convert anyway — the bandwidth win usually outweighs the small re-compression hit.
How do I measure the win?
Run Lighthouse before and after, focusing on LCP (Largest Contentful Paint). On a content site the hero image is often the LCP element, and a 1.8 MB PNG → 420 KB WebP swap routinely moves the page from the 'Poor' band (≥3 s) into 'Good' (<2.5 s) without touching anything else.
Steps
About 2 minPick the master file
Use the original PNG/RAW/TIFF when possible. JPG-only is fine but not optimal.
Open the WebP converter
Drag the file into the in-browser tool — works offline after first load.
Set quality 82
Default for photos. For screenshots with text, switch to lossless.
Replace on the blog
Swap the asset in your post and re-deploy. Re-run Lighthouse to confirm the LCP change.
| Format | File size | LCP impact (5G mobile) |
|---|---|---|
| PNG (original) | 1.8 MB | 3.4 s (Poor) |
| JPG quality 82 | 640 KB | 2.6 s (Needs improvement) |
| WebP quality 82 | 420 KB | 2.1 s (Good) |
Frequently asked questions
Will WebP work in Outlook email?
Outlook desktop ignores WebP and shows the alt text. For e-mail templates, keep JPG. For everything else (websites, blog posts, social previews), WebP is universal.
Is WebP smaller than AVIF?
Usually no — AVIF beats WebP by another 20–30%. But AVIF lacks Outlook and older mobile browser support. WebP is the practical sweet spot today; AVIF for greenfield sites that can ship `<picture>` fallbacks.
Does WebP support transparency?
Yes — WebP has a full alpha channel and supports lossless mode. It is a strict superset of PNG for any non-icon use.
How does animated WebP compare to GIF?
Vastly smaller — typically 30–60% of the equivalent GIF, with the same support story (every modern browser). For animated content, prefer animated WebP over GIF on the open web.
Can I batch process locally?
Yes — our WebP converter handles 30 files at once entirely in your browser via WebAssembly. No upload, no per-image fee.
Try it now
Convert images to the modern WebP format
WebP Converter