How to Convert Your Entire Website's Images to WebP
You have a website with hundreds of images in JPG and PNG format, and Google PageSpeed Insights keeps telling you to serve images in next-gen formats. Converting to WebP is the most impactful change you can make for page speed, but migrating an entire site sounds daunting. It does not have to be.
This guide walks you through a practical approach to converting your website's images to WebP, from identifying which images to convert to updating your HTML and verifying the results.
Step-by-Step Instructions
- Inventory your existing images
Download or access your website's image files. If you have FTP access, download the images directory. If using a CMS, export your media library. Count the total images and note the formats. Typical sites have a mix of JPG (photos) and PNG (graphics, screenshots). Both benefit from WebP conversion.
- Batch convert to WebP
Open imageconvert.co and drag batches of images onto the converter. Select WebP as the output format and set quality to 80% for general images or 85% for hero images. Convert in batches of 50-100 for the smoothest experience. Download each batch as a ZIP file.
- Organize converted files
Extract the ZIP files and organize the WebP images to match your website's directory structure. Keep the same file names but with the .webp extension. Having matching paths makes the HTML update process straightforward.
- Update your HTML or CMS
Replace image references in your HTML, CSS, and templates. Change file extensions from .jpg or .png to .webp. If you want to support older browsers, use the HTML picture element with a WebP source and JPG fallback. Most websites no longer need this fallback since WebP browser support exceeds 97%.
- Upload and test
Upload the WebP images to your server and deploy the updated HTML. Test every page with images to verify they load correctly. Run PageSpeed Insights on your key pages and confirm the Serve images in next-gen formats recommendation is resolved.
- Measure the improvement
Compare page weight before and after the migration. A typical site sees 25-35% reduction in total image weight when moving from JPG to WebP, and 50-70% when moving from PNG to WebP. Check your Core Web Vitals in Google Search Console over the following weeks for ranking improvements.
Using the Picture Element for Fallbacks
If you need to support browsers without WebP support (under 3% of global traffic in 2026), use the HTML picture element. This lets you serve WebP to modern browsers and JPG/PNG to older ones. The browser automatically selects the format it supports. This approach adds some HTML complexity but ensures every visitor sees your images.
For most websites in 2026, the picture element fallback is unnecessary overhead. If your analytics show that less than 1% of your traffic uses unsupported browsers, serving WebP directly is simpler and more maintainable.
CMS-Specific Migration
Different CMS platforms handle image format migration differently. WordPress has plugins like ShortPixel and Imagify that convert images to WebP automatically. Shopify generates WebP versions from your uploaded images. For custom-built sites, manual batch conversion and HTML updates are the standard approach.
If your CMS automatically generates WebP, you may not need to do any manual conversion. Check your CMS documentation or inspect the network requests in DevTools to see what format is actually being served to visitors.
Frequently Asked Questions
How much faster will my site load after converting to WebP?
The improvement depends on your current image sizes. Typical results are 25-35% reduction in image file sizes from JPG, and 50-70% from PNG. For image-heavy pages, this can translate to 1-3 seconds faster load times.
Do all browsers support WebP?
Yes, all modern browsers support WebP including Chrome, Firefox, Safari, Edge, and Opera. Global browser support is over 97%. The only browsers that do not support WebP are very old versions that represent a tiny fraction of web traffic.
Should I delete the old JPG and PNG files?
Keep backups of your original files. If you are using picture element fallbacks, you need both formats on the server. Even without fallbacks, having the originals means you can re-convert at different quality settings if needed.
Will converting to WebP affect my image SEO?
Google fully supports WebP in its image search index. Your images will appear in Google Image Search regardless of format. The page speed improvement from WebP may actually improve your overall search rankings through better Core Web Vitals scores.