Some HTML Elements are Not Rendered in AMP Pages

  • by
Accelerated Mobile Pages (AMP) is kind of a light-weighted html standard for smartphone users to load pages more quickly by optimizing HTML codes. Therefore, AMP must lose weight to be accelerated. Parts of, and limited functions and elements can be utilized in AMP pages.

Therefore, there’re some fatty prone elements (tags) that are not supported by AMP HTML Specification, they will be ignored and not be displayed in the browser, and I think it’s the key reasons for why AMP can be fast.

On the other hand, some tags are continuously supported but with replaced new AMP tag names. For example, <img> is replaced by <amp-img> with more layout restrictions. You have to implement AMP pages with the new tag names to comply with AMP specification.

For tracing any errors from AMP that google crawled so far, you can go to Google Webmaster Tool, get into the dashboard of the canonical website instead of AMP website, to check the status of AMP. For example, if your AMP site is amp.example.com which points to the canonical website www.example.com, then you should get into the dashboard of www.example.com to check AMP crawling status.
Accelerated Mobile Pages in Search console of Webmaster Tool
Let’s take a glance at the table that we mentioned above.
TagStatus in AMP HTML
scriptProhibited unless the type is application/ld+json. (Other non-executable values may be added as needed.) Exception is the mandatory script tag to load the AMP runtime and the script tags to load extended components.
baseProhibited
imgReplaced with amp-img.
videoReplaced with amp-video.
audioReplaced with amp-audio.
iframeReplaced with amp-iframe.
frameProhibited.
framesetProhibited.
objectProhibited.
paramProhibited.
appletProhibited.
embedProhibited.
formProhibited. Support coming in the future.
input elementsProhibited. Includes input, textarea, select, option. Notably, button element is allowed.
buttonAllowed.
styleRequired style tags for adjusting opacity. One additional style tag is allowed in head tag for the purpose of custom styling. This style tag must have the attribute amp-custom.
linkrel values registered on microformats.org are allowed. If a rel value is missing from our whitelist, please submit an issue. stylesheet and other values like preconnect, prerender and prefectch that has side effects in the browser are disallowed. There is a special case for fetching stylesheets from whitelisted font providers.
metaThe http-equiv attribute is banned. Otherwise allowed.
aThe href attribute value must not begin with javascript:. If set, the target attribute value must be _blank. Otherwise allowed.(https://github.com/ampproject/amphtml/tree/master/spec)
svgMost SVG elements are allowed.

Leave a Reply

Your email address will not be published. Required fields are marked *