Blog
Written by: mangools  blog  SEO  Google AMP: Is it worth it? Will it make my website faster?
Reading time:  7 min

Google AMP: Is it worth it? Will it make my website faster?

Category: SEO

The Accelerated Mobile Pages (AMP) project changes the mobile search industry as we know it. Or doesn’t it? Earlier this year, we mentioned Google AMP as one of the top SEO trends for 2017 when it comes to mobile optimization.

In this post, I’ll explain what’s the project about, how it works and how to implement it so your AMP website will be correctly recognized by Google search.

What is AMP?

The AMP is an open-source framework to enable fast website loading and content distribution. It’s basically a faster version of HTML called AMP HTML. In case you want to keep the non-AMP version of your site, the AMP version will have “/amp” in the URL.

While this is a Google project, it’s not a ranking factor. Not yet! Implementation won’t directly improve your positions. But I recommend doing so for certain types of websites. Mostly for improving UX, which leads to better mobile optimization. And that’s a ranking factor.

Every AMP page has an AMP logo in search results to indicate faster and better mobile experience.

Google AMP search results

People want to seamlessly find what they’re looking for and expect to be served quickly. That’s why page speed is incredibly important, especially, on mobile devices.

If a mobile page takes longer than 3 seconds to load, 53% of all visits are abandoned. No doubt Google works on improving mobile SERP.

How does it work?

Implementing the AMP requires 3 main components:

1. AMP HTML

The AMP HTML is a usual HTML with custom AMP properties. For example, <amp-img> is a replacement for <img> tag. You’ll find the full list of components and tags on AMP.

Here’s an example of the code:

<!doctype html>
<html ⚡>
 <head>
   <meta charset="utf-8">
   <link rel="canonical" href="hello-world.html">
   <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
   <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
   <script async src="https://cdn.ampproject.org/v0.js"></script>
 </head>

2. AMP JS

It’s responsible for fast delivery of AMP sites thanks to swift resource loading and adding the custom tags. The biggest advantage is asynchronous external source making. That means nothing on the site can block anything else.

The AMP JS library is available on GitHub.

3. AMP Cache

The AMP Cache is placed on Google. It’s a proxy-based content delivery network that enables fast website rendering.

Once you visit an AMP page, Google caches its contents. This way, every other person who visits the same page, it will be loaded from the Google AMP Cache.

On top of that, it includes a validation system to verify whether the page is working properly and meets all AMP requirements.

In case you run a WordPress site, you can use the AMP plugins. They will basically do the job. Depending on the plugin features, you’ll have to customize the AMP version appearance.

AMP testing and validation

You can test the AMP validity here: https://search.google.com/test/amp

The report is detailed so you immediately know whether the AMP tags, CSS or AMP HTML isn’t implemented correctly.

Checking the actual number of AMP indexed websites, errors and tips to fix them is available in Google Search Console (Webmaster Tools).

Google AMP test search console

To sum it up

The Google AMP project can be a game changer in mobile optimization. From what I observed during the last couple of months, it’s not such a big shot. I know, it’s an ongoing project. There are many optimizations to be made. We’ll see if it doesn’t end up as a useless innovation project.

I think you don’t need to rush and implement the AMP if you aren’t a news portal, blogger, or content publisher.

One thing’s for sure – AMP sites provide faster content delivery while browsing on a mobile device – and that’s crucial. According to Google, the project gets faster and grows every day.

Social networks such as Twitter or Tumblr are working on AMP support in their iOS and Android apps. E-commerce joins the AMP ecosystem too. We’ll see how it goes in the future.

  • Promotion pkkart

    Hi
    Nice article

    • Hi there. Thanks a lot for the feedback. We appreciate it!

  • Pranay Agarwal

    Hi, How can I access AMP site on mobile. I am using AMP on drupal but I need to add ?amp in URL to access the AMP version.

    • Hi Pranay,

      In this case, you should add it. Generally, it depends on the method of implementation. Some methods use “?amp or /amp” in the link or the page can be designed only for AMP without original html version.

      In the first case it should be something like this added to of your html version of the page:

      I would recommend looking for detailed info here https://www.ampproject.org/

      Hope this helps!

      • Pranay Agarwal

        I just wanted to know if there is something I can do to open AMP pages for mobile device only.

        • If the AMP page is indexed by Google, it should automatically appear in mobile SERP.

          In case you want to check it on desktop, you need to add “?amp or /amp” to the URL depending on your CMS.