What are AMPs - Accelerated Mobile Pages
The open source initiative, Accelerated Mobile Pages (AMPs) developed by Google and Twitter focuses on improving the loading speed of web content on mobile devices. A stripped down version of HTML, AMPs produce speed improvements between 15% and 85% when tested using a 3G connection.
This month Google will begin ranking and displaying AMPs in their mobile search results. So what are they all about, and how as a webmaster would you go about implementing them ?
We’ve put together a series of questions and answers covering the basics.
Who is currently using AMPs?
The Guardian were one of the first publishers to implement AMP back in October 2015. Other publishers on board include, Vox and the New York Times.
Why are AMPs fast?
- Stripped down version of HTML
- Cut down version of CSS
<script src="https://cdn.ampproject.org/v0.js"></script>tag in the AMP document
- Google based caching of AMPs through its CDN
- Lazy loading and rendering, elements on page only load when they come into the browser's view
What are the alternatives?
Facebook instant articles which was launched last May and Apple’s latest iOS 9 mobile operating system introduced Apple news recently as well.
Who is it for?
Primarily for content publishers, where attention is the main ‘conversion’.
When is it launching?
This month (February 2016).
How do AMPs appear in the SERP?
As a carousel at the top of the SERP.
What about SEO and duplicate content?
As usual, the canonical tag would be used to identify the main story and the addition of
<link rel=amphtml> in the header indicates the location of the AMP. Google and other search engines won’t recognise the AMP as duplicate content if the ‘amphtml’ meta tag is used.
Will AMPs replace responsive design?
No, you will still need a mobile friendly version of your website as we don’t yet know which queries trigger AMP results.
What about adverts and tracking?
Advertising platforms and networks are supported (Doubleclick, Adsense and Outbrain to name a few). Analytics will also still be available on AMPs, as well as tracking pixels.
How do I implement AMPs?
Some CMS’s already offer out of the box plugins – Wordpress for example has an AMPs plugin. Your developer will need to follow the AMP HTML format if your website’s CMS does not yet offer an in-built solution.
How would my developer check that my AMPs are valid?
- Open chrome add #development=1 to the url, for example – https://amp.theguardian.com/media/2015/oct/11/google-amp-facebook-instant-articles-apple-news#development=1
- Open chrome dev tools by right clicking the page and choosing inspect
- Click the console tab
- You should see the validation result in the window
What about other devices?
AMPs will also be useful for other devices including smart watches and TVs. Google will be able to reformat the content for the device requesting it, allowing for an optimised experience across all ranges of devices and connection speeds.