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.

Understand and overcome mobile web performance challenges


Published on

I presented together with Adrian Mendoza, Co-founder of Marlin Mobile to provide guidance on how to improve the performance of your mobile site.

People who watched the presentation:
* Learned about the performance pitfalls of mobile sites
* Found out how to gain insight into desktop and mobile site performance, including how to get details on particular devices, carriers and locations.
* Gained useful tips to improve page load times and multi-device user experiences.
* Plus, learned the value of performance measurement tools like Marlin Mobile, a solution built specifically for mobile sites, and Yottaa, a cloud platform that drives user engagement to increase conversions and revenue. By measuring performance on real devices in the wild, users get the details they need to diagnose a slow mobile site and to fix it.

  • Be the first to comment

  • Be the first to like this

Understand and overcome mobile web performance challenges

  1. 1. | Understand and Overcome! Mobile Web Performance
  2. 2. #mobileweb @yottaa @marlinmobile | 2 Your Presenters Ari Weil VP of Products, Yottaa @aweil Adrian Mendoza Co-founder, Marlin Mobile @marlinUX
  3. 3. Agenda #mobileweb @yottaa @marlinmobile | 3 Mobile: much ado about...what exactly? Smaller is only the beginning Optimization best practices Overcome and win Q&A
  4. 4. 20% of electronics purchases using mobile 35% of mobile visitors prefer www to 80% of mobile revenue from full site browsing #mobileweb @yottaa @marlinmobile | 4 Why is everyone so focused on mobile?
  5. 5. Mobile traffic - it’s just the tip of the iceberg #mobileweb @yottaa @marlinmobile | 5 0.7 Billion
  6. 6. #mobileweb @yottaa @marlinmobile | 6 Plus, it’s a part of virtually every transaction
  7. 7. #mobileweb @yottaa @marlinmobile | 7 So you see, this “small” problem can be BIG 51% say websites hard to navigate & use 46% say product images are too small 41% are concerned about security 26% feel that checkout is frustrating
  8. 8. #mobileweb @yottaa @marlinmobile | 8 And when you get it wrong, you lose…BIG 64% OF SMARTPHONE USERS EXPECT PAGES TO LOAD IN UNDER 4s $1Bn APPAREL & ACCESSORIES PURCHASES in Q113 71% Of all retail transactions SMARTPHONE USERS SHOP VIA MOBILE 48% Expect mobile to be faster than desktop 85% Will go to a competitor to transact 42% Will never return to your site 29%
  9. 9. #mobileweb @yottaa @marlinmobile | 9 Don’t be that business that if they arrive on a business site that isn't working well on mobile, they take it as an indication of the 48% of users say business simply does not care.
  10. 10. | Smaller is only the beginning.
  11. 11. #mobileweb @yottaa @marlinmobile | 11 Know the mobile ecosystem This is your mobile experience now… …its complicated
  12. 12. #mobileweb @yottaa @marlinmobile | 12 And what goes into loading a web page Images Javascript Via HTTPArchive, May ‘13-’14
  13. 13. Now consider the average eCommerce page #mobileweb @yottaa @marlinmobile | 13 Trust Icons High-Res Images Long-scrolling pages Social Media Dynamic Content In Addition: • A/B Tests • Analytic tracking • Beacons • Chat • Personalization • Pixels • RWD w/out RESS Visitors expect fast, flawless experiences on any device Marketing needs social media and other tags to engage visitors IT needs control to ensure speed, scalability and security
  14. 14. Cannot impact 3rd party dynamic content like social media or ads CONTENT DELIVERY NETWORKS #mobileweb @yottaa @marlinmobile | 14 Reality: ever-growing content and complexity PAGELOADTIME ITEFFORT&TIME SITE LAUNCH ONGOING MAINTENANCE AND USER ENGAGEMENT EFFORTS UPDATE CONTENT & IMAGES ADD SOCIAL MEDIA WIDGETS ADD REAL TIME PERSONALIZATION A/B TEST PAGE CONTENT Hiding components cannot keep pace with ongoing User & Marketing needs Cannot control page load behavior, content priority FRONTEND OPTIMIZATION Manual effort for every content change DO IT YOURSELF
  15. 15. | Optimization best practices.
  16. 16. Implement Responsive Web Design #mobileweb @yottaa @marlinmobile | 16 Advantages Disadvantages Most consistent user experience possible Requires additional code re-working No duplicate content maintains rankings Difficult to differentiate mobile content Max link value. No risk of split link value Could affect usability/CRO No redirects = low latency & fewer errors New code may affect rankings
  17. 17. Responsive Web Design Dirty Little Secret #mobileweb @yottaa @marlinmobile | 17 ALL websites are exactly the same in page size and requests!
  18. 18. Little r – presentation mostly – Fluid, flexible layout – Media queries – Responsive images Big R – Dynamic serving BOTH are better than #mobileweb @yottaa @marlinmobile | 18 The difference between little r and big R
  19. 19. #mobileweb @yottaa @marlinmobile | 19 Fact: Reducing Page Weight/Requests Works increased performance by 68% by reducing HTTP requests small page-1.5s big page – 4.7s
  20. 20. Desktop: 78 requests, 5.1sec load time Mobile: 38 requests, 20.8sec load time #mobileweb @yottaa @marlinmobile | 20 Reduce requests Still loading… So what went wrong?
  21. 21. #mobileweb @yottaa @marlinmobile | 21 Fact: Mobile behaves differently Example: parallelizing requests HURTS mobile experience
  22. 22. #mobileweb @yottaa @marlinmobile | 22 Myth #1: A CDN solves everything Example: Cloud storage being used for image assets
  23. 23. #mobileweb @yottaa @marlinmobile | 23 Myth #2: Design for First Paint is enough Time to First Paint: 5 seconds Your users radio stays on for an additional 12 seconds burning their battery.
  24. 24. #mobileweb @yottaa @marlinmobile | 24 Myth #3: Delay-loading 3rd party assets wins Example: analytics tag keeps the page from completely loading Time to First Paint: 5 seconds
  25. 25. | Overcome and win.
  26. 26. #mobileweb @yottaa @marlinmobile | 26 Optimizations that work (but…TNSTAAFL) Treats Middle mile geographic latency Good for Individual assets, streaming media Challenges Visitor context Related assets Versioning CDN Treats Content weight, round trips Good for Efficient asset delivery, rendering Challenges Visitor context Device capabilities Ongoing care & feeding FEO
  27. 27. #mobileweb @yottaa @marlinmobile | 27 Yottaa: holistic site optimization service See business results before you buy 40% FASTER InstantON AppSequencing MORE CONTROL ContextIntelligence DEEP INSIGHT
  28. 28. #mobileweb @yottaa @marlinmobile | 28 Marlin Mobile: Monitor your mobile web Get insights from REAL mobile devices See your REAL customer view on mobile Sign up for a free account – Get insight and data on your ENTIRE mobile ecosystem.
  29. 29. THANK YOU #mobileweb @yottaa @marlinmobile | 29