01273 805 499 hello@workwithgoat.com

Accelerated Mobile Pages (AMP). The what, why and how

AMP content is the next big thing in website optimisation, find out how to turn your dial up to 11

Read in 4 minutes

By Benedict Adam

Co-founder, GOAT

What are Accelerated Mobile Pages and why do we need them?

A common problem faced by mobile users when reading on the mobile web is a slow to load pages, cluttered with content, ultimately offering a poor user experience. Over the last 12 months Google have been helping drive forward an open source initiative to improve the mobile web experience for everyone, the project aims for all content to be mobile optimised and load instantly.

AMP are light pages due to a limited ‘technical functionality’ meaning you can’t leave you page so bloated it takes forever to load. AMP files are also cached in a Google provided cloud in order to reduce the time content takes to get to a user’s mobile device making them super fast.

The video below explains the concept of the AMP project and how it intends to get people browsing information as the web was intended:

AMP, SEO and search results

This all sounds fantastic but how does the AMP project effect promoting my business in search?

Well, when impact of AMP first started effecting the average web surfer earlier this year, Google was simply sending people to AMP pages in the “Top stories” section of the Google Search Results page on mobile phones. SO it only seemed really relevant to content publishers. From the horses mouth:

Since then, we’ve seen incredible global adoption of AMP that has gone beyond the news industry to include e-commerce, entertainment, travel, recipe sites and so on. To date we have more than 150 million AMP docs in our index, with over 4 million new ones being added every week. As a result, today we’re sharing an early preview of our expanded AMP support across the entire search results page –not just the “Top stories” section.

Note the “entire search results”. Where AMP pages were previously seen as a necessity for publishers, its now become a massive opportunity for everyone that has content on the web. Within the industry this is being compared to the ‘Mobilegeddon’ update where Google started highlighting mobile friendly pages in its results and giving them a ranking boost.

Where this differs is that there will be no ranking boost for AMP pages for now, they will simply be labeled so with labeled with The AMP Logo. When you tap on these results, you will be directed to the corresponding AMP page within the AMP viewer. How long it takes the average web user to cotton on to these pages being faster loading is unknown so effect on CTRs can only be guessed.

Below are Google’s examples of how AMP content is currently integrated into the search results for those all important queries like [french toast recipe] and [welcome to miami lyrics]

google-french-toast-amp-examplewill-smith-amp-example

Getting started with AMP pages

Now you know you can get Will Smith lyrics in a split second, you’ll need no more convincing of the importance of creating AMP versions of your website.

Ampproject.org is the best place to head to get started at building your first AMP page. Essentially an AMP page is like any other HTML page, but with a “limited set of allowed technical functionality that is defined and governed by the open source AMP spec”. It should be fairly straightforward for most developers to implement.

Once you’ve created your AMP page you need to prepare your page for discovery and distribution. As you’ll most likely have a non AMP version and and AMP version you need to point Google in the right direction.

This is done by adding information about the AMP page to the non-AMP page and vice versa, in the form of <link> tags in the <head>.

Add the following to the non-AMP page:

<link rel="amphtml" href="https://www.example.com/url/to/amp/document.html">

And this to the AMP page

<link rel=“canonical” href=“https://www.example.com/url/to/full/document.html”>

That’s it. Sit back and wait for Google to discover your pages or submit them in Google’s Search Console. Within search console there’s a handy tool to fix errors on your Accelerated Mobile Pages (AMP) in order to have them prominently served to mobile users:

Screenshot 2016-08-09 10.46.24

AMP for WordPress

If you run your news or blog through WordPress then you’re in luck. You can get your AMP posts up and running in next to no time using a plugin by Automattic that enables AMP for your sites blog posts:

AMP WordPress plugin banner

To change how your AMP pages are looking you’ll need to style using CSS and if you don’t want your AMP pages using the default meta data for the post try Glue for Yoast SEO and AMP plugin.

The afore mentioned plugin only works on blog posts though so if you run a WordPress CMS you’ll need to put a bit more effort in to get all your web content AMP versions.

This is really the tip of the iceberg when it comes to The Accelerated Mobile Pages project, with features such as live updating AMPS and improvements to Ad load times you’ll be hearing a lot more about AMPS in the coming months.

Need help implementing AMP on your website? Get in touch or you can also follow @GOATDigital on Twitter, for all the latest digital marketing news and updates.

Thanks for reading.

Shares