Advanced HTML images

Srcset attribute

<img src="image-src.png" srcset="image-1x.png 1x, image-2x.png 2x">

Picture element

<picture>
    <source srcset="smaller.jpg" media="(max-width: 768px)">
    <source srcset="default.jpg">
    <img srcset="default.jpg" alt="My default image">
</picture>

<picture>
    <source srcset="smaller.jpg, smaller_retina.jpg 2x" media="(max-width: 768px)">
    <source srcset="default.jpg, default_retina.jpg 2x">
    <img srcset="default.jpg, default_retina.jpg 2x" alt="My default image">
</picture>

• Picturefill (<picture> polyfill)
• <picture> browser support