Added back in butterfly as part of WebP+picture demo

There are a few use cases for `<picture>` so I added in a second example for file format support. 

Is it okay to have multiple `<!-- // [START code-block] -->` blocks sprinkled throughout the text? Added `<section>` tags with `id` for URL anchor support.
Sounds good. I updated to:
```<!-- // [START code-block-source-media] -->```
and
```<!-- // [START code-block-source-type] -->```