A nice clean example of the revamped picture proposal:
<figure>
<picture>
<source media="(min-width: 45em)" srcset="large-1.jpg, large-2.jpg 2x">
<source media="(min-width: 18em)" srcset="med-1.jpg, med-2.jpg 2x">
<source srcset="small-1.jpg, small-2.jpg 2x">
<img src="small-1.jpg" alt="" width="200" height="200">
</picture>
<figcaption>A figure of a fox jumping over a lazy box.</figcaption>
</figure>
... becomes this unreadable mess with real world urls:
<figure>
<picture>
<source media="(min-width: 45em)" srcset="
http://i2.cdn.turner.com/cnn/dam/assets/131231130221-dubai-fireworks-expo-c1-main-large-1.jpg,
http://i2.cdn.turner.com/cnn/dam/assets/131231130221-dubai-fireworks-expo-c1-main-large-2.jpg 2x">
<source media="(min-width: 18em)" srcset="
http://i2.cdn.turner.com/cnn/dam/assets/131231130221-dubai-fireworks-expo-c1-main-med-1.jpg,
http://i2.cdn.turner.com/cnn/dam/assets/131231130221-dubai-fireworks-expo-c1-main-med-2.jpg 2x">
<source srcset="
http://i2.cdn.turner.com/cnn/dam/assets/131231130221-dubai-fireworks-expo-c1-main-small-1.jpg,
http://i2.cdn.turner.com/cnn/dam/assets/131231130221-dubai-fireworks-expo-c1-main-small-2.jpg 2x">
<img src="http://i2.cdn.turner.com/cnn/dam/assets/131231130221-dubai-fireworks-expo-c1-main-small-1.jpg" alt="" width="200" height="200">
</picture>
<figcaption>A figure of a fox jumping over a lazy box.</figcaption>
</figure>
... when it could've been just this:
<figure>
<picture>
<source srcoptions="
http://i2.cdn.turner.com/cnn/dam/assets/131231130221-dubai-fireworks-expo-c1-main-{width}-{height}-{dpr}.{format};
200w 200h, 400w 320h, 800w 480h; 1x, 1.33x, 2x; webp, jpg">
<img src="http://i2.cdn.turner.com/cnn/dam/assets/131231130221-dubai-fireworks-expo-c1-main-200w-200h-1x.jpg" alt="" width="200" height="200">
</picture>
<figcaption>A figure of a fox jumping over a lazy box.</figcaption>
</figure>