Clunky. Slow. Frustrating.

These are the exact mobile web browsing issues that the Google-led Accelerated Mobile Pages (AMP) Project has worked rapidly in the last three and a half months to solve once and for all.

Rising to the challenge of providing web pages that load faster and look better on mobile devices, this open source initiative means that websites using the accelerate mobile pages framework can have content that will load instantly through any source, including:

  • Messaging Apps (SMS, iChat, Hangouts)
  • E-Readers
  • Newsfeed and Aggregator Apps
  • Social platforms

At 1st on the List, our Technical SEO’s have put together an in-depth (yet not technically overwhelming) explanation of the Accelerated Mobile Pages Project, how AMP-pages work, the benefits of AMP, Google Search guidelines for AMP, and how you can potentially use AMP to improve your SEO.

What is the Accelerated Mobile Pages Project?

The Accelerated Mobile Pages Project is an open source Google initiative to improve the mobile web for users and enhance the distribution ecosystem for publishers.

“With the recent shift to mobile, media consumption is changing. Users now consume content wherever they find it — sometimes it’s directly from a publisher’s website, oftentimes it’s not. Given how frustrating the mobile web can be, many content distribution platforms are seeking alternatives. In many cases, these alternatives tend to be platform specific, placing a burden on the publishers to support this fragmentation of formats and closing off the ecosystem.”
~ (AMPProject.org)

Essentially, the main goal of the AMP Project is to preserve the open web publishing model and protect all the revenue streams that go along with it. In order to do this, the AMP Project focuses on building a more common technical core between pages in order to ensure:

  • Consistent content appearance across all modern browsers and apps,
  • Fast loading, flexible and beautiful content, and
  • Compelling and effective ads.

Open source means that AMP is freely available, modifiable, and shareable because its design is publicly accessible. This encourages collaboration, community development, and transparency. Anyone can help enhance AMP.

Since its launch less than four months ago, over 5,200 developers have interacted with AMP. Contributors include people of all different job titles including Chief Strategy Officers, VP’s of Engineering, Editor in Chiefs, and CEO’s. Some of the big publishers contributing to and using AMP HTML include BuzzFeed, The Guardian, BBC, Mashable, The Wall Street Journal, and The Washington Post. Additional technology companies include LinkedIn, Twitter, WordPress.com and Pinterest.

The AMP Project Timeline

May 12, 2015 – Facebook launches Instant Articles

Early last year, Facebook was busy launching Instant Article which could load articles near-instantly, up to 10 times faster than the standard mobile web. The response from publishers was positive, who loved both the look and feel, plus loading speeds, it offered the end reader. Many saw Instant Articles as Facebook’s aggressive attempt to become the primary New Distributor on the web and to become the first and only place users did their Internet browsing. Some also think this triggered Google’s initiative to launch the AMP Project.

October 7, 2015 – Google officially introduces the project.

Since its launch, more than 5,200 developers engaged with the project and 16,000 new AMP pages have been created.

December 9, 2015 – Google announces their intention to send Search Traffic to AMP Pages.

Speculation by the AMP Project suggests that Google will start sending traffic to AMP Pages through Search Results starting as soon as late February 2016.

December 9, 2015Momentum for AMP Project picks up.

Richard Gingras (Head of News at Google) shares updates on the AMP Project including work in four key areas: Advertising, Analytics, Subscriptions, and Content Format. Plus several key players join the AMP movement:

  • WordPress will support publishers wishing to enable AMP pages starting early January.
  • Twitter will start linking to AMP content provided by publishers early 2016.
  • Pinterest is testing AMP pages in both their iOS and Android Apps (and finding they load 4x faster and use 8x less data that mobile optimized pages).
  • LinkedIn expresses their intention to support AMP early 2016.
  • By late February, Analytics Providers such as Google Analytics, comScore, and others will have AMP support in their tools.
  • Additional publishers around the world are expressing their intention to support AMP in 2016.

January 20, 2015 Google’s “Accelerated Mobile Pages Report” available in Search Console.

This is when we first noticed the “Accelerated Mobile Pages Report”  in Google’s Search Console (previously Webmaster Tools), within the Search Appearance section. With this tool, Google will give you a list of successfully indexed AMP pages on your site and prioritize any AMP-specific errors you need to fix in order to have them prominently served to mobile users. This tells us that Google wants to make AMP mainstream. We also take it as a strong suggestion to webmasters and developers to start integrating Accelerated Mobile Page HTML into their sites, where it makes sense to do so.

What Does an Accelerated Mobile Page Look Like?

An accelerated mobile page contains static content built to render fast on any mobile web browser and to be heavily cached. Think of it as a “diet” or slimmed down version of your regular page, like the AMP-page we just made of our latest blog post:

amp-blog-post-example

 

