You’ve embraced Accelerated Mobile Pages and are a true believer in the power of AMP techniques to deliver faster load speeds to your mobile users. And now you are waiting for the payoff: increased customer satisfaction, better search engine rankings (including your page displayed as a featured snippet at the top of Google’s search results) and rising rates of conversion.
But it’s just not happening. What went wrong? Which of the top 10 errors in implementing Accelerated Mobile Pages are preventing your AMP success?
Test Your Accelerated Mobile Pages
One way to easily assess your website’s performance as AMP pages is to run Google’s AMP audit. Google’s rapid assessment can help you monitor and resolve common issues with markup, such as errors in structured data.
The developers at Google also recommend the AMP Validator, a Chrome browser plugin and developer console, or the amphtml-validator npm module, which can be integrated into your build to ensure a valid AMP-enhanced page.
Why Things Go Wrong with Accelerated Mobile Pages
AMP, of course, is all about designing super-light pages for supercharged delivery. The goal is to have content displayed within a mere second. CNBC, for example, uses AMP to achieve blazing fast load speeds of 1.23 seconds on average.
In targeting mobile load times, both AMP Project and Mobile1st’s mobile optimization team have identified slow load speeds as a major consumer complaint. Long and even short waits for loading pages directly and disastrously impact a website’s conversion rate. No wonder mobile experts at the AMP Project, Google and Mobile1st are working strenuously to provide solutions to lagging wait times.
AMP’s open source code employs industry best practices to build lightweight versions of web pages for accelerated delivery. AMP sharply limits the possible set of coding options to ensure consistent, reliable performance and accelerated loading. It utilizes a subset of HTML, but largely excludes JavaScript. In addition, AMP relies on Google AMP Cache to store core elements of your website’s mobile pages at servers around the world, so a website loads quickly whether you are in Lima, Peru or Lincoln, Nebraska.
AMP’s limited HTML coding options, however, often confuse page developers. To ensure correct AMP coding one must master a long list of tags and attributes that have been allowed while excluding the many that have been banned.
“HTML errors are absolute leaders among AMP issues.”
SEMrush
The Dreaded Top 10 Bugs in Your AMP Pages
Running an audit on your Accelerated Mobile Pages may highlight any of 30+ errors in AMP validation that the project so thoughtfully outlines. Those issues run the gamut from AMP HTML Tag and Attribute errors to Style and Layout errors to Deprecation errors.
But as SEMrush has shown, not all errors are equally likely. In fact, the top ten issues make up the vast majority of problems afflicting AMP pages of leading publishers, and the top five happen over 30% of the time.
Without further ado, here are the top ten bugs infesting AMP pages listed in order of frequency, along with the Accelerated Mobile Pages definitions.
- Disallowed attributes
Attributes are whitelisted, so there is no definitive list of all disallowed attributes. To check the supported attributes for each specific tag, search for HTML tag, and then attrs in the AMP validator spec.
- Disallowed tag
Tags are whitelisted, so there is no definitive list of all disallowed tags; however, the Accelerated Mobile Pages specification broadly defines the set of disallowed tags.
- Invalid attribute value
This error indicates that an HTML tag has an attribute with an allowed name, but not an allowed value. For example, one common trigger for this error is invalid values for URLs. All URLs values (in href and src attributes) must match one of these possible attribute values.
- Invalid URL protocol
This error occurs for tags that have an href or src that must be set to certain protocols. For example, many tags require https.
- Invalid URL
This error occurs when an attribute has a URL, but the URL is invalid.
- Mandatory tag ancestor with hint
The error occurs when one of the specified tags is found in the AMP document and isn’t properly nested in its mandatory parent.
- Disallowed style attribute
- Mandatory attribute missing
Mandatory attributes for AMP tags are defined within AMP’s validator spec. Simply search for the tag, view the listed attributes, and check for mandatory: true. Mandatory attributes for each AMP tag are also listed within the tag’s specification.
- Wrong parent tag
Specific tags require an immediate parent (as opposed to distant ancestor).
- Missing URL
This error occurs when an attribute that requires a URL is missing it, for example, an empty href or src attribute.
As can readily be seen, Accelerated Mobile Pages HTML tag and attribute errors happen 90% of the time, while the remaining most common error is due to style and layout issues. Catch these errors to ensure your AMP pages are delivering their maximum performance and profit.
- Mobilizer Public Access Discontinued - January 8, 2019
- Improve Mobile Conversion Rates with Email Remarketing - December 12, 2018
- We Recommend: mCRO with Monetate Test and Segment™ - August 27, 2018