Preparing Images for Google PageSpeed Checks
What Google PageSpeed Insights measures
Google PageSpeed Insights analyzes your web page and provides scores for performance, accessibility, best practices, and SEO. The performance score is based on several metrics that measure how quickly your page loads and becomes interactive. Images are one of the most common factors that drag performance scores down.
The tool runs both lab tests, which simulate page loading in controlled conditions, and field data from real Chrome users who have visited your site. Both data sources factor into your overall assessment and can influence how Google ranks your pages in search results.
Common image-related PageSpeed warnings
The most frequent image warnings you will see include "properly size images," which means your images are significantly larger than their display dimensions. "Serve images in next-gen formats" recommends using WEBP or AVIF instead of traditional JPG and PNG. "Efficiently encode images" suggests that your images could be compressed further without significant quality loss.
Other warnings include "defer offscreen images," which recommends lazy loading images that are not visible when the page first loads, and "avoid enormous network payloads," which flags pages where total download size is excessive, often due to unoptimized images.
Fixing "properly size images"
This warning appears when an image's actual file dimensions are much larger than its display dimensions. For example, if a 3000-pixel-wide image is displayed at 600 pixels wide, PageSpeed flags the wasted bytes.
The fix is straightforward: resize each image to match its maximum display width. Check your page layout to determine the actual width at which each image renders, then resize the source file to that width plus a small buffer for high-density screens. For most content images, this means resizing to 1200 to 1600 pixels wide.
Fixing "serve images in next-gen formats"
This recommendation suggests converting your JPG and PNG images to WEBP or AVIF, which are more efficient modern formats. WEBP is the most practical choice because it has near-universal browser support and produces significantly smaller files than JPG at comparable quality.
Convert your largest images first for the biggest impact. Hero images, product photos, and gallery images that appear on multiple pages will produce the most total savings across your site.
Fixing "efficiently encode images"
This warning means PageSpeed believes your images could be compressed further. It estimates how many bytes could be saved by applying optimal compression settings.
Re-export your images at a lower quality setting. For JPG images, try 75 to 85 percent quality. For WEBP, try 75 to 80 percent. Preview each image after compression to ensure the quality is still acceptable for your content. Sometimes PageSpeed suggests very aggressive compression that would visibly degrade the image, so use your judgment about the right balance.
Implementing lazy loading
Lazy loading defers the download of images that are not visible in the initial viewport. Instead of loading all images on page load, the browser loads each image only when the user scrolls close to it. This improves initial page load speed significantly on pages with many images.
Modern browsers support native lazy loading through the loading="lazy" attribute on image tags. Add this attribute to every image that is below the initial viewport. Do not add it to the first image visible on the page, as that would delay your Largest Contentful Paint.
Measuring improvement after changes
After optimizing your images, run PageSpeed Insights again and compare your new scores with the previous results. Pay special attention to the Largest Contentful Paint metric, which is most directly affected by image optimization.
Keep in mind that PageSpeed scores can vary between tests due to server conditions and network variability. Run the test two or three times and average the results for a more reliable comparison. Also check your Core Web Vitals data in Google Search Console, which reflects real user experiences over a 28-day period.
Try these PixelXTrim tools
- Compress Image — reduce file size to pass PageSpeed image audits
- Resize Image — match image dimensions to your layout width
- JPG to WEBP — serve next-gen formats as PageSpeed recommends
Why use PixelXTrim?
PixelXTrim is free, needs no signup, adds no watermark, and processes supported images in your browser. Keep your original, preview the result, download a copy, and check that copy where it will be used.