The Ultimate Guide to Getting the Most From Google AMP on Your HubSpot Blog and Website

You may have noticed a change to the mobile SERP in Google where there’s either an AMP carousel at the top of the page or a lightning bolt with AMP on the search result in the “10 blue links”. Google is on a mission to deliver the information we seek to our devices faster than ever before and thus comes its major speed initiative, Accelerated Mobile Pages or AMP for short.

What Is Google AMP?

In October 2015, Google announced the Google AMP Project beginnings and in February 2016, Google began rolling it out in the search results pages. Its focus is on delivering web content to mobile devices in near instant time by delivering a more stripped down version of HTML web pages. In short, AMP is a very slimmed down version of a webpage that has removed many elements that cause a page to load slowly, such as excess cookies, third-party JavaScript, and embedded ads. This results in a new version of the page that loads at near instant speed.

There are three core components to AMP:

1. AMP HTML 

Certain tags in HTML you cannot use on AMP pages. Things like forms are out. Also to comply with AMP rules, there is a very strict ordering of your HTML.

2. AMP JavaScript (JS)

Everything that comes from external resources as a copy and paste JavaScript code is blocked by AMP pages. These are typically in the form of social buttons, analytics, marketing tools, etc. AMP provides a JavaScript library that’s approved for use and all other JS must fit into an amp-iframe.

3. AMP Cache

Google has built its own content delivery network so their servers take control of page requests from Google servers all around the world. This means a page request on a mobile device in the Philippines doesn’t need to be sent back from Ashburn, VA each time it’s requested. With AMP pages, you’ll notice the content lives on Google.com as Google is storing pre-rendered pages and updating that content each time the AMP page is updated on your site.

How is HubSpot integrating AMP in its product offering?

HubSpot’s blog and site pages have a ton of SEO rich features built-in to the platform. It goes without saying that AMP has been a priority feature for the HubSpot product team to focus on building in natively.

Similar to the Google AMP Wordpress Plug-In, HubSpot is making Google AMP easy to use for any blog author. By simply checking a new box in the blog article settings, you can enable a Google AMP version of the article to be created in addition to your normal post.

For now, this will only be available for the blog module and it is expected to go live in HubSpot portals during the first quarter of 2017.

For the more savvy webmasters, there will be options to define a few key elements (colors, logo, etc.) that show up in AMP blog pages. Everything else is handled automatically! As of the posting of this article, HubSpot does not have documentation ready for AMP quite yet but we will update the post once that comes available.

SEO Advantages of AMP

First off, Google has said that AMP pages in mobile search engine results pages do not receive any additional ranking boost. With that said, page speed is a ranking factor and will only become more so in the coming months, according to Google. In fact, 53% of users will abandon a site or web page if it doesn’t load within 3 seconds.

When Google does launch the updated mobile algorithm with an additional ranking factor on mobile page speed, AMP pages are likely to get a big boost. But even before that happens, think about the user.

On September 20, 2016, Google announced the global rollout of AMP pages in the search results beyond the top carousel. As searchers begin to become aware of AMP, the sites taking advantage of the technology will likely see higher clickthrough rates on their AMP pages.

It’s important to note that sites that are not converted to AMP will not be penalized or hurt in any way. For pages with AMP enabled pages, Google will replace the mobile-friendly (or responsive) page with the AMP version in the search results. This means your website will still have the same position in mobile search results as the mobile version of the page, for now. We at Adhere are watching closely for the next mobile algorithm update to see if AMP will make an impact.

Is AMP only for blog articles and news?

Though this is a large current focus for AMP pages, articles are not the only pages that can benefit from AMP versions of webpages. How else can you utilize AMP on your website?

1. Landing Pages
   According to the most recent data, “40% of people will abandon a web page if it takes more than three seconds to load.” This means that if you’re running an ad campaign to a landing page, 40% will likely not bother and click away. That’s a lot of wasted ad spend. So Google launched AMP Ad Landing Pages (ALP).  
   
   AMP’s Get Started tutorial helps web developers build these ultra fast pages. AMP components like carousel, video, light box etc. should let designers maintain a light, yet well designed UX. Some components typically found on landing pages by HubSpot best practice customers are not yet supported by AMP but using the AMP iframe, a good designer/developer should be able to get around that.
2. Ecommerce
   ebay has taken on a big transformation using AMP. If you run an Ecommerce website, start with the home page or product category page, then go into the individual product pages. Here’s a good example on a product listing page using AMP.

 More content types are sure to be supported by AMP soon. You can keep up to date by following www.ampproject.org.

Tracking AMP Analytics

Google includes information about AMP in their search analytics on Google Search Console. You can analyze the specific keywords, positioning, clicks, and more just for AMP alone. When logged in to Search Console, expand Search Appearance and click on Accelerated Mobile Pages. Here you can review any errors related to your AMP pages.

Next, expand Search Traffic on the left navigation and open Search Analytics. Within the “Search Appearance” option, you can select AMP assuming you have AMP pages built already. This will allow you to analyze by page, query, clicks, etc. and retroactively optimize your AMP pages to perform better in search results.

In addition, amp-analytics allows support for Google Analytics integration and if you’d like to integrate your third-party analytics tracking tools, you may do so by embedding in the amp-iframe module. AMP has a host of other supported analytics platforms listed on their website.

Getting Started With AMP

There are a number of CMS platforms including Wordpress with AMP plug-ins easily allowing webmasters to convert their webpages into AMP friendly-formats. Test it out on a few pages first so the errors are minimal and cleaned up as you roll out AMP to a larger portion of your website.

As you roll-out AMP to your site, there is a great article that details ten AMP optimizations that even if you aren’t rolling out AMP, can help page speed tremendously.

Validating AMP

Chrome has an extension that will show you first if the page is a valid AMP page and second any problems with that page. A lightning bolt in your desktop extension will show green for a page that is AMP and blue for a page that has an AMP version available. Clicking on the blue bolt will take you to the AMP version.

For marketers, this becomes a great tool to add to your competitor research. If you’re looking into what types of content your competition has been working hard to enable AMP, this will give you that insight.

What are some of the downsides to using AMP?

1. Forms - AMP can get weird with forms. If you wish to use HubSpot forms, you’ll have to play nice with the limitations of amp-iframe and lightbox features of an AMP page. There have also been a few workarounds using amp-forms if you’re okay with not using HubSpot forms on your AMP pages.
2. Non-article pages – AMP is not yet fully built out for optimizing brand sites. Get started with optimizing your blog and news articles and soon AMP will likely roll out optimization for other forms of content your website includes.
3. Design suffers – How important is your design vs the content itself? Without external Javascript nor external stylesheets, the design and UX of pages using AMP leaves most of your custom design off the page.
4. Development costs – Google will not accept an AMP page unless it is completely free of errors. This is great for the end user, however brands need to consider developer time and costs to correct every page one by one.

The Takeaway

If your brand sees increasing mobile site traffic, and what website doesn’t, getting ahead of the crowd on mobile optimized content should be a required part to your SEO, retargeting, and user experience strategies.

"Every brand treating their website as a top marketing asset must take page speed optimization seriously and to be competitive, it has to be done sooner than later."

All of the optimizations a webmaster makes for AMP can also be made to regular site pages to increase page load time. AMP is really just a system that enforces page speed optimizations that can be achieved without using AMP.