Your first AMP component - <amp-img>
The next validation error message is interesting:
The tag 'img' may only appear as a descendant of tag 'noscript'. Did you mean 'amp-img'?
This error deserves special attention: it's the first error that's complaining about what looks to be standard use of an HTML tag. It's basically telling us that the HTML <img>
tag is not permitted in AMP, and it's suggesting an alternative <amp-img>
.
Let's try to swap in <amp-img>
in place of our <img>
tag. Copy this line in instead:
<amp-img src="https://theampbook.com/ch2/lightning.jpg"></amp-img>
Note the closing </amp-img>
tag. The HTML img
tag is a void tag, which means that it doesn't need to be explicitly closed. However, the same does not hold for amp-img
; so you must close it explicitly. Hit reload and check the developer console.
So that didn't work out so well: the image isn't displaying and the validator is reporting the following messages:
The implied layout 'CONTAINER...