Migrating Mobile Pages to Accelerated Mobile Pages (AMP): Benefits and Next Steps
700,000—that’s the amount of publishers using AMP, and with good reason. Sites using AMP see faster load times and increased site visitors (Gizmodo saw a 50% increase in impressions and 100k AMP visits daily!). The following blog post will help you to discern whether or not accelerated mobile pages could benefit your site, as well as next steps for implementation.
Who Benefits From AMP
In short, AMP is a page structure that Google and partners created to yield mobile pages with groundbreaking speeds. While all websites can benefit from faster load times, the technology’s limitations mean that not every site may find AMP advantageous to utilize.
Keep these limitations in mind when determining whether or not AMP is right for your site. If it’s a good fit, there’s plenty of perks to accelerated mobile pages.
AMP Can Positively Influence Organic Visibility, But With a Catch
As of March 2017, AMP is not a factor within Google’s ranking algorithm that determines URLs’ positions amongst the search results. However, AMP can improve other rankings factors, including:
- Mobile site speed
- Engagement metrics, including click through rate, time on site, and bounce rate
Additionally, Google now heavily prefers to feature AMP-friendly resources within News results, a trend that will only continue. As noted by Search Engine Land in January 2017, Google increased the amount of news results that feature AMP from 30% to 70%.
However, for AMP results within the News section, there is a caveat every digital marketer should be aware of: the link readers visit and share lives on Google, not your own website. If driving traffic directly to your site is important, AMP may not be the best option.
How to Implement AMP
Some sites may have shortcuts available to them. For example, websites that utilize WordPress can install a plug-in that automatically renders AMP pages. However, for other webmasters, the process will be more involved.
Create AMP-specific URLs
Maintain an alternative, desktop-friendly version of each page you want to make AMP-friendly. To ensure that search engines understand the association between the two URLs and compound any accrued SEO value, include rel=“canonical” and rel=“alternate” tags within the HTML. You can learn more here.
Modify pages to follow AMP guidelines
As previously mentioned, AMP has very strict requirements for how a page can be built. Most likely, your site currently does not meet these stipulations. While a full list of guidelines can be found here, below are major hurdles your pages will need to clear in order to become AMP-friendly.
Implement required HTML tags: The AMP Project states that all sites attempting to become AMP-friendly must include the following:
- The doctype <!doctype html>
- A top-level <html ⚡> tag (<html amp> is accepted as well)
- <head> and <body> tags (They are optional in HTML)
- A <link rel=“canonical” href=”$SOME_URL” /> tag inside their head that points to the regular HTML version of the AMP HTML document or to itself if no such HTML version exists
- A <meta charset=“utf-8”> tag as the first child of their head tag
- A <meta name=“viewport” content=“width=device-width,minimum-scale=1”> tag inside their head tag. It’s also recommended to include initial-scale=1
- A <script async src=“https://cdn.ampproject.org/v0.js”></script> tag inside their head tag
- The AMP boilerplate code (head > style[amp-boilerplate] and noscript > style[amp-boilerplate]) in their head tag.
Use AMP-specific tags for images and downloaded resources and state their size within the HTML: Images, iframes, ads, and similar page elements must state their dimensions within the HTML. This enables AMP pages to render the layout of the page prior to downloading the resources. Through this tactic, AMP can render the layout and copy with a single HTTP:// request. What’s more, such resources must use the appropriate AMP tag, such as “amp-img” or “amp-video.”
Ensure that CSS does not hail from external style sheets: All styles must be referenced within the <head> of the page using a <style amp-custom> tag.
Remove all forms from the page: As mentioned above, AMP-friendly pages do not allow forms.
Validate that the pages are AMP-friendly
It’s important to have your site’s AMP-friendliness validated in order to have your site recognized as being AMP-friendly by search engines and certain social sites. There are multiple ways to accomplish this, including visiting https://validator.ampproject.org/ and enter the URL to determine which elements prevent the page from being fully AMP compatible. Google Search Console offers a similar tool found at https://search.google.com/search-console/amp.
Decide whether to leverage the Optional CMS of Google AMP Cache
Google AMP Cache essentially provides a free CDN to further accelerate site speeds. However, webmasters can choose to continue to use existing Content Delivery Networks like Cloudflare, if preferred.
Many industry experts celebrate AMP as the technology to redefine industry standards, while others dislike how it dramatically limits design. However, there’s no denying that both mobile-friendliness and site speed will become more influential to both web users and search engines. If your site meets the right criteria, AMP will position your site to provide a fast experience.
Need more advice on AMP or other SEO initiatives? Contact us.