This document summarizes a presentation about best practices for website redesign, focusing on strategy, design, and content. It discusses how to conduct persona-based design by segmenting audiences and developing personas. It also covers establishing intuitive information hierarchies and prioritizing content. The presentation uses UC4's website redesign as a case study, highlighting how they implemented segmentation, persona-based design, and content prioritization to increase engagement and conversions.

1. Online Marketing Summit San Jose | June 18, 2010 Successful Website Redesign: Strategy, Design and Content Christopher Harmon chris@thebatstudio.com Principal theBATstudio 1

2. First:Learn what top B2B companies are doing well and where they're falling down when it comes to website usability. Second:Through UC4's recent website redesign initiative you will hear great tips on how to build a strategy, determine design and content-a mix that saw significant boosts in conversions and visitor engagement for UC4. 2

4. Consumer

5. Non-ProfitExplore our website to learn more about our agile, adept and affordable approach. Clients include:

6. Best Practice Website Processes and… What exactly does usability mean? Why You SHOULD Care… Usability Best Practices: 3 Actionable Steps to a Better Website UC4 Case Study Q&A / Discussion 4 Agenda

7. Best Practice Website Processes 6/16/10 5

8. 6 Strategy Content Design

9. Best Practice Website Processes and… What exactly does usability mean? 6/16/10 7

10. 8 “ The user should be able to intuitively relate the actions he needs to perform on the web page, with other interactions he sees in the general domain of life e.g. press of a button leads to some action. - Wikipedia

12. To give the correct choices to the users, in a very obvious way.

13. To remove any ambiguity regarding the consequences of an action e.g. clicking on delete/remove/purchase.

14. Put the most important thing in the right place on a web page or a web application- Wikipedia

15. Why You SHOULD Care… 10

16. 11 “ With limited screen real estate and robust content and functionality requirements, designers are forced to make tradeoffs to achieve their client’s objectives. However, when usability suffers, even the best content and functionality is often ignored. - abstracted from Forrester

17. 12 Example: Who does this speak to?

18. 13 Example: What would you click on?

19. Example: What would you click on? (part2) 3 2 1 4 5 14

20. 15 Example: What should you click on?

21. 16 Example: What is the second read?

22. 17 Example: Blink Test – What’s the takeaway?

23. 18 Example: What would you read?

24. 19 Example: Where does the real content start?

25. 20 Example: Are you compelled?

26. 21 Example: Benefits Galore – But what do you do?

27. 22 Example: What’s clickable?

28. 23 Example: What about here?

29. 24 Example: Huh?

31. Conversion

32. Deep Funnel Activity

33. Executive and Board Recognition

34. Budgets= CMO expectancy < 2 years 25 Bad Usability =

35. 3) Usability Best Practices:Three Actionable Steps to a Better Website 26

36. Usability Best Practice #1Persona-based Design 27

37. Persona-based Design is the process of identifying your target audience, understanding their points of pain, and addressing such with a clear 1-1 offer or set of solutions. 28 Usability Best Practice #1 Persona-based Design

38. 29 Usability Best Practice #1 Persona-based Design – How to: Segment Target Audience w/ Sales and Product Teams Interview Internal Audience Experts Interview Target Audience(telephone / IDI / user group / focus group) Develop High-Level Persona Descriptions Test Descriptions with Stakeholders Develop Messaging Statements/Matrices Develop Product and Demand-Generation Marketing Programs Aligned with Sales Channels Craft Persona-based: Information Architecture (Sitemap / Wireframes) Visual Design Content Strategy (campaigns, headlines, copy, images, multimedia, offers, collateral, etc.) Testing-Plan (paper-prototypes, friendly reviews, IDIs)

40. Define segments by business size

41. In primary nav

42. On product pages

44. Limited role-based segmentation

45. Complex activity / product based segmentation

47. Multi-Dimensional Segmentation

48. Complexity reduced through simple, intuitive interface

49. Not extended through website experience – why?32

51. Multi-Dimensional

52. Use of banner for top level activity-based segmentation

53. Use of a simple, clear and easy nav module

54. Extends throughout website experience33

55. Usability Best Practice #2Intuitive, Clear Information Hierarchy 34

56. Usability Best Practice #2 Intuitive, Clear Information Hierarchy Information Hierarchy refers to the “funnel” or order of information that your audience should engage in. 35

57. 36 Usability Best Practice #2 Intuitive, Clear Information Hierarchy – How to: Leverage Segmentation to Develop Messaging Hierarchy Based on that Hierarchy, Develop a Sitemap Funnel Test Sitemap against Personas and Refine Based on Hierarchy, Develop Wireframes with a CLEAR Information Funnel Translate Wireframes into Visual Design – Provide Design team the FREEDOM to realize Hierarchy through Design Test Visual Design against Personas and Refine Monitor Site Performance with Overlays and Refine

58. 37 Usability Best Practice #2 Intuitive – Clear Information Hierarchy Basecamp Who are we and what do we do? Take a look – and notice the seal of customer approval! Now that you’re ready – go ahead and click on our CTA Not ready yet? Check out these clients and get additional immediate insight into what we do… All in a simple, clean, un-cluttered interface. 1 2 4 3