AMP HTML, Javascript, and Content Delivery Network (CDN)

There are three technical parts to AMP:

  • AMP HTML – the AMP HTML variation of the page includes restrictions for reliable performance, plus extensions for building rich content beyond basic HTML.
  • AMP JS – the AMP Javascript manages resource loading, gives custom tags, pre-calculates the layout of each element, and more, to ensure a fast rendering of the page.
  • AMP CDN – the AMP Content Delivery Network is responsible for fetching and caching the page, and has a built-in validation system that confirms the page is guaranteed to work.

How Do Accelerated Mobile Pages Work?

In its simplest form, AMP works by combining limited technical functionality with a distribution system built around caching. The result is a faster and better performance and stronger audience development, in any modern browser or app web view.

Here are four specific ways AMP achieves this goal:

  • Limiting HTML functionality.
  • Following site speed best practices for both technical and architectural approaches.
  • Using a common technical framework between all AMP-pages
  • Caching AMP files in the cloud to reduce time to a mobile device.

More on AMP and Caching

AMP HTML versions of your pages are accelerated by caches created by third parties such as Google. AMP makes it easier for platforms to cache your content while you still maintain full control of the content. In true open source style, Google will provide a cache to anyone to use at no charge and all AMPs will be cached by Google. Other companies can also develop their caching system if desired.

What are the Benefits of AMP?

There are several reasons why you may need to consider AMP for your website.

  1. Better user experience for mobile users.
    Readers can now access your best content regardless of what app, platform, or device chosen. Delivery of content is also blazing fast.
  2. Publishers maintain more control.
    As the publisher, AMP gives you more autonomy and reduces your effort to distribute content to 3rd Party platforms.
  3. Better advertising and revenue streams.
    As the publisher, you can also maintain economic control of your content and develop effective advertising on the mobile web.
  4. Maximizes reach of content.
    AMP boosts the usage of your mobile pages and increases the reach of your content.

Plus, Google says if your AMP-compliant pages include a few additional pieces of information, they can also benefit from special display features in Google Search results.

Accelerated Mobile Pages & SEO: Improving Speed Performance

There are several ways that AMP HTML pages speed up your website and have the potential to improve your SEO:

  • Asynchronous scripts keep JavaScript from delaying page rendering.
  • Static sized resources determine each element’s size (ex. image) before it is downloaded so that the page layout can load without waiting for resources to download.
  • Extension mechanisms (ex. Instagram or Tweet embeds) do not block page rendering.
  • Third-party JavaScripts are kept out of the critical path.
  • All CSS is kept inline and size-bound (50 kb maximum)
  • Font triggering is kept efficient and not delayed.
  • Style recalculations are limited to one per frame.
  • GPU-accelerated animations.
  • Resources are prioritized so that the most important resources are download first, such as ones likely to be seen by a user, are above the fold, or if user likely to scroll down quickly.
  • Pages load instantly because an AMP can predict and render the next page before the user explicitly navigates to it.

AMP Google Search Guidelines

Google indicates that they like validated AMP pages because they can be crawled, stored in, and served from a cache that allows them to be served even more quickly. If your website page has a valid AMP version, Google Search may direct mobile users to the cached AMP.

Here are the five steps Google says to follow to take advantage of AMP’s benefits:

  1. Follow AMP specifications.
  2. Make sure Google can find and index your AMP-pages, and understand the link between the non-AMP page and its AMP page.
  3. Test that your AMP pages are valid and work as expected.
  4. Follow Google’s structured data policies.
  5. Check your Google AMP status report.

Are Accelerated Mobile Pages Right for You?

At this point in time, the AMP Project is still fairly new and we are closely watching how it will play out with Google Search Results and interact with SEO.

We know that AMP makes the most sense for publishers of day-to-day pieces such as journalists and bloggers. Static content with a simple title, text, and perhaps an image are well suited for AMP HTML. On the other end of the spectrum, advanced apps and web pages with interactive elements and complex design may not be well suited to AMP.

Keep in mind that you can have both an HTML and a stripped down AMP HTML version of your website pages.

Visitor experience is a major aspect to consider when deciding to integrate AMP. If you answer yes to any of these questions you may want to consider AMP:

  • Do your visitors expect to find simple text on a page that loads with the blink of an eye that they can quickly read and digest?
  • Would you call your website visitors “Readers” or “Followers”?
  • Do you regularly post new content on your site and do you expect your visitors to consume this content on a daily or weekly basis?
  • Is your website page likely to be shared or viewed through messenger apps, newsfeeds, and social media?

For more information on Accelerated Mobile Pages and upgrading your site to include AMP HTML, or to explore the advantages and disadvantages of upgrading your website to include AMP HTML, please call our SEO Experts at 1-888-262-6687.