Building Canonical AMP Sites for E-commerce at AMP Conf 2018
Articles,  Blog

Building Canonical AMP Sites for E-commerce at AMP Conf 2018


[MUSIC PLAYING] BEN MORSS: I’m here
with Lisa Wang, live at AMP Conf,
product manager for AMP. And you’ve been talking
about e-commerce at AMP and how AMP can be used
for e-commerce application everywhere, on
mobile and desktop. LISA WANG: Yeah, definitely. So I think that with
the launch of amp-bind, we really now believe
that AMP is ready for all of the verticals in e-commerce. And in the last year, that’s
what we’ve really seen is that many different
companies across verticals, across the world, have
adopted AMP and really seen huge success with it, right? Because the
fundamental theory is that if you put your content
in front of your users more quickly, they’re more
likely to engage with you and hopefully buy
something from you. And I think we have
stats to prove that. So 53% of users
will leave a site after three seconds of loading. And e-commerce, 79% of
users won’t come back to a site that was
poorly performing. So if they had trouble
browsing through things, if they had trouble
buying something, they might buy that one time,
but then they won’t come back. BEN MORSS: Another
point is we should maybe use AMP at a certain
point on your site and not use AMP somewhere
else on your site? LISA WANG: We
believe that you can use AMP for the full conversion
funnel for your full site, and we’ve really seen that. So AliExpress is one of the
biggest e-commerce sites in the world, and they’ve
gone all-in on AMP. So they’re building all
of their site in AMP, and they’ve seen more than 40%
decrease in page load times, and they’ve seen over 4%
increase in conversions. And so that amount
of speed that you’re going to get on every
step of the flow is huge. [MUSIC PLAYING] BEN MORSS: So I’m told I can
now build my site with AMP for desktop and for mobile? ABBY BECK: Yes. And we actually
have on ampstart.com a whole component system
where you could just take pieces that are interactive. So you could use
the Sidebar Menu component for that
full functionality on both mobile and desktop. And then we also
have full templates for e-commerce, blogs. We have a restaurant
template and even a gallery template with really
cool interactive experiences. BEN MORSS: And you were saying
there is now a date picker module of some sort. ABBY BECK: Yeah. So the date picker
is really awesome, because formerly you had to
essentially use different form elements and combinations. But this has, just like
any other date picker you would see on like a
booking site for travel say, it has even visual design
baked into the default so that you don’t have to
custom style if you don’t want to but you totally can. BEN MORSS: And you were saying
there’s a lightbox gallery now. What is that? ABBY BECK: Yeah. That’s a really cool feature
that we’ve just launched, where it enables any
image on the page to show up in this lightbox
fully immersive experience, again, both on desktop and
mobile and any other device size. And then users can actually
page through those images as you would a gallery. BEN MORSS: OK. Thanks a lot, Abby. ABBY BECK: Thank you, Ben. [MUSIC PLAYING] MADISON MINER:
Thanks to components like amp-bind and
amp-list, our AMP pages have feature parity with
their canonical counterparts. They look and feel and
function exactly the same, except for they’re
just much, much faster. BEN MORSS: So AMP has been
really useful for you guys, it sounds like. MADISON MINER: Yeah. We consistently see improved
click-through rate from Search. We consistently see
improved performance, which yields lower bounce
rates and higher engagements and higher conversion rates
throughout the purchasing funnel. And we’re now finally
seeing mobile sites that rival the desktop site
in terms of conversion rates. Our progressive web AMP
sites are incredibly fast. They use features like
Payment Request and Add to Home Screen
for re-engagement, Offline Access through
Service Worker. These websites are finally
converting at a higher rate. BEN MORSS: They’re
easier to use. They’re faster to use. MADISON MINER: Yeah. BEN MORSS: People stay
on those for longer. MADISON MINER: Absolutely. [MUSIC PLAYING] JESS ANASTASIO: And
we knew we wanted to offer AMP to our users. So we figured why
not just go all in, and it kind of eliminated
framework choice overload for us. We knew we wanted AMP. So we just went
full steam ahead. Being within AMP really helped
us stay on the right track. You know what I mean? We had this ecosystem
and these requirements we knew we had to
follow to be AMP valid. So this was a really
great track for us to be on to make sure, no
matter what new thing we added, we weren’t going to be
adding a ton of CSS that’s going to make the size of
the page go super huge. BEN MORSS: So the
restrictions of AMP really kept you guys honest. It made you keep things simple
and prevented feature creep. JESS ANASTASIO: Exactly. Yeah. And it was actually cool to
contribute to the AMP Open Source, like in the
case that we didn’t have support for something. I had to add in
print functionality. Something super
simple like that, I was able to actually contribute
that, get that merged in, and get it into production. So that was pretty cool too. [MUSIC PLAYING] BEN MORSS: So try it out
is what we’re saying. LISA WANG: Yeah. We’re saying try it out. If you have any
feedback, if there are features that you
want that we don’t have, if there are bugs that you
see, let us know on GitHub. We’re more than happy
to work with you. E-commerce is still, I think,
in the early stages for AMP. And so as an e-commerce
company, if you start working with
AMP now, you really have this opportunity to
shape the direction of what we’re building and shape what
comes next on our roadmap. And so we really
encourage all the sites to take advantage of that. BEN MORSS: That sounds great. Well, thanks a lot, Lisa,
for being here with us. LISA WANG: Of course. Thank you so much. [MUSIC PLAYING]

2 Comments

  • snakesnarroz

    So I have an old site done in oscommerce. How do i begin converting this mess of code and products and database to an amp friendly site? What happens to the mysql db?

Leave a Reply

Your email address will not be published. Required fields are marked *