How to Reduce PNG Size for Google PageSpeed Score (Boost to 90+)
By admin · Jun 13, 2026
If you've run Google PageSpeed Insights on your website and received warnings about images, you're not alone. Image optimization issues are consistently the most common reason for low PageSpeed scores. This guide shows you exactly how to fix PNG-related PageSpeed warnings and boost your score.
Understanding PageSpeed Image Warnings
| PageSpeed Warning | What It Means | Fix |
|---|---|---|
| Properly size images | Image dimensions are larger than displayed | Resize PNG to display size |
| Efficiently encode images | PNG file not compressed enough | Compress with compresspngfile.com |
| Serve images in next-gen formats | PNG used where WebP would be better | Convert to WebP (with PNG fallback) |
| Defer offscreen images | Images below the fold loading immediately | Add loading="lazy" attribute |
| Image elements do not have explicit width/height | No width/height set in HTML | Add width and height attributes |
Fix 1: Compress PNG Files (Biggest Impact)
The "Efficiently encode images" warning is fixed by compressing your PNG files. This single fix often improves PageSpeed scores by 10–20 points.
- Download each flagged PNG from your website
- Upload to compresspngfile.com and compress
- Re-upload the compressed version to your website
- Re-run PageSpeed Insights — the warning should be resolved
Quick Tip: In PageSpeed Insights, scroll to the "Opportunities" section. Click on "Efficiently encode images" to see exactly which PNG files are flagged and their estimated savings in KB.
Fix 2: Resize PNG to Display Size
The "Properly size images" warning means your PNG is much larger than it appears on screen.
- Check what size your image is displayed at (right-click > Inspect Element in Chrome)
- Resize your PNG to that actual display size using any image editor
- Compress the resized PNG with compresspngfile.com
- Re-upload to your website
Fix 3: Convert PNG to WebP
The "Serve images in next-gen formats" warning asks you to use WebP instead of PNG. WebP is 25–35% smaller than optimized PNG at similar quality.
- WordPress: Install WebP Express or ShortPixel — they auto-convert PNGs to WebP
- Cloudflare: Enable Polish feature — automatically serves WebP to supported browsers
- Manual: Convert each PNG to WebP and use the HTML <picture> element for fallback
Fix 4: Lazy Load PNG Images
Add loading="lazy" to all PNG images below the visible area:
<img src="feature.png" alt="Feature image" width="800" height="600" loading="lazy">
Note: Do NOT add lazy loading to your hero image — this would actually hurt your LCP score.
Fix 5: Set Image Dimensions in HTML
Always specify width and height in your img tags to prevent Cumulative Layout Shift (CLS):
<img src="logo.png" alt="Company Logo" width="300" height="100">
Real PageSpeed Score Improvements
| Action Taken | Score Before | Score After | Improvement |
|---|---|---|---|
| Compressed all PNG files | 48 | 67 | +19 points |
| + Resized to display size | 67 | 78 | +11 points |
| + Added lazy loading | 78 | 85 | +7 points |
| + Converted to WebP | 85 | 92 | +7 points |
Conclusion
Reducing PNG file sizes is the fastest way to improve your Google PageSpeed score. Start by compressing all PNG files with compresspngfile.com, then resize images to their actual display size. These two steps alone can boost your PageSpeed score by 20–30 points and significantly improve your Core Web Vitals.