Accelerated Mobile Pages – The Mobile Revolution Continues

automotive ampNow that everyone has more or less jumped on the Responsive Web Design bandwagon (especially in the WordPress world), Google has come along with AMP (Accelerated Mobile Pages). What is AMP and do you need to care?

Responsive Web Design

Remember, oh say five years ago, browsing the internet on a smartphone? It was rather painful, you had to pinch and zoom practically every site just so you could actually read the text. Then Webmasters realized this mobile thing wasn’t going away and starting making their sites mobile friendly. There are a number of ways to make your site mobile friendly, however Responsive Web Design (often just referred to just as “Responsive” or “RWD”) became really popular as a solution.

A site using RWD adjusts to the viewer’s screen size. To see if a site is Responsive, you can drag the right side of the browser inwards and see if the elements on the page adjust to fix into the smaller screen size (or you can just view the site in a smartphone). For WordPress sites, If you are not yet on a Responsive theme, the WP Touch plugin is a nice alternative.

With RWD, however, there is a lot of added complexity under the covers. I actually stopped building WordPress sites around this time just because I didn’t want to master using Responsive. It’s not just the full page, all the individual elements on the page have to be Responsive as well. That complexity comes with a cost, namely performance. A Responsive site can be a lot slower, ironically especially on smart phones, which is the whole reason why we have RWD in the first place.

Responsive’s achilles heel

The problem with RWD is that everything is downloaded, not just the HTML elements you are showing on a mobile device. That can mean a lot of round trips between the mobile device and the server to fetch HTML and javascript components which slows everything down, especially on 3G.

And regardless on whether we are on a desktop or a smartphone we users are an impatient bunch. According Kissmetrics (published in this Search Engine Journal article):

  • 40% of people abandon a website that takes more than three seconds to load (that percentage goes to 56% when on a mobile device.
  • A one second delay in page response can result in a seven percent reduction in conversions.
  • If an e-commerce site is making $100,000 per day, a one second page delay could potentially cost $2.5 million in lost sales every year.

Yes there are techniques to address these problems, such as restrictive loading and adaptive images, but not every Responsive site is using them and they are not a panacea. The additional work adds time and cost to the development cycle, and the level of expertise needed is not always available.

Keeping smartphone users on Google

Despite the performance issues, Responsive Web Design is Google’s recommended design pattern. With the other two approaches: Dynamic Serving and Separate URLs, there is additional tagging and configuration you need to implement to keep your site SEO friendly, and a lot of sites get that wrong too.

In the mobile world, business owners have the choice of creating a mobile app to serve their user base. Apps have none of the performance issues that a Responsive website does, although you need to get your user over the hump of getting the app installed on their phone. But a mobile app means that user isn’t using Google at all, and that’s something the search giant doesn’t want to see more of. Additionally, Facebook announced Instant Articles (just recently opened to all website owners) to speed up the reading experience when clicking on articles in the News Feed. So last fall Google created an open framework called the Accelerated Mobile Pages (AMP) project, and announced it earlier this year (2016) with the goal of a “better, faster mobile Internet”.

Accelerated Mobile Pages

As Will Critchlow from Distilled explains:

At its simplest, AMP HTML is a subset of HTML with only specific JavaScript “components” available. It’s designed for creating “reading” content, rather than anything interactive. It is already designed to have ad units included and is going to have a standardised way of including analytics code, but it drastically limits the use of JavaScript.

Essentially the AMP content is static (rather than dynamic, like RWD is) and designed to be pre-renderable. This means that Google (and anyone else that cares to support AMP) can pre-load and cache the visible part of a page much more quickly. The bottom line? A lot less HTTP requests reducing the number of roundtrips between mobile device and server that slows many Responsive sites down.

Google says that AMP HTML is “pretty fast”, saying that early testing shows performance improvements of between 15% and 85%.

As you might expect, Google is working to make sure current Display Ads formats work within the AMP environment:

In the near term, our top priority is making sure that ad formats, features and measurement that publishers rely on work within the AMP environment. When AMP launches on Google Search in February, it will include important, basic functionalities. These include the ability to traffic ads with ad servers of your choice, support for multiple demand sources and formats (including native ads), full control over ads placements, and viewability measurement. It also includes integration with 20+ ad tech vendors, all of whom are excited to participate in the AMP initiative

AMP and WordPress … and SEO

For those of you on WordPress, Automattic has released a plugin that will enable your pages with AMP. Yoast is planning to add AMP support to his popular Yoast SEO plugin, but in the meantime you can customize the metadata in the AMP using a “glue” plugin.

This brings up an important point about AMP, in that the AMP URLs are separate from the original published pages. With the WordPress AMP plugin, your AMP pages will have /amp/ appended to the end of the URL. So it’s important to have your canonical tags set so Google knows that both pages are the same content.

Have you taken a look at AMP? What about Facebook instant articles?

Additional resources:

How to Radically Increase the Overall Performance of Your Responsive Website
Site Speed vs Responsive Design: Which is More Important?
Facebook Instant Articles
The AMP Project

About the Author Kathy Alice

Kathy Alice Brown is a SEO expert specializing in Technical SEO and Content. In her spare time she loves to get outside.

Let’s Connect & I’ll Send You Your Ultimate 28 Point Page Performance Cheatsheet Instantly:

Leave a Comment:

1 comment
jumbo says May 6, 2017

Thanks for the information.

Add Your Reply