How to Compress WebP Images: Quality Settings and Best Practices
WebP was designed by Google specifically to be smaller than JPG and PNG. And it is — typically 25-35% smaller than equivalent JPG and 26% smaller than PNG for lossy, even more for lossless. So why would you need to compress WebP images further? Because smaller is always better for web performance, because you might have WebP images exported at default settings that are not optimal, and because even a 30% improvement on top of WebP's inherent efficiency adds up across a site with thousands of images.
How WebP compression works
WebP supports two compression modes, and understanding the difference is important for choosing the right settings:
Lossy WebP works similarly to JPG — it discards information the human eye is less sensitive to. A lossy WebP at quality 80% is visually identical to the original in most cases but 30-40% smaller than the equivalent JPG. Most WebP images on the web use lossy compression.
Lossless WebP works like PNG — it preserves every pixel exactly but achieves smaller file sizes through better compression algorithms. A lossless WebP is typically 25-30% smaller than the same image as PNG, with zero quality loss. Use lossless for screenshots, diagrams, and images where pixel-perfect accuracy matters.
Optimal quality settings
WebP quality is set on a scale of 0-100, just like JPG. But the scale does not map 1:1 to JPG quality. WebP quality 80 produces visually better results than JPG quality 80 at a smaller file size.
- Quality 75-80: The sweet spot for most web images. Produces files 30-40% smaller than equivalent JPG at visually comparable quality. This is what you should default to.
- Quality 60-70: Acceptable for thumbnails, background textures, and images viewed at small sizes. Compression artifacts become slightly visible on close inspection but are invisible at normal viewing distances.
- Quality 85-90: For high-quality photography portfolios and hero images where detail matters. Still meaningfully smaller than JPG at the same perceived quality.
- Quality 90+: Diminishing returns. The file size savings over the original start to shrink, and you are better off using lossless if quality is this critical.
The WebP sweet spot
For web use, WebP quality 75-80 (lossy) gives you the best balance of file size and visual quality. This is 30-40% smaller than a JPG at quality 85, with no visible difference at normal viewing sizes.
Browser support in 2026
WebP browser support is now universal. Every current version of Chrome, Firefox, Safari, Edge, and Opera supports WebP. Safari added WebP support in Big Sur (macOS 11) and iOS 14, which were released in 2020. As of 2026, the only holdouts are very old browsers that make up less than 1% of web traffic.
The one area where WebP support is still inconsistent is email clients. Outlook desktop cannot display WebP inline, and some corporate email systems block or strip WebP attachments. For email, stick with JPG and PNG. For web, WebP is safe to use without fallbacks for virtually all audiences.
Lossy vs lossless: when to use each
Use lossy WebP for:
- Product photos and hero images
- Blog post images and thumbnails
- Social media image assets
- Background images and textures
- Any photographic content where a minor, invisible quality reduction is acceptable
Use lossless WebP for:
- Screenshots and UI mockups (sharp text, flat colors)
- Logos and icons with sharp edges
- Technical diagrams and flowcharts
- Images where you need to guarantee pixel-perfect output
- Source assets that may be re-edited later (avoid compounding lossy artifacts)
Batch compressing WebP for websites
If you are converting an entire site's image library to WebP, the approach depends on your stack. For static sites, run a build-time conversion script that processes every image in your assets folder. For CMS-based sites (WordPress, Shopify), use a plugin that converts on upload or serves WebP via CDN. For custom applications, use the image compressor to batch process and download as a ZIP.
When batch converting from JPG to WebP, do not re-compress from an already-compressed JPG at low quality. Always start from the highest-quality source you have. Converting a heavily compressed JPG to WebP will not recover lost quality — it can only preserve or further degrade what is already there.
Comparing WebP file sizes
Here are typical file sizes for a 1200x800 photographic image across formats at comparable visual quality:
- PNG (lossless): 2.5-3.5MB
- JPG at quality 85: 200-350KB
- WebP lossy at quality 80: 130-230KB
- WebP lossless: 1.5-2.5MB
- AVIF at quality 60: 80-150KB
WebP lossy at quality 80 is consistently 30-40% smaller than JPG at quality 85 for the same perceived visual quality. For a site with 50 images per page, that difference translates to hundreds of kilobytes in total page weight — enough to meaningfully improve load time and Core Web Vitals scores.
Compress WebP images
Upload WebP files and compress them with adjustable quality. Or convert JPG and PNG to optimized WebP. All processing runs in your browser.