HTML5 Picture SublimeText Snippet - for responsive images

picture-snippet.sublime-snippet

<!---------------------------------------------------------------------------- 
    This snippet should be used in conjunction with PictureFill from Scottjehl
    https://github.com/scottjehl/picturefill
----------------------------------------------------------------------------->
<snippet>
	<content><![CDATA[
<picture>
   <source media="(min-width: 64em)" src="${1:high-res.jpg}">
   <source media="(min-width: 37.5em)" src="${2:med-res.jpg}">
   <source src="${3:low-res.jpg}">
   <img src="${4:fallback.jpg}" alt="This picture loads on non-supporting browsers.">
   <p>${5:Accessible text.}</p>
</picture>
]]></content>
	<tabTrigger>pic</tabTrigger>
	<!-- Optional: Set a scope to limit where the snippet will trigger -->
	<scope>text.html</scope>
</snippet>