## Responsive Images

Deliver the appropriately sized image using `srcset` and `sizes` attributes in the `img` element.

- Guide to the Responsive Images Syntax In HTML | CSS-Tricks
- Responsive Images | MDN
- Responsive Images with srcset | imgix

### srcset and sizes

    <img src="images/gnp.jpg"
    alt="Glacier National Park"
    srcset="images/gnp-600.jpg 600w,
    images/gnp-900.jpg 900w,
    images/gnp-1200.jpg 1200w,
    images/gnp-1500.jpg 1500w"
    sizes="(min-width: 1500px) 1400px,
           (min-width: 1200px) 1100px,
           (min-width: 900px) 800px,
           (min-width: 600px) 500px,
           900px"/>

### Demos

- Demo of srcset with placeholder images
- Demo of srcset with imgix delivery