What are Accelerated Mobile Pages (AMPs)?

AMP ProjectAMP or Accelerated Mobile Pages is a framework for making the mobile web experience faster without sacrificing the features available in a website’s desktop version, such as graphics, video, forms, and ads.

How does it work?

AMP relies on AMP HTML, a version of HTML with a few restrictions. It strips your website’s HTML code of ‘unnecessary baggage.’ It’s created with streamlined CSS, zero JavaScript, and two other components: AMP JS and Google AMP Cache.

Here’s a video explaining the AMP project:

What’s the Fuzz About?

Yes, experienced developers can create a fast-loading mobile website, but previously this can only be done through multiple website performance optimizations. You’ll often have to sacrifice some features of your website, if you want it to load quicker on mobile.

AMP allows even novice developers to create a mobile-friendly site without totally altering the user experience.

Google’s AMP Project

Google is confident of AMP’s impact on mobile experience that they decided to create the AMP Project with Twitter. They also partnered with other major publishers and brands, like WordPress, Adobe Analytics, LinkedIn, and Pinterest.

The AMP project is an open source collection of standards that helps web developers use the language for their website, and collaborate with others to create new components or functions of AMP HTML. If you go through the website for the AMP project, you’ll see lots of case studies of how different websites use AMP, interactive tutorials, and references to help you experiment with different tags.

According to the AMP project website, more than 1.5 billion pages have been published using AMP and more analysts, and CMS providers are now supporting the format.

The Impact of AMP on SEO

Accelerated mobile pages get special treatment from Google. They appear differently in mobile SERPs. Some AMP pages have a lightning bolt sign, others appear as a carousel of different headlines. Below is an example from Google’s demo. You can try this by going to g.co/ampdemo on your mobile phone, or using an emulator on Chrome’s developer tools.

AMP Pages

Here’s what it looked like when I looked for French Toast recipes on their AMP demo tool. Notice the lightning bolt AMP attribute just below the headline and URL.

AMP Demo Tool

Yes, appearing on top of mobile SERPs sounds great. But there’s a catch.

Let’s say a reader finds your AMP on Google search, and they decide to share it. The shared link will point to Google’s site, not yours.

Remember Google AMP Cache?

It’s a delivery network that fetches, caches, and automatically improves the performance of HTML AMP pages. So when a reader shares an AMP page URL, the next person who reads it is redirected to Google’s cached version of the page (e.g. Google.com/yourwebsitename/yourAMPpage/amp).  Google is collecting content on its own servers.

In a sense, instead of serving as an index like how the search engine typically worked, Google AMP is somewhat emulating Facebook’s Instant Articles.

According to an article on Wired, a spokesperson from Google confirmed that there’s no way to have your content appear on the prioritized SERP if it’s not on Google AMP cache server.

AMP Features

Because of the open-source nature of the project, developers working on AMP have found ways to add different functions on AMP pages.

Here are just a few of the functions you can create using AMP HTML:

  • Interactive AMP pages
  • Log-in required pages
  • Create webpages with a paywall
  • Add gifs
  • Add dynamic and trackable phone numbers on your site
  • Embed 360 virtual reality media files

You can also view templates and metadata samples on this page.

Is AMP Worth Implementing on Your Site?

That depends on your website’s goals. When the Accelerated Mobile Pages project just started, there was no way to add form elements, and rich-content like videos, and ads.

If your goal is to create a more user-friendly mobile experience, then AMP is a good choice. It’s also a good choice if you want to improve bounce rate and conversion rate of slow loading pages.

Of course, converting your whole website to AMP will take time. The whole process might turn into a huge project, especially if you have an old website that’s never been optimized for mobile-use. Images and videos need to use the specific tags and sizes. Custom fonts need to be replaced, if you don’t want to use the amp-font tag.

It’s even more inconvenient if your website relies on ads for revenue, because JavaScript doesn’t work on AMP. While there are now multiple workarounds that allows ads to work on AMP, but you still have to tweak your existing ads to conform to the AMP’s restrictions.

The good news is you won’t be limited to simple ads. AMP now has codes for video ads, and some experimental features like carousel and lightbox ads.

Study Previous Implementations and Experiment

The best thing any online business owner and web developer can do, for now, is to look at the case studies of websites that already implemented AMP and analyze if the results are worth it and possible to emulate on their site.

So far, the AMP project website is full of case studies from big brand publishers, like Slate, Wired, and CNBC. But they also have case studies from e-commerce and advertising companies.

If your website’s blog is one way you get traffic and leads, then it’s worth checking the case studies for different publishers. If you run an ecommerce store, then the case studies for those companies should give you a good idea if AMP is worth implementing on your site.

Leave a Reply

  • (will not be published)

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>