Layout 38: Outdoor coffee shop mural
Two men love Annie
Test case for use of responsive images using picture element, source and srcset. Leaving art direction of images to the browser is unpredictable.
Code
<picture class="men">
<source srcset="img/038/street-art-2019-04-20-12.39.12@2x.jpg" media="(min-width: 60em)">
<source srcset="img/038/street-art-2019-04-20-12.39.12-bw.jpg" media="(min-width: 48em)">
<img srcset="img/038/street-art-2019-04-20-12.39.12-op@2x.jpg 2x" src="img/038/street-art-2019-04-20-12.39.12-bw.jpg" />
</picture>
<picture class="woman">
<source srcset="img/038/street-art-2019-04-20-12.39.26@2x.jpg" media="(min-width: 60em)">
<source srcset="img/038/street-art-2019-04-20-12.39.26-pixel.jpg" media="(min-width: 48em)">
<img srcset="img/038/street-art-2019-04-20-12.39.26-pixel@2x.jpg 2x" src="img/038/street-art-2019-04-20-12.39.26-bw.jpg" />
</picture>