Image Compression Analyzer
Short answer
Check image weight, formats and compression savings, plus responsive markup: srcset, width and height, and lazy loading.
What It Does
Checks up to 15 images on a page for format and file size, flags any still served as JPEG or PNG instead of WebP or AVIF, and estimates the bytes you would save by converting them to WebP. A second part checks every `<img>` for responsive markup: a `srcset`, `width` and `height` attributes that prevent layout shift, lazy loading for offscreen images and modern formats.
Why It Matters
Images are often the heaviest part of a page and often its Largest Contentful Paint element. Sending full-size JPEGs to phones wastes data and slows that paint, and images without width and height make the layout jump as they load, which hurts Cumulative Layout Shift.
How It Works
-
Enter a page URL
-
We list the images on the page and check the format and size of up to 15
-
Estimate WebP savings, then check each `<img>` for srcset, dimensions and lazy loading
-
Return a result for each part, with the heaviest images and the ones missing responsive markup
Sample input + output
url: https://rankproof.eu/tools
Image weight & formats images checked: 15 modern format (WebP/AVIF): 11 / 15 warn total image weight: 890 KB OK (under 1 MB) est. savings as WebP: 64 KB largest: /images/hero-banner.jpg — 210 KB Responsive images: 18 with srcset: 18 OK width & height set: 18 OK (no layout shift) offscreen images lazy-load OK 1 of 2 areas look good
Who Uses This
-
E-commerce Manager
Check category and product pages for images still served as JPEG or PNG at full camera size.
-
Content Manager
Spot uploads that skipped resizing, and pages where images lack srcset or dimensions.
-
Performance Engineer
Estimate how much a WebP conversion would save before choosing an image pipeline.
Frequently Asked Questions
How much can I save?
The report estimates the bytes saved by converting each image that is not in a modern format to WebP. Real savings depend on the image and the quality setting you choose.
Does compression hurt image quality?
At sensible quality settings, modern formats look the same to most people. Compare before and after at the size the image is shown.
What makes an image responsive?
A `srcset` (or a `<picture>` element) so the browser can pick a smaller file on small screens, plus `width` and `height` so space is reserved before the image loads.
Should images be lazy-loaded?
Offscreen images, yes — add `loading="lazy"`. Do not lazy-load the main image at the top of the page; it is often the Largest Contentful Paint element.
Should I strip EXIF metadata?
For web display, usually yes — it saves bytes and removes details such as the GPS location.