srcset
An HTML img attribute for specifying multiple image candidates, enabling browsers to automatically select the optimal image based on device conditions.
The srcset attribute on <img> elements lists image candidates at different sizes or resolutions, separated by commas. The browser automatically selects and downloads the optimal candidate based on device pixel ratio and viewport width.
Two descriptor types exist. Width descriptors (w) specify the image's actual pixel width, used with the sizes attribute. Pixel density descriptors (x) specify Retina multipliers like 1x, 2x, 3x.
Example: <img srcset="photo-320w.jpg 320w, photo-640w.jpg 640w, photo-1280w.jpg 1280w" sizes="(max-width: 600px) 100vw, 50vw" src="photo-640w.jpg">
srcset is central to responsive image implementation. The batch resize tool generates multiple sizes for srcset enumeration, delivering optimal resolution images per device.