What are AMP pages and how can they be of benefit?

Accelerated Mobile Pages, or AMP, is an open source project that aims to speed up webpages on mobile devices. It allows web users to visit a page on your website immediately by rendering much faster than a standard HTML webpage. It essentially supplies the web user with a stripped back version of the HTML which is called AMP HTML.

By stripping the nitty gritty components down to a slimmer, ‘diet’ version, super fast loading becomes the page’s ultimate weapon. They acquire their speed by placing restrictions on the use of certain HTML tags (such as forms). These pages also stipulate that only a streamlined version of CSS is used, while JavaScript is frowned upon.

AMP provides the JavaScript library for you, which allows elements of the page – such as images – to load only when they scroll into view. Roll these features in a heavily cached Google blanket and you don’t even need to fetch data from the hosting. This culminates in a page that is destined for raw speed and readability.

amp


How you can benefit from AMP pages

In a mobile first world, speed is increasingly important, where pages need to be fast to effectively reach and engage users. This pair of statistics highlight that point:

75% of mobile sites take 10+ seconds to load
53% of mobile users leave just 3 seconds after the site has loaded

Users thirsty for quick-fire internet browsing aren’t hanging around on bloated sites crammed with ads. With Google AdWords now embarking on integration into a AMP pages, this particular stat has some mileage:

Pages that load in 5 seconds accumulate TWICE the ad revenue compared with those that take 19+ seconds.

Blogging outlets and huge media websites like The Washington Post have increased their page loading times by an impressive 88%. Their streamlined pages are are boosting customer retention too, with 51% of mobile search users returning to the site within 7 days.

Whatever the aim of the page being created, AMP is proving a success. It’s increasing traffic, the traffic is engaging more with the content and with that, naturally bringing more money into the business.

These benefits are catching the eyes of those in the business of online marketing. After its early success, AMP’s popularity, support and growth is only going to head one way.

How can I Make AMP Work for my WordPress Site?

You can actually integrate AMP in about 5 minutes for your WordPress site. Simply follow these steps:

1) Install the AMP WordPress plugin by Automattic
2) Activate the plugin – what it will do is append /amp on all your pages but what it won’t do is redirect mobile visitors to your /amp pages
3) So the next step is to edit your .htaccess file – you could use an FTP program to do this.
4) (Optional) Just in case you want to check if your AMP pages are working across the board: In your .htaccess file, paste this code:

RewriteEngine On
RewriteCond %{REQUEST_URI} !/amp$ [NC]
RewriteCond %{HTTP_USER_AGENT} (android|blackberry|googlebot\-mobile|iemobile|iphone|ipod|\#opera\ mobile|palmos|webos) [NC]
RewriteRule ^([a-zA-Z0-9-]+)([\/]*)$ https://example.com/$1/amp [L,R=302]

Note that you have to change example.com to your site’s domain name.

5) Lastly, you will want to edit the CSS to make your Accelerated Mobile Pages look and feel more like your site. You can edit the CSS using FTP by going to your wp-content -> plugins -> amp -> template.php

If you want to know more about AMP, Moz’ Whiteboard Friday does a great job on explaining it further:


Contact us


Back to Blog