Successfully reported this slideshow.

Mobile Landing Pages Talk

1,690 views

Published on

How to design mobile landing pages for maximum conversions

Published in: Technology, Business
  • Be the first to comment

Mobile Landing Pages Talk

  1. 1. AdWords API Workshops – All rights reserved
  2. 2. Mobile Landing Pages How to improve conversion +Paul Matthews, Google, Inc. AdWords API Workshops – All rights reserved
  3. 3. Agenda ● Mobile in AdWords API ● 8 Essentials ● Mobile Development Tooling AdWords API Workshops – All rights reserved
  4. 4. Mobile in AdWords API How to make Ads display on mobile AdWords API Workshops – All rights reserved
  5. 5. Mobile bid adjustment ● CampaignCriterionService ● AdGroupBidModifierService ○ Criterion > Platform ○ bidModifier AdWords API Workshops – All rights reserved
  6. 6. Mobile Preferred ● Ad.devicePreference = 30001 AdWords API Workshops – All rights reserved
  7. 7. Mobile Ads ● AdGroupAdService ○ MobileAd ○ MobileImageAd AdWords API Workshops – All rights reserved
  8. 8. Mobile Ads ● TemplateAd ○ App promotion ad ○ TemplateId: 353 AdWords API Workshops – All rights reserved
  9. 9. 8 Essentials Of mobile landing pages AdWords API Workshops – All rights reserved
  10. 10. 1. Deliver Faster ● Optimize server-side ○ Reduce Processing Time ○ Minimize Redirects AdWords API Workshops – All rights reserved
  11. 11. 1. Deliver Faster ● Files ○ Concatenate Assets ○ Minify CSS & JavaScript ● Caching ○ Re-use Assets AdWords API Workshops – All rights reserved
  12. 12. Performance as Feature ● Enhance with client-side optimizations ● Avoid process heavy pages ○ Use DevTools to detect ○ Avoid repaints ○ JavaScript events & animations AdWords API Workshops – All rights reserved
  13. 13. Performance as Feature ● Use the cache ○ Far-future cache ○ Change URL to break cache ● CSS ○ Beware of generators AdWords API Workshops – All rights reserved
  14. 14. Full Content on All Devices ● No second-class citizens ● Consistency is King! ● JavaScript to enhance AdWords API Workshops – All rights reserved
  15. 15. Adapt to the Screen ● Responsive / adaptive design ● Mobile First ○ @media & Breakpoints AdWords API Workshops – All rights reserved
  16. 16. Focus on the User ● Viewport ● Avoid text entry ● Horizontal Scrolling AdWords API Workshops – All rights reserved
  17. 17. Focus on the User ● Pinch-Zoom & Touch ● Large target navigation ● Readable without Background AdWords API Workshops – All rights reserved
  18. 18. Make it accessible ● Text within images ● Covered by fingers AdWords API Workshops – All rights reserved
  19. 19. Code for Robustness ● Too many browsers to test ○ Detect features - not browsers ● Vendor prefixes ● Catch Exceptions ● Avoid Bottlenecks AdWords API Workshops – All rights reserved
  20. 20. Prioritize Visible Content ● “Above-the-fold” ● Blocking CSS & JS ● Ideally less than ~14KB ● Web fonts AdWords API Workshops – All rights reserved
  21. 21. Mobile Development Tools AdWords API Workshops – All rights reserved
  22. 22. HTML5 Rocks ● www.html5rocks.com/mobile/ ○ How does your site behave? ○ Great mobile experience ○ Making your site FAST AdWords API Workshops – All rights reserved
  23. 23. Remote Debugging ● goo.gl/ruR5LU ○ Develop on mobile AdWords API Workshops – All rights reserved
  24. 24. Mobile Emulation ● goo.gl/k5cYA ○ Develop for mobile ○ No device needed AdWords API Workshops – All rights reserved
  25. 25. PageSpeed Insights ● goo.gl/JjzS2t ○ Scores your page ○ Graded suggestions ■ High ■ Medium ■ Low AdWords API Workshops – All rights reserved
  26. 26. Summary AdWords API Workshops – All rights reserved
  27. 27. Mobile in AdWords API ● Mobile Bidding ● Mobile Preferred ● Mobile Ads AdWords API Workshops – All rights reserved
  28. 28. 8 Essentials (1) ● Deliver Faster ● Performance as Feature ● Full Content on All Devices ● Adapt to the Screen AdWords API Workshops – All rights reserved
  29. 29. 8 Essentials (2) ● Focus on the User ● Make it accessible ● Code for Robustness ● Prioritize Visible Content AdWords API Workshops – All rights reserved
  30. 30. Tooling ● HTML5 Rocks ● Remote Debugging ● Mobile Emulation AdWords API Workshops – All rights reserved
  31. 31. Resources Links HTML5 Rocks - http://www.html5rocks.com/mobile Remote Debugging - http://goo.gl/ruR5LU Mobile Emulation - http://goo.gl/k5cYA AdWords API Workshops – All rights reserved
  32. 32. Questions? AdWords API Workshops – All rights reserved
  33. 33. AdWords API Workshops – All rights reserved

×