Max Prin - Engage 2018 - AMP for E-Commerce

1. Max Prin, Head of Technical SEO, Merkle
@maxxeight
Accelerated Mobile Pages & E-Commerce

2. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX2

3. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX
over 60%
of the clicks to AMP in Google search go to non-news sites

4. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX
over 30%
of the traffic to online stores is from organic search

5. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX5
Source: Soasta

6. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX6
Source: Soasta

7. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX7
Source: Soasta

8. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX8
Images:
41%

9. The Total Economic Impact™ of AMP
across publishers and e-commerce
20%
Conversion
10%
Traffic
60%
Pages/visit

10. AMP for E-commerce

11. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX11

12. AgendaCategory Page
<amp-sidebar>
- Navigation
<amp-carousel>
<amp-list>
- Product organization
<amp-form>
- Searching
<amp-bind>
- Filtering and sorting
<amp-access>
- Logged in/out

13. AgendaProduct Page
<amp-video>
<amp-accordion>
- Product images/details
<amp-form>
<amp-carousel>
- Comments/reviews
<amp-selector>
- Tabs/Thumbnails
<amp-bind>
- Color/size selection
<amp-state>
- Add to cart

14. AgendaCheckout
Payment Requests API
- Chrome only
<amp-form>
- Checkout within AMP
<amp-install-serviceworker>
- Fast transition to HTML

15. AgendaDevelopment
Tracking
<amp-analytics>
- Google Analytics, Adobe, etc.
<amp-experiments>
- A/B testing
Compatible to structured data (Schema.org)
Custom JavaScript (coming soon)

16. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX

17. Progressive Web AMPs

18. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX18
Progressive Web AMPs
- AMP pages with PWA features
- AMP as entry point into your PWA
- AMP as data source for your PWA

19. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX19
AMP as entry point into your PWA
<amp-install-serviceworker>

20. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX20
AMP as entry point into your PWA
1) User gets the AMP from the SERP
2) Service worker is installed on device
• Once activated, SW caches the
“app shell” and initial data
3) User clicks on a (internal) link
4) Pre-cached PWA loads instantly
“Start fast, stay fast” – Alex Rusell

21. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX21
AMP as entry point into your PWA
1) User gets the AMP from the SERP
2) Service worker is installed on device
• Once activated, SW caches the
“app shell” and initial data
3) User clicks on a (internal) link
4) SW hijacks the click
5) Pre-cached PWA loads instantly

22. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX22
The Service-Worker Hijacks The Click
if (request = navigate) {
if (requested page is cached) {serve cached
version}
else {fetch, serve and cache PWA version}
} else {
if (requested URL is cached) {serve cached
version}
else {fetch, serve and cache asset}
}

23. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX23
PWA + AMP = PWAMP
The AMP framework is
not compatible with
JavaScript frameworks
(e.g. pushState)

24. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX
What about “SEO”?
AMP is not a ranking factor
A “really fast” site doesn’t rank better than a “fast site”

25. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX25

26. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX
What about “SEO”?
AMP is not a ranking factor
A “really fast” site doesn’t rank better than a “fast site”
Faster is better (+ AMP cache/pre-loading)
AMP = mobile-friendly
SERP visibility

27. Tools & Resources

28. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX28

29. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX29

30. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX30

31. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX31

32. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX32

33. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX33

34. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX34

35. Thank you!