AMP images in readers

Question

I have a website with AMP pages that allow editors to add images to the page. The images are displayed using an amp-img element and render in any normal browser.

When either user a reader view or being crawled by a site such as Embedly the amp-img elements are not displayed.

I assume this is caused by the amp-img element not being a valid HTML element so is ignored. Is there anyway to get around this issue?

Answer 1

You can add a noscript element for renderers not using javascript:

<amp-img src="welcome.jpg" alt="Welcome" height="400" width="800">
  <noscript>
    <img src="welcome.jpg" alt="Welcome" height="400" width="800" />
  </noscript>
</amp-img>

Answer 2

I had left out the head tag of <script async src="https://cdn.ampproject.org/v0.js"></script> as listed in the documentation. Including that fixed it.