Add example template with <picture> tag

README.md

@@ -101,7 +101,7 @@ You can use Liquid variables as attributes with the `responsive_image_block` tag
 
 You will need to create a template in order to use the `responsive_image` tag. Below are some sample templates to get you started.
 
-#### Basic image tag with `srcset`
+#### Responsive images with `srcset`
 
 ```twig
 <img src="/{{ path }}"
@@ -111,6 +111,17 @@ You will need to create a template in order to use the `responsive_image` tag. B
      ">
 ```
 
+#### Responsive images with `<picture>`
+
+```twig
+<picture>
+    {% for i in resized %}
+        <source media="(min-width: {{ i.width }}px)" srcset="/{{ i.path }}">
+    {% endfor %}
+    <img src="/{{ path }}">
+</picture>
+```
+
 #### Responsive images using [Imager.js](https://github.com/BBC-News/Imager.js/)
 
 > This template assumes an `output_path_format` of `assets/resized/%{width}/%{basename}`