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.

SearchLove San Diego 2017 | Emily Grossman | The New Mobile

521 views

Published on

How has mobile marketing changed in the past year and how should your business react to best prepare for 2017 and beyond? Emily will discuss the what future holds for mobile optimization and how to rise above the rest of the pack in a mobile-first world.

Published in: Marketing
  • Yes, it's changing how we present content. However, using web apps, is a lot like taking social media offline. Push notifications doesn't ring" interactive or engaging" I hope SearchLove 2018 in San Diego has good coverage of engagement on mobile, something it seems to be struggling with: http://gordcollins.com/seo/searchlove-san-diego-distilled-seo-conferences-2018-california/
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Be the first to like this

SearchLove San Diego 2017 | Emily Grossman | The New Mobile

  1. 1. #SearchLove @goutaste The NEW Mobile: Proactive Strategies for the Next Wave
  2. 2. #SearchLove @goutaste If your plans don’t include mobile, your plans are not finished. Wendy Clark, Coca-Cola Meet your customers in the environment of their choice, not where it's convenient for you. Cyndie Shaffstall Mobile is becoming not only the new digital hub but also the bridge to the physical world. Thomas Husson, Forrester Mobile is the enabling centerpiece of digital convergence. Tomi T Ahonen More Google searches take place on mobile devices than on computers. Google If you’re not using mobile…don’t worry - your competitors are already using it and are getting those customers instead. Jamie Turner, 60SecondMarketer The adoption rate of mobile is twice that of the internet. Emma Crowe, Somo The smartphone is the key marketing battleground of 2016. Andrew Smith, Director at Escherman
  3. 3. #SearchLove @goutaste “The trend has been ‘mobile was winning.’ It's now won.” -- Eric Schmidt, Google
  4. 4. #SearchLove @goutaste Time Performance&Adoption New Innovation Scaling Mature Technology Frenzy Tech Improvements The Technology ‘S Curve’
  5. 5. #SearchLove @goutaste@benedictevans Mobile S-Curve Moving from Creation to Deployment
  6. 6. #SearchLove @goutaste@benedictevans WE ARE HERE Mobile S-Curve Moving from Creation to Deployment
  7. 7. #SearchLove @goutaste Developing PROactive VS. REactive Mobile Strategies
  8. 8. #SearchLove @goutaste Understanding The NEW (Pro-Active) Mobile Questions For… PLATFORM PERFORMANCE ANALYTICS
  9. 9. #SearchLove @goutaste Understanding The NEW (Pro-Active) Mobile Questions For… PLATFORM PERFORMANCE ANALYTICS FUTURENEWOLD
  10. 10. #SearchLove @goutaste MOBILE PLATFORM FUTURE: UI-Agnostic ContentNEW: Web of Apps & App-Like WebOLD: Web vs. Apps
  11. 11. #SearchLove @goutaste Old Model of Thinking: “Web VS. Apps” OLD: Web vs. Apps @paul_kinlan paul.kinlan.me/the-headless-web/ “Should I build an app or a website?”
  12. 12. #SearchLove @goutaste OLD: Web vs. Apps Engaging,ImmersiveExperiences Potential Reach APPS WEB Native Features Made Apps More Engaging Web Features Made Sites More Discoverable
  13. 13. #SearchLove @goutaste A Web of Apps – App Indexing NEW: Web of Apps & App-Like WebOLD: Web vs. Apps firebase.google.com/docs/app-indexing/ *App Icons Only on Android
  14. 14. #SearchLove @goutaste NEW: Web of Apps & App-Like WebOLD: Web vs. Apps http://www.cc.com/shows/the-daily- show-with-trevor-noah comedy-central://example-deep-link-to- daily-show Example deep links: A Web of Apps – Deep Linking
  15. 15. #SearchLove @goutaste NEW: Web of Apps & App-Like WebOLD: Web vs. Apps A Web of Apps – ‘Instant Apps’ developer.android.com/topic/instant-apps/index.html
  16. 16. #SearchLove @goutaste New: A Web of Apps & App-Like Websites NEW: Web of Apps & App-Like WebOLD: Web vs. Apps Engaging,ImmersiveExperiences Potential Reach APPS Deep Links WEB
  17. 17. #SearchLove @goutaste NEW: Web of Apps & App-Like WebOLD: Web vs. Apps Meanwhile… bit.ly/website-push-notifications
  18. 18. #SearchLove @goutaste NEW: Web of Apps & App-Like WebOLD: Web vs. Apps Meanwhile… bit.ly/website-push-notifications
  19. 19. #SearchLove @goutaste NEW: Web of Apps & App-Like WebOLD: Web vs. Apps Meanwhile… bit.ly/PWA-install
  20. 20. #SearchLove @goutaste NEW: Web of Apps & App-Like WebOLD: Web vs. Apps Meanwhile… bit.ly/PWA-install
  21. 21. #SearchLove @goutaste The App-Like Web: Progressive Web Apps NEW: Web of Apps & App-Like WebOLD: Web vs. Apps @suzzicks bit.ly/cindy-mozcon-2016
  22. 22. #SearchLove @goutaste
  23. 23. #SearchLove @goutaste The App-Like Web: What is a ‘PWA’? NEW: Web of Apps & App-Like WebOLD: Web vs. Apps @suzzicks HTTPS Mobile Friendly Website Service Worker Web App Manifest =+ Progressive Web App bit.ly/cindy-mozcon-2016
  24. 24. #SearchLove @goutaste “Service Workers can give users the best of both [app & web] worlds: A middle ground letting you choose how and when the site should be integrated deeper into the device.” NEW: Web of Apps & App-Like WebOLD: Web vs. Apps @paul_kinlan paul.kinlan.me/slice-the-web/
  25. 25. #SearchLove @goutaste The App-Like Web – Service Workers NEW: Web of Apps & App-Like WebOLD: Web vs. Apps Service Workers are so powerful, that browsers wont let you use it without encryption HTTPS REQUIRED
  26. 26. #SearchLove @goutaste New: A Web of Apps & App-Like Websites NEW: Web of Apps & App-Like WebOLD: Web vs. Apps @paul_kinlan paul.kinlan.me/the-headless-web/
  27. 27. #SearchLove @goutaste New: A Web of Apps & App-Like Websites NEW: Web of Apps & App-Like WebOLD: Web vs. Apps Engaging,ImmersiveExperiences Potential Reach APPS Deep Links WEB PWA
  28. 28. #SearchLove @goutaste “Prepare for a time when no one ever visits your website. Awareness, research, and conversion will all happen in the search results…” -- David Mihm FUTURE: UI-Agnostic ContentNEW: Web of Apps & App-Like WebOLD: Web vs. Apps bit.ly/david-mihm-2017
  29. 29. #SearchLove @goutaste FUTURE: UI-Agnostic ContentNEW: Web of Apps & App-Like WebOLD: Web vs. Apps Search is Already Becoming the UI
  30. 30. #SearchLove @goutaste FUTURE: UI-Agnostic ContentNEW: Web of Apps & App-Like WebOLD: Web vs. Apps This is NOT the Only Measure of Success
  31. 31. #SearchLove @goutaste FUTURE: UI-Agnostic ContentNEW: Web of Apps & App-Like WebOLD: Web vs. Apps Success Also Looks Like THIS
  32. 32. #SearchLove @goutaste Get Better at Being a Data Source: Structured Data (Schema) FUTURE: UI-Agnostic ContentNEW: Web of Apps & App-Like WebOLD: Web vs. Apps
  33. 33. #SearchLove @goutaste Get Better at Being a Data Source: Structured Data Formatting FUTURE: UI-Agnostic ContentNEW: Web of Apps & App-Like WebOLD: Web vs. Apps moz.com/blog/json-ld-for-beginners
  34. 34. #SearchLove @goutaste Structured Data Immediate SEO Benefits FUTURE: UI-Agnostic ContentNEW: Web of Apps & App-Like WebOLD: Web vs. Apps developers.google.com/search/docs/data-types/books
  35. 35. #SearchLove @goutaste Get Better at Being a Data Source: APIs FUTURE: UI-Agnostic ContentNEW: Web of Apps & App-Like WebOLD: Web vs. Apps
  36. 36. #SearchLove @goutaste FUTURE: UI-Agnostic ContentNEW: Web of Apps & App-Like WebOLD: Web vs. Apps What is Lyft?
  37. 37. #SearchLove @goutaste MOBILE PERFORMANCE FUTURE: Network OptimizationNEW: Progressive EnhancementOLD: Loading Optimization
  38. 38. #SearchLove @goutaste Performance Matters, Mobile Performance Matters More bit.ly/google-speed-stats
  39. 39. #SearchLove @goutaste ‘RAIL’ Performance Framework OLD: Loading Optimization developers.google.com/web/fundamentals/performance/rail
  40. 40. #SearchLove @goutaste Check Your Loading Optimization OLD: Loading Optimization developers.google.com/speed/pagespeed/insights/
  41. 41. #SearchLove @goutaste Check Your Loading Optimization OLD: Loading Optimization testmysite.thinkwithgoogle.com
  42. 42. #SearchLove @goutaste Check Your Loading Optimization OLD: Loading Optimization testmysite.thinkwithgoogle.com These are the basics we all still get wrong
  43. 43. #SearchLove @goutaste Loading Optimization OLD: Loading Optimization bit.ly/wordpress-performance-fail “Hi, I’m a Wordpress Theme with 23 JS libraries and 20 stylesheets!”
  44. 44. #SearchLove @goutaste Loading Optimization OLD: Loading Optimization “Hi, I’m a Wordpress Theme with 23 JS libraries and 20 stylesheets!” bit.ly/wordpress-performance-fail
  45. 45. #SearchLove @goutaste OLD: Loading Optimization bit.ly/mobile-speed2 from We Want Faster Sites, But We’re Also Shipping More JS Than Ever @samccone bit.ly/rel-preload-demo
  46. 46. #SearchLove @goutaste Check Your Loading Optimization OLD: Loading Optimization testmysite.thinkwithgoogle.com
  47. 47. #SearchLove @goutaste Tools That Help With Critical Path Rendering OLD: Loading Optimization webpagetest.org WebPageTest
  48. 48. #SearchLove @goutaste OLD: Loading Optimization Tools That Help With Critical Path Rendering @ipullrank moz.com/blog/the-technical-seo-renaissance Chrome Dev Tools
  49. 49. #SearchLove @goutaste NEW: Progressive EnhancementOLD: Loading Optimization Progressive Enhancement
  50. 50. #SearchLove @goutaste Progressive Enhancement NEW: Progressive EnhancementOLD: Loading Optimization Not this ‘progressive’…
  51. 51. #SearchLove @goutaste NEW: Progressive EnhancementOLD: Loading Optimization An escalator can never break, it can only become stairs. There would never be an ‘escalator temporarily out of order’ sign, only an ‘escalator temporarily stairs. Sorry for the convenience.’-- Mitch Hedberg
  52. 52. #SearchLove @goutaste How Service Workers Can Help Optimize Repeat Visits NEW: Progressive EnhancementOLD: Loading Optimization medium.com/@addyosmani/progressive-web-apps-with-react-js-part-3-offline- support-and-network-resilience-c84db889162c#.jtl0ooqu2
  53. 53. #SearchLove @goutaste Service Workers Wont Help Everywhere… But Remember They’re Enhancements NEW: Progressive EnhancementOLD: Loading Optimization
  54. 54. #SearchLove @goutaste Service Workers Wont Help Everywhere… But Remember They’re Enhancements NEW: Progressive EnhancementOLD: Loading Optimization ‘Progressive Web App Temporarily Functional Website on Safari. Sorry for the convenience.’
  55. 55. #SearchLove @goutaste Browser Assists NEW: Progressive EnhancementOLD: Loading Optimization @ipullrank moz.com/blog/the-technical-seo-renaissance
  56. 56. #SearchLove @goutaste NEW: Progressive EnhancementOLD: Loading Optimization ipullrank.com/how-i-sped-up-my-site-68-percent-with-one-line-of-code/ Be 99% sure! Prerender will load ALL of the assets for the page. If you are wrong, this can waste battery and bandwidth from your mobile users. Good use cases (near certainty on click): • Next page in paginated article • “Logged in” page from Login Page Browser Assists <link rel="prerender" href="http://example.com/page"> <link rel=”prerender prefetch” href=”http://www.example.com/page”>
  57. 57. #SearchLove @goutaste@benedictevans FUTURE: Network OptimizationNEW: Progressive EnhancementOLD: Loading Optimization We’re Halfway to Connecting Everyone 5.5bn people over 14 years old, close to 5bn with mobile phones, ~2.5bn smartphones Future: Network Optimization & Offline Functionality
  58. 58. #SearchLove @goutaste The average mobile user is not on a $600+ phone & over half of active Android users have 1 GB or less in Ram FUTURE: Network OptimizationNEW: Progressive EnhancementOLD: Loading Optimization Future: Network Optimization & Offline Functionality WATCH: bit.ly/progressive-performance
  59. 59. #SearchLove @goutaste FUTURE: Network OptimizationNEW: Progressive EnhancementOLD: Loading Optimization Image: kinsta.com/learn/what-is-http2/#goal_of_creating_http2 WE ARE HERE YOUR AUDIENCE MAY BE HERE Understanding Network Connection Variability Treat the Network as an Enhancement
  60. 60. #SearchLove @goutaste Understand Network Connection Variability FUTURE: Network OptimizationNEW: Progressive EnhancementOLD: Loading Optimization Read: bit.ly/http2-intro Image: kinsta.com/learn/what-is-http2/#goal_of_creating_http2 HTTP/2 enables full request & response multiplexing HTTP/2 will be critical in connecting the next billion
  61. 61. #SearchLove @goutaste • Prefetch & Prerender speed up your next navigation • Preload speeds up the current one FUTURE: Network OptimizationNEW: Progressive EnhancementOLD: Loading Optimization • Pre-load can specify the download “as” = • "script", • "style", • "image", • "media", • "document” bit.ly/what-is-rel-preload Optimize Network Requests HTTP/2 + PreLoad = Moves the ‘start download’ time of a critical asset closer to initial request
  62. 62. #SearchLove @goutaste FUTURE: Network OptimizationNEW: Progressive EnhancementOLD: Loading Optimization bit.ly/rel-preload-demo@samccone
  63. 63. #SearchLove @goutaste FUTURE: Network OptimizationNEW: Progressive EnhancementOLD: Loading Optimization bit.ly/rel-preload-demo@samccone
  64. 64. #SearchLove @goutaste Understand Network Connection Variability Service Workers Help Optimize for Network Connectivity FUTURE: Network OptimizationNEW: Progressive EnhancementOLD: Loading Optimization @pierrefar deliberatedigital.com/mobile-seo
  65. 65. #SearchLove @goutaste Service Workers Can Even Give Websites Offline Functionality FUTURE: Network OptimizationNEW: Progressive EnhancementOLD: Loading Optimization
  66. 66. #SearchLove @goutaste Service Workers Can Even Give Websites Offline Functionality FUTURE: Network OptimizationNEW: Progressive EnhancementOLD: Loading Optimization
  67. 67. #SearchLove @goutaste FUTURE: Beyond the BrowserNEW: Recovering Dark DataOLD: Mobile-specific Data MOBILE ANALYTICS
  68. 68. #SearchLove @goutaste OLD: Mobile-specific Data “Where Are We Best Targeting Mobile Queries in Search Results?”
  69. 69. #SearchLove @goutaste OLD: Mobile-specific Data Google Analytics - Default Google Analytics - Devices Google Analytics - Browsers Usually social app browsers “How Are We Serving Our Mobile Users When They Land Here?”
  70. 70. #SearchLove @goutaste SEMRUSH “Mobile Reporting” OLD: Mobile-specific Data
  71. 71. #SearchLove @goutaste OLD: Mobile-specific Data @aleyda bit.ly/keyword-tools-matrix
  72. 72. #SearchLove @goutaste OLD: Mobile-specific Data @aleyda bit.ly/keyword-tools-matrix
  73. 73. #SearchLove @goutaste Which of These Devices Are ‘Mobile’? OLD: Mobile-specific Data All of these have a big screen, keyboard, and roughly the same performance – What is the difference between them? Lumia Screen + Keyboard iPad Pro Surface Pro MacBook @benedictevans
  74. 74. #SearchLove @goutaste NEW: Recovering Dark DataOLD: Mobile-specific Data Newer: Recover Dark Data & Get a More Realistic View of User Behavior
  75. 75. #SearchLove @goutaste NEW: Recovering Dark DataOLD: Mobile-specific Data Recovering Dark (Mobile) Traffic @mdsimmonds bit.ly/dark-traffic-slides
  76. 76. #SearchLove @goutaste NEW: Recovering Dark DataOLD: Mobile-specific Data Another One For The “Direct” Bucket
  77. 77. #SearchLove @goutaste NEW: Recovering Dark DataOLD: Mobile-specific Data Cross-Browser Attribution is Getting More Realistic… arstechnica.com/security/2017/02/now-sites-can-fingerprint-you-online-even-when- you-use-multiple-browsers/ “Now sites can fingerprint you online even when you use multiple browsers”
  78. 78. #SearchLove @goutaste NEW: Recovering Dark DataOLD: Mobile-specific Data …But Cross-Device Attribution is Still Crazy Hard (Especially Between Native Apps & Web) Signed-In Users are usually our best shot at accurate attribution here
  79. 79. #SearchLove @goutaste NEW: Recovering Dark DataOLD: Mobile-specific Data Rankings Tracking on Mobile Today Is Near Pointless @ipullrank moz.com/blog/the-technical-seo-renaissance
  80. 80. #SearchLove @goutaste FUTURE: Beyond the BrowserNEW: Recovering Dark DataOLD: Mobile-specific Data How Do You Record Offline “Traffic”? bit.ly/track-offline
  81. 81. #SearchLove @goutaste FUTURE: Beyond the BrowserNEW: Recovering Dark DataOLD: Mobile-specific Data What About Push Notification Behaviors? bit.ly/GA-push-tracking
  82. 82. #SearchLove @goutaste  Track your mobile segments… Yes, still do the basics…  pass the Mobile Friendly Test  Compress and minify your resources (images, JS…)
  83. 83. #SearchLove @goutaste  Pay attention to Service Workers and new performance techniques …but also start to build the foundations for what’s coming next.  HTTPS is tables stakes for a lot of the future  Build out your platform & prepare to be UI-Agnostic  Track your mobile segments… Yes, still do the basics…  pass the Mobile Friendly Test  Compress and minify your resources (images, JS…)  Figure out how we’re going to track it all outside a traditional browser
  84. 84. #SearchLove @goutaste  Pay attention to Service Workers and new performance techniques …but also start to build the foundations for what’s coming next.  HTTPS is tables stakes for a lot of the future  Build out your platform & prepare to be UI-Agnostic Be less REactive – be more PROactive & let’s make the mobile world a better place!  Track your mobile segments… Yes, still do the basics…  pass the Mobile Friendly Test  Compress and minify your resources (images, JS…)  Figure out how we’re going to track it all outside a traditional browser
  85. 85. #SearchLove @goutaste Emily Grossman @goutaste @mobilemoxie www.mobilemoxie.com

×