59. 38 Usability Best Practice #2 Intuitive – Clear Information Hierarchy 4 NetSuite Leadership messaging Check out some of the customers we’ve helped Who we are and what we do No more than three “Next Steps” Need more detail? No problem, we’ll help you qualify right on the homepage. 2 1 3 5

60. 39 Usability Best Practice #2 Intuitive – Clear Information Hierarchy 3 Conversive Simple, plain-English headline Ever-present “Next Steps” module Prominent information graphic Content – provided in multiple formats for easy-digesting Clear progression of section content with a natural conclusion In-depth content for the indoctrinated 2 1 4 5 6

61. Usability Best Practice #3Content is STILL King 40

62. Content is not JUST Copy.Rather, content is the summary of campaigns, offers, calls-to-action, headlines, subheads, copy, call-outs, multimedia, information graphics and even images.Content is THE most under-appreciated aspect of MOST websites. 41 Usability Best Practice #3 Content is STILL King

63. Inventory Content Assets Map Assets against Segmentation Map Assets against Information Hierarchy Prioritize Homepage About Us Social Media Category Pages Product / Solution Pages Resources News / Events Execute Monitor Conversions Time on page Top Exits Click Overlays 42 Usability Best Practice #3 Content is STILL King – How to:

64. 43 Usability Best Practice #3 Content is still KING 3 Eloqua Present easily digestible pieces of content, ideally utilizing headers, sub-heads, bulleted-lists and call-outs Present alternative forms of content such as video, information graphics, etc Provide easy access to contextually related experiences 1 2

65. 44 Usability Best Practice #3 Content is still KING 3 Coupa Software Use headers with HTML text to give a sense of space AND improve SEO Present alternative forms of content such as video, information graphics, etc Present easily digestible pieces of content, ideally utilizing headers, sub-heads, bulleted-lists and call-outs 1 2

66. 45 3 Usability Best Practice #3 Content is still KING Foundation Source Use headers with HTML text to give a sense of space AND improve SEO Present easily digestible pieces of content, ideally utilizing headers, sub-heads, bulleted-lists and call-outs Call-out benefit statements in easily digestible form 2 1

67. 46 Usability Best Practice #3 Content is still KING Conversive Use headers with HTML text to give a sense of space AND improve SEO Present easily digestible pieces of content, ideally utilizing headers, sub-heads, bulleted-lists and call-outs 2 1

68. It all starts with SEGMENTATION Persona-Based Design = More Clicks Create a Website Funnel Prioritize Content to WIN! 47 Bringing it ALL together:

69. 4) Case Study: UC4 48

70. We automate IT and business processes, anywhere. Based in Austria, US headquarters in Bellevue 1,800+ customers in more than 50 countries More than 600 large enterprise customers 95% say they would buy UC4 again 260+ employees $75m revenue, 20% license year-over-year growth Top tier in Gartner and Forrester Who Is UC4

72. Create a bold, compelling store-front

73. Drive increased engagement measured by Lead Generation

74. Utilize website best-practices

75. Feature rich-media assets and resourcesProject Goals & Objectives

77. Limited platform for future development

78. Creative was dry, visual design static

79. Lack of rich-media, interesting, assets – focus on WPs

80. No integration with our marketing automation tool or SFAThe Situation

81. Segmentation 52

83. By Application Environment:Most UC4 customers have detailed application environment constraints

84. By Organization:We sell to two client organizations that often have different agendas – Data Center Operations and IT Operations

85. By Role:Our point-of-entry qualifiers are most often at a manager or operator level, and are rarely VPs or above. When we talk to VPs it’s through sales – NOT our websiteStep One: Segmentation

86. Persona-Based Design =Intuitive Hierarchy 54

87. 2 Persona Based Design Prioritized Segmentation Addressing Common Pain Establishing Application Breadth and Expertise Speaking to Organizations and Roles 3 1

88. Content is KING 56

90. Rebranding was a great exerciseIt helped us honestly decide what we do, what value we offer, to whom

91. Strategic Content CreationDeveloping content to drive conversion AND improve SEO

92. Craft simple, straight-forward contentContent is KING > UC4 is getting there!

93. Content is KING > UC4 is getting there! Prioritized Segmentation HTML Text Headline Image / Infographic Content using subheads, call-out offers and bullet-lists Related-Content Modules Persistent Next Steps 1 2 4 5 3

94. Results 59

96. Time on site

97. Pages visited

98. Conversion of visitorsResults Time on WWW Site (seconds) Average Pages Per Visit (12 Month View) Conversion Rates from Visitors

100. Customer engagement – build a strong community

101. Break the mold with assets “Do less, but make it break-thru”

102. Introduce asset and product ratings

103. Dynamic content and asset placement based on visitor segmentation/demographics throughout the websiteWhat’s Next

104. Q&A / Discussion 62

106. What methods do you use to identify and understand your target audience?

107. What strategies do you use to connect with multiple segment types?

108. How is your content strategy prioritized? Around SEO? Segmentation? Product Marketing Initiatives?

109. What is the tipping point for all of this – how much is enough to make a difference?63 Discussion Topics:

110. DOWNLOAD the presoat: http://www.thebatstudio.com/thoughts/resources Christopher Harmon chris@thebatstudio.com 510-339-7300 http://www.linkedin.com/in/cjharmon 64 Thank You!

111. 65 Thank You Visit www.onlinemarketingsummit.com for more information Follow us @OMSummit