All you need to know about AMP (Accelerated Mobile Pages) for WordPress

WordPressCategory
6 min read
Tom Ewer

A new acronym is sweeping the web. AMP — which stands for Accelerated Mobile Pages — has a lot of people talking about it (for example, here and here).

Unless you are living in a cave somewhere, the topic should at least have popped up in your periphery, and you’re probably wondering how it affects you as a WordPress user. Do you need to do something, and are you in danger of being left behind?

To clear up these and other questions, in this article we will take an in-depth look at what Accelerated Mobile Pages is, the consequences it has for websites and their owners, as well as how to implement AMP in WordPress.

That’s a lot to cover, so let’s get on it!

What is AMP?

Accelerated Mobile Pages is an open-source project by Google that aims to make mobile web pages super fast to load. In a time where the majority of people use the web via phones and tablets, with often slow internet connections, it’s a development that makes sense.

First announced in October 2015, AMP was launched last February. The project is often seen as a response to Facebook's Instant Articles, but it’s made for the open web.

WordPress.com was one of the first publishers to get on board. Other early adopters included Twitter, Pinterest, LinkedIn and others.

While Accelerated Mobile Pages has many people excited, there are also critical voices who are wondering whether it’s the right way to go or if it will stick.

What makes it so fast?

To increase loading speeds on mobile, AMP uses a stripped-down form of HTML that’s designed to be very lightweight. There are restrictions as to what you can do with it on a page. For example, forms are not supported out of the box.

Furthermore, Accelerated Mobile Pages uses a streamlined version of CSS and is limited to a proprietary JavaScript library for things like lazy loading for images. The result is a page that fully concentrates on content.

For additional info, read up on how exactly AMP speeds up site performance on the official project website.

How does it work?

To take advantage of Accelerated Mobile Pages, you basically create a second version of your posts and link to them with rel=amphtml in the header. That way, Google and others can discover and cache posts for mobile display. A canonical link points back to the original. (It’s worth mentioning that WordPress users can simply use this plugin to create AMP pages.)

In the future, Google plans on creating a CDN-like network to store and deliver Accelerated Mobile Pages even faster. But don’t worry — the content is still your own, and you can continue to implement ads and analytics.

What does AMP mean for website owners?

Now that we know what AMP is, how does it affect people running their own sites?

Implementation will be all but mandatory for news sites and blogs

It’s pretty obvious that Google is pushing this feature hard. A huge sign for that is the prime real estate Accelerated Mobile Pages get treated to in mobile search results.

If you run a blog or news site, implement AMP sooner rather than later.

With Accelerated Mobile Pages being specifically intended for post-like content, if you run a blog or news site, you’d be best served by implementing the technology sooner rather than later; otherwise, you run the risk of falling behind the competition.

Many webmasters will need to build valid AMP pages manually

As you will see below, building AMP-compatible pages in WordPress is pretty easy. However, many of the other 74 percent of websites that don’t run on the platform will have to figure out how to build Accelerated Mobile Pages by hand.

Thankfully, there is this resource to help you do so, and this instruction to teach you how to validate your pages. The good news? Like we said, as a WordPress user, you don’t need to worry about building your AMP pages manually.

How to create Accelerated Mobile Pages in WordPress

Adding Accelerated Mobile Pages to an existing site is handled via plugins. There is an official plugin from Google that AMP-enables self-hosted WordPress sites like those on GoDaddy Managed WordPress.

Use the official plugin

AMP Plugin

The official AMP plugin in the WordPress directory dynamically generates AMP versions of all your posts (pages and archives are not yet supported).

Install and activate the official AMP plugin to generate Accelerated Mobile Pages versions of WordPress posts.

All you need to do is install and activate the plugin. At this point, there are no further options available. That said, it’s probably a good idea to validate your pages to make sure everything works well. For that, you can use the aforementioned instructions, or this tool.

You can also access your Accelerated Mobile Pages by adding /amp/ to any URL (e.g. http://yoursite.com/your-post-title/amp/).

Further steps

The official plugin only comes with one default styling. However, there are ways to customize the look of your pages so they don’t end up looking like everyone else’s.

First, you can check the GitHub page of the official plugin, which shows how to implement styling via hooks. Secondly, Delicious Brains has an excellent article that dives deeper into this topic, with concrete examples.

Also, Team Yoast offers a plugin that not only makes your Accelerated Mobile Pages play nice with their Search Engine Optimization (SEO) solution and use the correct metadata, it also enables you change styling and add Google Analytics. Read more about it here.

Accelerated Mobile Pages on WordPress.com

If you are on WordPress.com, your site has AMP pages automatically enabled.

Conclusion

Accelerated Mobile Pages is a big change coming to mobile web publishing that is not without controversy. For now, it seems that implementation of AMP is all but mandatory for content-centered websites in order to ensure visibility in mobile search results. Whether it will stay that way (or become even more important) remains to be seen.

Thankfully, for people running WordPress sites, staying on the forefront of this development is as easy as installing a plugin.

As things unfold, we will likely see additional solutions similar to Yoast’s that enable you to create customized Accelerated Mobile Pages, so keep your eyes peeled.

Have you implemented AMP on your own or a client site, and what do you think about the project as a whole? Can you share any practical insights? Let us know in the comments section below!