title: Custom Python Dominate Tag Element
body: <p>To <a href="https://css-tricks.com/using-webp-images/" rel="nofollow noreferrer">support both a JPEG and WEBP compressed image</a>, I'd like to include the following HTML code in a web page:</p>
  
  <pre><code>&lt;picture&gt;
    &lt;source srcset="img/awesomeWebPImage.webp" type="image/webp"&gt;
    &lt;source srcset="img/creakyOldJPEG.jpg" type="image/jpeg"&gt; 
    &lt;img src="img/creakyOldJPEG.jpg" alt="Alt Text!"&gt;
  &lt;/picture&gt;
  </code></pre>
  
  <p>I've been using Python Dominate and it has generally worked well for me.
  But the Picture and Source tags I think are not supported by Dominate.
  I could add the HTML as a raw() Dominate tag, but was wondering if there was a way to get Dominate to recognize these tags.</p>
  
  <pre><code>p = picture()
  with p:
      source(srcset=image.split('.')[0]+'.webp', type="image/webp")
      source(srcset=image, type="image/jpeg")
      img(src=image, alt=imagealt)
  </code></pre>
  
  <p>I am seeing this kind of error:</p>
  
  <pre><code>p = picture()
  NameError: global name 'picture' is not defined
  </code></pre>