Getting started with Google AMP & WordPress

Back in February 2016 Google officially launched their ‘Accelerated Mobile Pages Project’ (AMP for short) with little fanfare. Since then, Google’s AMP has quietly become a staple of the web landscape, even if you’ve never have heard of it.

What Is Google AMP?

Accelerated Mobile Pages is exactly what it say on the tin, it speeds up the loading time of your website on mobile. This is achieved by effectively creating a 2nd version of your website just for mobile, which uses a very limited set of web technologies (most javascript is forbidden, for example). When your mobile pages are accessed via Google search results, the pages are cached and actually served from Google’s own servers, for an additional speed boost.

Google AMP has its critics, primarily because it is yet another layer of proprietary technology you are required to implement (there is a certain irony in adding yet more code to your site, in order to make it quicker). Many influential people within the tech industry have criticised Google AMP, from Scott Gilbertson’s rather sensationalist “Kill Google AMP before it KILLS the web” to Alex Kras’ more considered “Please Make Google AMP Optional“.

However, it’s hard to underestimate the importance of pages that load quickly. According to a report from the BBC in 2016, over 50% of web users will wait a maximum of 3 seconds for a page to load. When you consider the increase of mobile traffic in recent years, and the speed restrictions of 3G connections in some areas – it makes perfect sense to try and increase the speed of your pages on mobile.

Regardless of opinions, Google appear to be committed to AMP and have started to denote AMP sites on mobile search with a small lightning icon. Whilst this might seem a innocuous change, would you want your competitors site to be labelled ‘fast’ by Google, whilst your own site isn’t? Fear of loss is a powerful motivator and for many online businesses, ignoring AMP isn’t a risk worth taking.

Here is an example of how one of our blog posts appears in Google search results, notice the AMP logo (a lightning bolt) next to the published date.

 

Should I be using Google AMP?

Whether you should be using Google AMP depends largely on the type of site you have. Initially AMP was adopted by online publishers, and AMP is most commonly used on sites that are publishing news content on a regular basis. The Guardian, for example, has been using AMP since February.

Of course, if the majority of your website’s traffic is mobile, then you should strongly consider using AMP, even if you are not an online publisher. eBay for example, were an early adopter of  AMP and use it to serve all their mobile content.

If your website offers a rich, interactive experience then you may need to consider if AMP is the appropriate technology for you. As AMP pages are stripped of javascript, the experience of using AMP pages can vary hugely to the non-AMP version of your pages.

At 34SP.com we have AMP setup on our blog, as we publish blog content reasonably frequently. We don’t currently have it setup on our main site, as we don’t get a huge amount of mobile traffic (people tend to buy/manage their hosting accounts on desktop machines). It may be that a mixed approach such as this suits your needs too.

 

How fast is AMP?

As we’ve already mentioned, we have Google AMP installed on our blog. Here is a real time test on a mobile 4G connection, where we load one of our blog posts, firstly without AMP (left), and then with AMP installed (right). As you can see, the speed difference is noticeable. The ‘normal’ page loaded in 2.24 seconds, whereas the AMP version of the same page loaded in 1.6 seconds. A small difference, but a marginal gain never the less. You’ll also notice there are aesthetic differences between the two pages, with smaller images and a more ‘stripped back’ look on the AMP version. This is all part of ensuring that your content loads quickly on mobile connections.

---

Setting Up AMP with WordPress

Setting up your website to serve AMP pages to mobile content can be a bit fiddly, but thankfully its a simple process for the vast majority of WordPress users. Firstly, you need to install the brilliant AMP plugin from Automatic. I’d also strongly recommend installing Yoast’s Glue for Yoast SEO & AMP if you are using Yoast’s SEO plugin.

Once you have installed the above plugins (and activated them), you’ll be able to double check if AMP is working on your site. To test this, simple add ‘/amp’ to a URL on your site. If AMP is working, you’ll see a stripped back version of your website.

You can customise the look the look of your AMP pages via the WordPress dashboard. Simply login, and click on ‘SEO’ from the menu on the left had side of the screen. Then choose ‘AMP’. If you select the tab labelled ‘Design’, you can customise your AMP pages to use to brand colours. The customisation is far from fully featured, but thats the point – your AMP pages are simple and minimal compared to your main site.

Once you have finished your customisation, AMP is set up on your site and you are good to go ( I did say it was easy).

Do you have experiences on using AMP? Maybe you have an opinion on this technology? We’d love to hear from you, so let us know in the comments section below.