Implement responsive images with srcset

Serving a 2000px image to a 400px phone screen wastes bandwidth and slows loading—srcset lets the browser download only the size it needs.

Quick Reference

• Use srcset to provide multiple image sizes
• Use sizes attribute to tell browser which size to download
• Browser selects optimal size based on viewport and DPR
• Can save 50-70% bandwidth on mobile devices

Check

Verify that images use srcset and sizes attributes for responsive delivery.

Fix

Implement responsive images with srcset for different screen sizes and resolutions.