srcset is an attribute, very similar to src which is being set on the <img> tag.
srcset allows you to define a “set” of sources of images that will be served according to certain rules.
A simple & very useful example, would be this:
<img src="pic.jpg" srcset="pic.jpg 1x, pic-2x.jpg 2x">
Note the 1x & 2x – this basically allows us to set a different image according to the relevant pixel density.
- 1x – “normal” pixel density
- 2x – double than “normal” pixel density, retina displays for example.
- and so on…
The nice thing about srcset, is that it both degrades gracefully to use src if the browser lacks support & the browser is smart enough to only load the relevant image.
Now I’m wondering. Would it be possible to neglect the original ‘src’ attribute altogether and only use srcset (assuming that I don’t care about legacy and old ass browsers)?
Technically – yes. but you wouldn’t like doing that, as IE in all it’s versions lacks support for srcset