Responsive Image Test
What is it?
This test will check if all of your page's images are appropriately sized for your user's viewport. Ideally, your page should not serve images that are larger than the version that's rendered on the user's screen. Serving an image larger than the user's viewport results in scaling down the image, use of unnecessary bandwidth, and slower page load time.
Pass rate:
-
Top 100 websites: 29%This value indicates the percent of top 100 most visited websites in the US that pass this test (in the past 12 months).
-
All websites: 23%This value indicates the percent of all websites analyzed in SEO Site Checkup (500,000+) in the past 12 months.
| 2021 | 38% |
|---|---|
| 2022 | 31% |
| 2023 | 28% |
| 2024 | 29% |
100
75
50
25
0
How do I fix it?
This issue can be fixed by using responsive images, which relies on creating multiple versions of each image, that are served via CSS media queries depending on the user's viewport dimensions.
Another solution can be to use vector-based image formats like SVG. SVG images scale appropriately to any size, without wasting unnecessary bandwidth. Also consider image CDNs that can help serve responsive images.
