Open Google PageSpeed Insights on any typical website and there's a good chance the top recommendation involves images — "properly size images", "serve images in next-gen formats", "defer offscreen images". Images dominate page weight because they're large, numerous, and often uploaded straight from a camera with no thought for how they'll be served.
Finding the Problem Images
Before compressing randomly, find what's actually slowing the page:
- Go to Google PageSpeed Insights and enter your URL.
- Look at the "Opportunities" section — it lists specific images and how much time fixing them would save.
- Note the images flagged as "Properly size images" and "Serve images in next-gen formats".
These are the ones worth addressing first.
The Two-Step Fix for Each Problem Image
Step 1: Resize to display size.
A photo that displays 800px wide has no reason to be 4000px in the file. Every excess pixel is downloaded but not shown. The Image Editor handles basic resizing. Check your page's CSS to find the actual display width for each image.
Step 2: Compress.
Run the resized image through Image Compress. For photos, this alone commonly reduces file size by 50–80% with no visible difference. For the format options, see JPG vs PNG vs WebP.
Switching to WebP
WebP images are typically 25–35% smaller than equivalent-quality JPG. All major browsers now support it. If your CMS or theme doesn't convert images to WebP automatically, upload WebP files directly. Use Image Compress to produce WebP output.
Lazy Loading
Images below the visible screen area don't need to load until the visitor scrolls to them. Add loading="lazy" to those <img> elements. Most modern CMS platforms have settings for this. It doesn't reduce file size but removes those images from the critical loading path.
A Practical Workflow for an Existing Site
- Run PageSpeed Insights and list every image flagged under "Opportunities".
- For each: resize to its display width, then compress.
- Replace the originals with the optimised versions.
- Re-run PageSpeed Insights to confirm the improvement.
For the full picture of how images affect speed, see how image size affects page speed and how to compress images for a website.
Making It a Process, Not a One-Time Fix
Optimising existing images is a one-time catch-up. The ongoing work is making sure new images uploaded to the site are already optimised before they go in. A brief checklist for anyone uploading images to your CMS — resize to display width, compress before uploading, use WebP — is faster to apply as a habit than to fix retroactively across hundreds of images. For the underlying format decisions, see JPG vs PNG vs WebP: which image format should you use. For the full page speed context and how images fit alongside other factors, see what is page speed and why does it matter for SEO.
