This week marked the first day of the first AMP Conf, a two day conference on the AMP platform. AMP is Google’s answer to Facebook Instant Articles and Apple News. I was fortunate enough to be able to attend both days, and I had a vested interest as I’m a contributor, and I put together the AMP Implementation for the Huffington Post.
There was a lot to take in over the course of the conference, but my biggest takeaways would have to be:
- AMP isn’t just for news sites, as there’s a big push towards e-commerce
- Even though custom JS is prohibited, you can still do some really interesting, interactive things with AMP
- Google wants to spread the responsibility but probably not that much
E-Commerce
My biggest WTF of the conference came not just from the unorthodox AMP projects I saw on display, but on what people outside of my industry (publishing and media) were doing with AMP. Particularly, E-commerce.
When first starting AMP, it never occurred to me what I would use this technology for if I was working on E-commerce. Several companies, like eBay, EventBrite, Wego and even Pinterest are using AMP for more than just lead generation for their platforms, but treating AMP as extensions of their brand and platforms.
Starting from landing pages, many of these companies followed the example of getting eyeballs on their pages through AMP. Each company set up these entry pages as ways of funneling users through their existing checkout or conversion process, while in many ways leveraging AMP to make it faster.
eBay
This group had an interesting approach to AMP, in that they wanted to treat the stack as a series of “best practices” in creating pages, rather than a separate stack. This lead to them integrating AMP into their regular dev cycle and team, rather than setting up a separate AMP team.
By treating AMP as HTML, they were able to selectively swap out AMP and HTML on a component level when rendering, similar to an approach we took at Huff Post.
On the other hand, Analytics proved to be the bigger challenge, as they started early on, before the amp-analytics tag was fully fleshed out. By figuring out away to compare session info with cookies, they were able to get a better understanding of their visitors, although they had to deal with some false positives.
Though not exactly an e-commerce platform, I’m kind of grouping them in this category, since their process is more akin to a shopping experience rather than news and media consumption. At the end of the day, they’re focused on having people engage in a platform that “collects” things.
As in other examples, their goal was to speed up the time from searching for a “thing” and getting people to engage with their core products. To that end, they focused on making a great impression on New users over returning users. This makes some sense, in that if you’re already signed up, you might not need to worry about waiting a few extra seconds for the service to load up.
By serving AMP pages to non-authenticated users, they were able to entice new users and funnel them along their path towards using the site, and eventually registering. These AMP pages were designed with larger images but of one single item, as opposed to groups to keep users focused.
Like eBay and others in this group, Analytics proved to be the biggest issue, requiring that they leverage their existing server side metrics with AMP’s analytics package. A/B Testing offered similar challenges but the opposite solution, as they had to move this code from the server side to client side. By linking AMP Client IDs with session cookies, they were able to make analytics work for them.
Wego
This was by far one of the more interesting talks, in that their focus was targeted on such a wide range of platforms. Working in Middle Eastern, Indian and South East Asian markets, their customer base spanned 52 countries, 38 languages, and both high end and low end devices and connection speeds.
If anyone needed something like AMP, it would be them. As a travel vendor, their customers are frequently looking for the fastest and cheapest air fare in the Asian market, and 70% of them are on their mobiles.
By converting their existing landing pages to AMP, they got more eyeballs on their travel rates, and then could funnel this traffic to air fare partners and checkout. By using a Progressive Web AMP (PWA) as part of the checkout process, they were able to decrease load times to about a second an a half from 9 for new users.
In terms of challenges, they were unable to use Autocomplete for airport lookups or that AMP didn’t have a calendar plugin that wold work for them, as most of their customer base did not use a Gregorian Calendar. Something that I hadn’t considered or even knew if AMP supported that natively.
Event Brite
In the same vein as Pinterest, Event Brite isn’t exactly a traditional e-commerce company, but they’re more like an eBay than Pinterest.
Like the others, they decided to only AMPlify some of their content, particularly landing pages. In this case, events set up by organizers so that people can buy tickets faster. In their case, they limited their roll out to around 50% of their audience at the time of the conference, and still haven’t figured out every one of their challenges, such as bookmarking ticket pages, since all AMP is cached by Google and has their own url.
Using Python and SCSS, they were able to selectively limit what exactly gets rendered onto AMP, keeping within the guidelines for CSS size and conforming to AMP standards. They also did some interesting things using SCSS for loops to generate their grid, which was amazing.
In cases where AMP didn’t do what they wanted, they worked within the AMP community to suggest and implement new features, such as allowing for scrollable lightboxes!
They were even able to implement ReCaptcha using an amp-iframe!
More to come
Though this conference was only two days, there was a week’s worth of information to process. To that end, I’ll be splitting this post up over a few posts to keep things easy to digest.
TLDR
E-Commerce companies can use AMP to speed up search to landing pages to improve user experience and conversions. While each solution is unique, you can use AMP for rendering landing pages “right out of the box” but analytics is still a work in progress and requires some hacking.