“This guide is about the HTML syntax for responsive images (and a little bit of CSS for good measure). The responsive images syntax is about serving one image from multiple options based on rules and circumstances. There are two forms of responsive images, and they’re for two different things:
“If your only goal is increased performance then what you need is…
<img
srcset=""
src=""
alt=""
>
“If you also need design control, then what you need is…
<picture>
<source srcset="" media="">
<source srcset="" media="">
<img src="" alt="">
</picture>