WordPress Websites and AMP (Accelerated Mobile Pages)

Last updated: Monday March 21st 2016
Reading time: 5 minutes

Google has been pushing a new online concept called Accelerated Mobile Pages (AMP)

This post explains what AMP is and why you should get your WordPress website ready for AMP. Facebook are also pushing their own version called Instant Articles. This is a tool for website publishers to distribute fast, interactive articles to their readers in the Facebook app itself. Chances are that you’ve already seen this in action!

wordpress-websites-amp

Joe.co.uk have recently implemented AMP on their website. Note the AMP lightening symbol top right of the featured image here.

So what are Accelerated Mobile Pages? What is AMP?

The Accelerated Mobile Pages project aims to make pages load instantly on mobile. Facebook have pushed this recently – you may have seen the small lightening symbol on news articles to open stories quickly. The web is slow for lots and lots of people, in fact, the majority of the people using the internet do so over a mobile phone, often on a 2G or sometimes 3G connection. To make pages load instantly, AMP restricts what you can do in HTML pages. Fancy design is stripped out in favor of speed. AMP is very much a function over form project.

The web is slow for lots and lots of people, in fact, the majority of the people using the internet do so over a mobile phone, often on a 2G or sometimes 3G connection. To ensure that web pages load instantly, AMP restricts what you can do with code and scripts on posts and pages. Enhanced design is stripped out in favor of fast load times. AMP is very much a function over form project but it has been received really well by the creative design industry.

AMP pages look like a very stripped down version of normal web pages, but do contain all the important content. Not all ads will work on AMP, not all analytics will work with AMP. All the “fluff” of your pages is stripped in AMP, including the read more links you might have built into your theme etc.

If you run a news site or a website blog, you need to make sure your WordPress website supports AMP. It’s as simple as that.

an-amp-page-in-wordpress-website-design

I have recently been playing around with AMP on my own website. Here is a basic version of my site in AMP more.

Which plugin(s) to use?

There is a good plugin by Automattic that enables AMP for your site:

When you enable this plugin, all the post URLs on your site will have a/amp/ version. So you can go to any post, add /amp/ to the end of the URL and you’ll see the AMP version. The plugin adds a standard meta tag in the head of your normal pages that makes it possible for Google and others to recognize these pages exist.

The AMP plugin uses the site’s logo that you can set in the WordPress Theme Customizer, but other than that doesn’t add any styling. If you’re going for the bare minimum, install and activate this plugin and you’re done. The plugin has no settings, whatsoever.

 

About the author
Laurence

I am a 27-year-old WordPress web designer and SEO consultant based in Banbury, Oxfordshire, UK. I have designed and maintained sites with over 20,000 pages on large corporate websites, smaller small business sites, and tiny personal websites and blogs. I provide freelance WordPress web design services in my evenings and weekends and also work full time at Toast Design in Banbury. You can connect with me on Twitter, Facebook and on Google+.