Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Max Prin - Engage 2018 - AMP for E-Commerce

497 views

Published on

Max Prin - Engage 2018 - AMP for E-Commerce

Published in: Marketing
  • Be the first to comment

Max Prin - Engage 2018 - AMP for E-Commerce

  1. 1. Max Prin, Head of Technical SEO, Merkle @maxxeight Accelerated Mobile Pages & E-Commerce
  2. 2. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX2
  3. 3. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX over 60% of the clicks to AMP in Google search go to non-news sites
  4. 4. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX over 30% of the traffic to online stores is from organic search
  5. 5. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX5 Source: Soasta
  6. 6. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX6 Source: Soasta
  7. 7. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX7 Source: Soasta
  8. 8. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX8 Images: 41%
  9. 9. The Total Economic Impact™ of AMP across publishers and e-commerce 20% Conversion 10% Traffic 60% Pages/visit
  10. 10. AMP for E-commerce
  11. 11. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX11
  12. 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. 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. 14. AgendaCheckout Payment Requests API - Chrome only <amp-form> - Checkout within AMP <amp-install-serviceworker> - Fast transition to HTML
  15. 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. 16. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX
  17. 17. Progressive Web AMPs
  18. 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. 19. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX19 AMP as entry point into your PWA <amp-install-serviceworker>
  20. 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. 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. 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. 23. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX23 PWA + AMP = PWAMP The AMP framework is not compatible with JavaScript frameworks (e.g. pushState)
  24. 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. 25. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX25
  26. 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. 27. Tools & Resources
  28. 28. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX28
  29. 29. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX29
  30. 30. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX30
  31. 31. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX31
  32. 32. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX32
  33. 33. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX33
  34. 34. Max Prin @maxxeight | Engage Conference 2018 #EngagePDX34
  35. 35. Thank you!

×