Pro Yearly is on sale from $80 to $50! »

Designing for next steps: A forward moving Web experience

9a168ca8182274f100cc89ea5db64708?s=47 Nick DeNardis
December 09, 2012

Designing for next steps: A forward moving Web experience

Getting a visitor to your website is only half the battle. How do you keep them? A lot of attention is put on the "action" items on a homepage, but it's more likely a visitor is landing on an interior page from a Web search or link. Every visual element, content or cue makes an impression with your visitor and influences what next step they take. The last thing you want to do is leave your visitor at a dead end or continuously force them to use the back button. With each page having a defined next step it gives your visitor a forward moving Web experience.

The idea is more than just bigger and brighter action buttons. No matter how large you make them your visitors are not going to click if they don't care. Your goal is the design an experience to make your visitors care.

9a168ca8182274f100cc89ea5db64708?s=128

Nick DeNardis

December 09, 2012
Tweet

Transcript

  1. @nickdenardis #CASEV

  2. @nickdenardis #CASEV Designing for next steps (a forward moving Web

    experience)
  3. @nickdenardis #CASEV @nickdenardis

  4. @nickdenardis #CASEV Associate Director of Web Communications Wayne State University

    hp://wayne.edu/ Host of EDU Checkup hp://educheckup.com/ Curator of EDU Snippits hp://edusnippits.com/
  5. @nickdenardis #CASEV Information Architecture “the art and science of organizing

    and labeling websites, intranets, online communities and software to support usability.” - Information Architecture Institute
  6. @nickdenardis #CASEV

  7. @nickdenardis #CASEV

  8. @nickdenardis #CASEV

  9. @nickdenardis #CASEV User Experience “a person's perceptions and responses that

    result from the use or anticipated use of a product, system or service" - ISO 9241-210
  10. @nickdenardis #CASEV Good Design != Good UX

  11. @nickdenardis #CASEV “To understand any individual screen, you must understand

    the chain of events that led to a user going there…” ~ Des Traynor
  12. @nickdenardis #CASEV

  13. @nickdenardis #CASEV

  14. @nickdenardis #CASEV school.edu/page.asp?id=1245 or go.school.edu/grad-programs

  15. @nickdenardis #CASEV Good UX = Good Design

  16. @nickdenardis #CASEV 1. Junk 2. 3. 4.

  17. @nickdenardis #CASEV Care.

  18. @nickdenardis #CASEV First Impressions

  19. @nickdenardis #CASEV

  20. @nickdenardis #CASEV

  21. @nickdenardis #CASEV Can I trust this page? Is the information

    up to date? Can I use this page as a resource in the future? What do they want me to do on this page?
  22. @nickdenardis #CASEV

  23. @nickdenardis #CASEV

  24. @nickdenardis #CASEV

  25. @nickdenardis #CASEV

  26. @nickdenardis #CASEV

  27. @nickdenardis #CASEV

  28. @nickdenardis #CASEV

  29. @nickdenardis #CASEV

  30. @nickdenardis #CASEV

  31. @nickdenardis #CASEV

  32. @nickdenardis #CASEV 1. Junk 2. Good 3. 4.

  33. @nickdenardis #CASEV Test early, test often.

  34. @nickdenardis #CASEV

  35. @nickdenardis #CASEV

  36. @nickdenardis #CASEV

  37. @nickdenardis #CASEV

  38. @nickdenardis #CASEV

  39. @nickdenardis #CASEV

  40. @nickdenardis #CASEV

  41. @nickdenardis #CASEV Woopra

  42. @nickdenardis #CASEV Silos get in the way of your users

  43. @nickdenardis #CASEV

  44. @nickdenardis #CASEV

  45. @nickdenardis #CASEV

  46. @nickdenardis #CASEV

  47. @nickdenardis #CASEV <script type="text/javascript"> var _gaq = _gaq || [];

    _gaq.push( ['_setAccount', 'UA-xxxxxxxx-1'], ['_trackPageview'], ['b._setAccount', 'UA-xxxxxxxx-1'], ['b._trackPageview'] ); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script') [0]; s.parentNode.insertBefore(ga, s); })(); </script>
  48. @nickdenardis #CASEV

  49. @nickdenardis #CASEV

  50. @nickdenardis #CASEV

  51. @nickdenardis #CASEV

  52. @nickdenardis #CASEV 1. Junk 2. Good 3. Great 4.

  53. @nickdenardis #CASEV Use a human proxy

  54. @nickdenardis #CASEV

  55. @nickdenardis #CASEV

  56. @nickdenardis #CASEV

  57. @nickdenardis #CASEV

  58. @nickdenardis #CASEV We have limited time

  59. @nickdenardis #CASEV ClickTale

  60. @nickdenardis #CASEV People suck at reading online

  61. @nickdenardis #CASEV

  62. @nickdenardis #CASEV

  63. @nickdenardis #CASEV

  64. @nickdenardis #CASEV 1. Junk 2. Good 3. Great 4. Rememberable

  65. @nickdenardis #CASEV #littlebigdetails http://littlebigdetails.com/

  66. @nickdenardis #CASEV Error messages matter

  67. @nickdenardis #CASEV

  68. @nickdenardis #CASEV Reduce the barrier to completion

  69. @nickdenardis #CASEV

  70. @nickdenardis #CASEV

  71. @nickdenardis #CASEV

  72. @nickdenardis #CASEV

  73. @nickdenardis #CASEV

  74. @nickdenardis #CASEV Creepy!

  75. @nickdenardis #CASEV Details matter (pixels don’t)

  76. @nickdenardis #CASEV

  77. @nickdenardis #CASEV

  78. @nickdenardis #CASEV

  79. @nickdenardis #CASEV

  80. @nickdenardis #CASEV

  81. @nickdenardis #CASEV

  82. @nickdenardis #CASEV

  83. @nickdenardis #CASEV

  84. @nickdenardis #CASEV

  85. @nickdenardis #CASEV

  86. @nickdenardis #CASEV 1. Junk Get a baseline understanding of your

    visitors 2. Good Entice them to get just one step further 3. Great Walk along their journey 4. Rememberable Adding a few #lilebigdetails
  87. @nickdenardis #CASEV Resources • google.com/analytics • slickplan.com • intercom.io •

    woopra.com • clicktale.com • freegeoip.net • lilebigdetails.com
  88. @nickdenardis #CASEV https://speakerdeck.com/u/nickdenardis Thank You

  89. @nickdenardis #CASEV