AMP for eCommerce

In October 2015, Google announced a little thing called AMP. Initially, AMP started with a focus on news pages, but that focus rapidly changed towards every page of your website. That doesn’t just go for news websites. It seems like AMP is here to stay and every website can use it to optimize their mobile SEO. That also goes for eCommerce sites. This article discusses AMP for eCommerce sites.

AMP and site speed

Obviously, one of the key pillars of AMP is to provide fast websites for use on mobile devices. We can only applaud that speed optimization, as speed is an important SEO factor as well. The stripped AMP pages offer better speed and better speed makes for a better user experience.

In his AMP article on SEJ,  Marc Purtell states that 40% of visitors leave a website if it doesn’t load within three seconds. Especially for image-heavy sites like eCommerce sites, that offers a challenge. Adding AMP for eCommerce sites adds an extra challenge but that challenge is probably not speed related. By stripping down your design, you are already making it faster.

Not yet a ranking factor

AMP might still not be confirmed as a ranking factor:

At least, that is what Google’s John Mueller says at 15:50 in this Google Hangout: “At the moment, it’s not a ranking signal“. Speed and mobile compatibility are surely taken into account, and I really can’t imagine AMP not to follow, especially for mobile searches. These are all things that provide a better user experience. Optimize every aspect of your website, right?

AMP for eCommerce

There is little known about AMP for eCommerce when you check the internet. There are a lot of articles written about it, but none of those is really specific about what you should do. The bottom line of every article is speed matters. We already know that. We have already mentioned that earlier in this article. Nothing new here. Second outtake: higher speed is better conversion. That’s not related to AMP, that’s related to websites. I haven’t found a case study yet (let me know if you did), but we know sites like eBay use AMP, and Shopify is working on making AMP for eCommerce available.

What should we do?

My two cents? If you are adding AMP pages to your eCommerce site, be sure to limit the use of JavaScript. Forget about the fancy newsletter subscription box that floats into a browser screen and skip the JS zoom option. People will probably pinch and squeeze for zooming anyway. Try to reduce JavaScript without compromising your security, obviously. But you will be able to add a testimonial directly on your site instead of loading it from third party sources. And yes, getting rid of excessive baggage is actually also something you should do for your desktop site.

Furthermore, try your best to reduce clutter. Put some effort into creating a great call-to-action. Think about your navigational options, how to properly use search. That also contributes to better user experience and I think it matters even more on your mobile AMP website. And keep validating your AMP site.

All in all, there really isn’t that much difference from optimizing your desktop site!

AMP or responsive?

Can we just skip that responsive website altogether now that we have AMP for our eCommerce site? No, we can’t. AMP is for mobile devices, but using WIFI on my tablet, I really don’t mind a few more fancy options on your online shop. Using a responsive website makes sure you provide the best experience per device.

What does Google say?

If you want Google’s take on this check out the Google ‘guideline’ for AMP for eCommerce sites. In short, it focuses on using the right amp-tags and design. Be sure to go over that article. It might give you some more insights on what Google’s looking for. In the article above, Google highlights some AMP-tags you could use to optimize your shop.

<amp-carousel>

We have made a clear case against carousels. On a mobile phone, you’d better have a clear indication that there’s ‘more to swipe’. Otherwise, I’d replace that carousel with a static image. With Google even doing Twitter carousels in mobile search result pages, I do think this is something we need to test continually.

It does seem to make sense to use amp-carousel to add more than one product image to your product page. Again, please make it clear that visitors can swipe these images. By the way, why not use this to display some testimonials or product reviews? (Nice suggestion, Jip)

<amp-accordion>

You could use amp-accordion for sections with ‘more detailed requirements or extended descriptions’, much like the tabs you probably use on your product page.

<amp-sidebar>

To make more areas of your website accessible via your product page, for instance, you could use the amp-sidebar element. I think that makes even more sense when using AMP for eCommerce sites than regular sites. On regular sites, you might be able to squeeze in an extra set of links after a section, where this will look silly in the middle of your product description.

<amp-list>

The Google article suggests using AMP for related products as well. Generate that list of related products on the fly: “To do so, just use <amp-list> to fire a CORS request to a JSON endpoint which supplies the list of related products. These are populated into an amp-mustache template on the client.”

At this point, I see how the AMP tags mentioned above can be used for eCommerce, but let’s be honest: there is nothing shop-specific about these tags. What we are doing here, is optimize a page with the AMP tools that we have.

The state of AMP

What we really need to make our shop suitable for AMP, are things like AMP forms for our checkout process. The tools are defined, but I’d still like to see a good, real life showcase for these. At the moment, the fact is that AMP still doesn’t support these forms to a proper extent.

AMP seems to be here to stay and we as SEOs and web developers need to watch the development closely. Things might go fast as Google seems determined to make AMP work. We will do our best to keep you in the loop about new developments!

AMP for eCommerce?

Just make sure to put in your best effort, really. Optimize as always. Please remember that you don’t have to transform your entire website to AMP at once. Start with the pages that make the most sense. I’d say your homepage, product listings (category pages), product pages and checkout. That’s just four templates!

Read more: Setting up WordPress for AMP »