Accelerated Mobile Pages (AMP) were launched in February 2016 and are becoming an increasingly common sight in Google search results on mobile devices. You can tell if an article is AMP as it will be noticeably faster to load (coming from cache and virtually instant) and it will have a lighting bolt with ‘AMP’ next to it.

amp lightning bolt

The Accelerated Mobile Pages Project is a result of Google getting together with dozens of other publishers and technology partners to try to solve the problem of slow mobile browsing. The idea is to reduce clunky and slow page loading times to improve reading articles on the mobile web.

When a normal HTML webpage is loaded the browser then loads a multitude of other resources, such as CSS, fonts, JavaScript etc, all of which takes time and often comes from separate servers. AMP HTML applies a strict set of rules to what resources can be loaded, creating its own version of the page, limited to the most basic and fastest web technologies.

Facebook launched its own version called Instant Articles back in May 2015 (which use a combination of HTML5 and XML) designed for the same purpose – to speed up people’s reading and browsing experience, albeit within the Facebook platform alone. The major difference with AMP is its open source nature and its ability to be adopted by a wider variety of platform, allowing anyone to cache and use articles. Rival social media heavyweight Twitter has signed up to the AMP Program.

What is AMP HTML?

AMP is basically a way to build web pages for static content that renders fast. They use a stripped-down form of HTML designed to be lightweight and fast loading.

In AMP HTML certain tags are no longer allowed. Forms for example are not allowed, CSS needs to be streamlined, and JavaScript is no longer permitted (one of the biggest reasons for web pages taking a long time to load). Images now only load when they are scrolled into view so you don’t have to wait for the whole page to load before using it.

amp html file example
AMP HTML example doc from Ampproject.org/learn/about-amp/

The only type of JavaScript allowed is off-the-shelf JS libraries that are pre-approved and provided by the AMP Project. These libraries ensure the fast rendering of pages, and give the ability to build rich content beyond basic HTML.

AMP JS library on GitHub
AMP JS Library on GitHub

The whole principle of AMP is to allow content to be cached by anyone. AMP pages you create will be hosted on your server, but then accessed by Google (or anyone that wants to) who will then cache a version of that page. Cached versions of the article will contain the rel=’canonical’ tag pointing back to the original. Analytics and adverting will still work on the cache versions so publishers can still accrue revenue and view accurate page views.

Who’s using AMP?

At first large news publishing sites were the ones to take up AMP. Now an ever-growing number of platforms support AMP, either by providing an AMP component or by offering integration with AMP. Publishers of any kind supplying regular news that rely on search engines to distribute, are likely to be either using or experimenting with AMP pages.
amp users
Current AMP collaborators from Ampproject.org

Ecommerce sites with large product databases and complicated functionality will no doubt find AMP too simplistic for the majority of pages on the site. But for those ecommece sites that have a content resource or a blog, there’s no reason not to adopt AMP on at least a trial basis to see if it improves traffic and/or search placements. It will almost certainly provide a faster experience for customers.

Sources:
Ampproject.org
Builtvisible.com/implement-amp-pages/
Howtogeek.com/284166/what-is-google-amp-and-why-is-it-in-my-search-results/
Moz.com/blog/accelerated-mobile-pages-whiteboard-friday