How website’s can benefit from Accelerated Mobile Pages (AMP)?

Accelerated Mobile Pages (AMP)

How websites can benefit from Accelerated Mobile Pages (AMP)?

What the heck is AMP anyway?

AMP (Accelerated Mobile Pages) is an open source project backed by Google and Twitter amongst other companies to load mobile web pages faster. By using a lightweight version of HTML

How does AMP work?

First things to mention are that there is no Java Script in AMP, a streamlined version of CSS and some HTML tags aren’t used. Also images aren’t loaded until they are scrolled. All this is designed so that Google can host/cashe the pages and not fetch them anymore. AMP HTML can load anywhere from 15 to 85% faster than the non-AMP version of that page.

 

Accelerated Mobile Pages (AMP)

in the diagram above you can see three elements and three linkages to the various ‘page types’. ‘Conventional HTML page’ is your standard desktop version of the page, if you have an AMP version of this page you place a rel=”omphtml” tag in the source code. which points to what I’ve designated the ‘Hosted HTML page’. and ‘Cached HTML page’

 

If you want a live example take a look at the Guardian ( This is the conventional HTML page)

Guardian amp example

 

And this is the AMP version of the page (Hosted AMP page in the diagram)

Hosted AMP page
Click on pic for link

 

When you see this page in Google’s search results it is a cached version (on a gstatic.com version)

It’s fast because the HTML is cut down, but it’s also potentially designed that these things are bits of content that can be cached potentially by anyone without rel=canonical pointing back to you.

So what? Why should I use AMP, what are the benefits of AMP?

in the demo that Google has provided, it’s showing up as a carousel above the regular results (the blue links), typically for news-related terms,although this is not a ranking factor it is preferential treatment.