Last month we talked about what UX is and why you need to incorporate user experience in your website design work. This month we’re covering how to apply what you learned from your UX research, and the keys to a great user experience.
Implementing UX Research
We’ve spent a lot of time on research creating empathy and customer journey maps, but what exactly do we do with all of that information? How do we turn it into a great user experience?
Website design doesn’t start with design!
No prospect is going to visit your website just to see your logo. They are there to get their questions answered. They are there for your content. Web design starts with content, information architecture, and wireframes – and only then do you address the site’s aesthetics.
Are you surprised?
We typically see companies spend a huge amount of time and money on the design of a website and then get bogged down and never launch due to delays in supplying content. Another scenario we see because of content bottlenecks, is when companies will try to shoehorn old content into a new site. Obviously, neither of these provides a good user experience.
You need to know the content before you head into design.
UX Drives Content
It’s your users’ needs and their process that should drive the content on your site, as well as what the information architecture of your website looks like.
Who the customer is will impact the language you use – your word choices, your diction, and at what grade level you need to write your content. It will also influence your visual choices. For instance, if you want to convey calm, trust, or excitement, this will impact your color choices.
Your audience impacts all of these different areas, so if you don’t have a solid grasp of who they are at the very beginning, you risk getting it wrong. And since UX is the foundation of your website, you absolutely need to get it right.
Content Maps
The first step in transforming your UX research into a website that converts is creating a content map out of the information you’ve gathered.
If you think about it, every question needs an answer. Every answer is a piece of content that should be on your site. From the two research frameworks – the empathy map and the customer journey map – you’ll extract all of the pieces of content that need answers and then put those into a content map.
In the content map you’ll develop a list of all the content that should be on the site. This list shows you what you need to provide at each stage of the prospect’s decision-making process.
For example, if the user is worried, and asking “what if this doesn’t fit me properly?” Then the content you need to provide is a sizing chart or a return policy. You need to ensure that your content aligns with their needs at that stage of their journey.
You’ll then compare the list of what should be there with what your company has on the current website. This comparison allows you to see where the gaps are – and there are always gaps! (There is also always excess content, as well. Frequently we find that websites have lots of content that the user never looks at, had never asked for, and doesn’t need.)
When you finish the comparison, you’ll have a final list of content that you need to work towards producing.
The second step in the process is to organize that content – which leads us to the information architecture of the site.
Information Architecture & Navigation
From the content map, you’ll create the information architecture for the sitemap. This determines where all of these pages will live on your website and how they will relate to each other.
Within information architecture there are two structures. You have your hierarchical structure, which is your navigation, and you have your internal link structure, which forms your conversion flow or conversion path.
It’s not just the navigation which needs to match your customer’s journey, but also the internal page link structure.
For example, if you have a blog post on ‘5 Reasons Why Research Labs Need Informatics,’ the information addresses a prospect’s research stage. At this point in their decision-making journey, a user won’t know which brand of informatics best suits their lab’s needs. They only want to know whether they need laboratory informatics in the first place.
On that blog post’s page, however, you want to make sure you have internal links that push the user to content in the next stage of the journey – the evaluation phase. You don’t want them to have to go back to the navigation menus and figure out where to go next.
A good user experience will guide them without interruption. In this case, you are telling the reader “If you’re interested in this, you’ll want to read this other piece of content next.” In this way, you move them along the conversion path.
Wireframes
The next step is site wireframes. Think about wireframes like a blueprint of what a certain type of page will look like.
Typically, when we create wireframes we don’t do every single page on a site. We work on every page that has a unique type of content. For instance, the homepage, a service or product page, or a blog page. You wouldn’t need to wireframe each product page because each of those will use a similar look and feel. Similarly, your blog posts will all have a similar look, so you’ll only need to develop a single wireframe for posts.
To design the wireframe, you use the information that you learned about your prospects and customers. You must figure out the priority message that needs to be communicated on each page, as well as the supplementary information that you’ll need to link to. This is what drives how the wireframe is structured.
These blueprints define the information containers that the designers and developers use to create the website design.
It’s important to note that the wireframes are guidelines and recommendations. If the designer wants to move a couple of boxes around or change the size of something, that’s okay. It’s possible that if you’re using a particular WordPress template there might be some restrictions your designer needs to work within.
As long as the relative priorities of the content are maintained, then that’s really what’s important, because the goal is getting the right content to the right person at the right time in their decision-making process.
Keys to a Good User Experience
There are four key areas that define a good user experience. These are:
Ease of Use: Can your site visitor do everything they need to without any fuss? Yes or no? You need to ensure that a prospect can move through any stage of their journey on your website without any friction.
Useful: Your content must be relevant to your website visitor. It can’t be only what the marketing or product departments want. It must be focused on your prospect’s needs at all times.
Accessibility: Did you know that one in five people identifies with having some form of disability? It may be that they are visually impaired, or hearing impaired, or they have issues with cognitive motor skills.
Incorporating accessibility could include whether color contrast is adequate – so visitors can tell where links are and easily identify headings – or whether text is large enough, or whether the site will work with a screen reader.
Credibility: People buy from those they know, like, and trust. The smallest thing can break a user’s trust, such as a broken link in your content. Another common mistake that can create credibility gaps is to list an upcoming event…that happened 3 months (or 3 years!) ago. Typos have the same negative impact. None of us are perfect, but something as small as a misspelled or nonsensical word can stop a buyer in their tracks and break trust.
All of these different areas have an impact on whether the user experience is good.
Why UX Is Never Finished
UX is an ongoing process. Think about this: How often have you looked at a competitor’s site (usually a couple of months after you finish your own) and said, “hmmm, my site looks a little dated?”
Yes, I know. It happens more than anyone wants to admit! The web moves fast. Digital trends change and suddenly ‘fresh’ looks ‘old’ and new user behaviors need to be addressed.
So no, UX isn’t something you do once just when creating the site and then forget it. User experiences degrade over time.
If you launch your site and don’t do anything more for six months, what happens? During that six-month period, three new browser versions will be released, the new iPhone will come out, and eight WordPress updates will occur. It’s inevitable, so yes – the user experience will be different from when you went live with your site 6 short months ago.
The analogy I always use is that your website is a puppy, not a microwave, as borrowed from UX Strategist Stephanie Lummis. Your site needs regular care and feeding. It needs checkups to stay healthy. A microwave, on the other hand, sits on a shelf where it’s used every day. It only gets cleaned when somebody yells loud enough, right? And when it breaks, you throw it out and get a new one. Nobody repairs the microwave. And that’s how people treat their websites – like a microwave. Every three years you end up throwing it out and starting over.
But, if you are investing regularly, there are certain activities you do every month, every quarter, or every year to maintain a good user experience and avoid falling to the bottom of the trough. Instead of investing a huge chunk of budget every three years, you can invest a little bit of budget into maintenance to ensure your UX remains consistently functional. This is why a new version of Amazon’s website doesn’t appear every 3 years. Instead, tweaks are made constantly to address always-changing conditions – and keep them on top.
Your website needs to work as hard as your marketing and sales teams, and in some cases as hard as customer service. Because of its outsized role, you need to invest in it. Don’t skimp. Do the upfront research, know your prospect, and keep investing in it to avoid losing a good user experience – and never forget that the reason prospects visit your website is your content.
As you’re putting together your marketing budget for next year, take a quick look at your current website. Are you sure you are delivering the best user experience you can? If not, give us a call and let’s talk.
Brandwidth Solutions serves the healthcare, life sciences, technology, and contract pharma industries. We work with companies that want to make the most of their marketing – who want their marketing empowered to help drive leads – and ultimately sales. If you want to move your product or service forward in a smart way, we want to work with you. Call us at 215.997.8575.