It's understandable how we'd get caught up in making our websites something we love. After all, you're spending thousands of dollars to build it, you should be proud of it. But no amount of fancy animations, background videos or "pops" of color can compensate for a bad user experience on your website.
The truth is that your website is for your customers, not your team. And, if you're going to provide them with a good user experience they have to be the focus of every they decision you make.
Why Does User Experience Matter?
User experience (AKA UX design in web design-speak) is how a person interacts with your website and responds to it. So, it should come as no surprise that the best experience for your users comes when you make the website all about them. All your content should be centered around what your customer wants and helping them solve their biggest problems.
When you focus on improving the usability of your website, you should see bounce rates decrease, conversion rates increase and your sales start to climb.
Whether you're starting fresh with a new website or considering a redesign of your existing site, here are our top tips for high-converting, user-friendly dot coms.
The Dos and Don'ts of Usability in Website Design
Do Use Clear, High-Contrast CTAs
Contrary to what you might think, users want to be told exactly what to do. Your calls to action (CTAs) should be concise and have high contrast with their background. This draws the user's eye to your conversion opportunities and makes it clear what action they should take.
- Choose your colors wisely and think about the message you want to bring to mind from your users (trust, experience, intelligence, etc.)
- Use clear action words that describe what you want the visitor to do. Your button copy should say what will happen, or where they'll be directed after someone clicks it. For example, let's say you have a landing page where users can download your free Ebook. Instead of using a generic phrase like "Learn More," it would be better to be direct and say "Download Our Ebook." Make your words direct, time-sensitive, and action-oriented.
Don't Give Users Too Much to Do on One Page
You may have heard other marketers or UX designers mention the term information architecture. This means building your pages in a thoughtful way that makes it easy for visitors to find the content they care about. Don't overwhelm your site visitors with spammy pages covered in text and buttons. The simpler your site looks and the easier it is to navigate, the more likely users are to stick around (i.e., you'll have a lower bounce rate).
- Before you start your site design, create a sitemap. This will help you map out the user flows in the site as a whole before getting into the nitty-gritty of each page.
- Once you get to the page level, take the time to wireframe before moving on to design. Wireframes help map out the flow of a page so you can make sure it's natural and efficient for the user.
Do Leave White Space
Instead of cramming tons of content or design elements on a page, use white space to let your text and images breathe. White space gives users a visual break and helps draw attention to important elements on your website. (We should also note that it doesn't have to always be literal white space, it can be any color.)
Be careful when evaluating this on your site. Once you look at a design long enough, you may feel like there's too much white space because you already know what the page says. Think like a user who has never seen your content before and who is scrolling down the page for the first time. You don't want to make them feel like they're drinking from a fire hose.
Don't Give Users a Wall of Text
In addition to white space, a proper type hierarchy makes your pages easy to skim instead of asking the user to pick out the most important points from a wall of text.
Here's a formula our team often uses for creating clear, yet skimmable, web copy.
Bold and clear heading + supporting subheader + 1-3 short sentences of body text that get the point across
This allows a user who is scrolling down the page to quickly locate the information they're looking for and digest the details in a matter of seconds.
Check out the comparison of the two layouts below. Which one helps you understand the content quicker?
Not only does this sectioned approach to content make it easier on your customer –– it also gives your site a boost in SEO optimization. Headings tell search engines what is most important on the page and show that you are making it easy for the user to read.
Do Make Your Site Responsive and Mobile Friendly
In 2015, mobile device usage surpassed that of desktop and laptop usage. It makes sense. Think about how many times a day we mindlessly surf the web while standing in line or watching TV. So if someone is on their iPhone and comes to your site and the layout looks wonky (a very technical UX term), then customers aren't likely to stick around.
For eCommerce brands, this is even more important. Consider this: in 2018, 79% of smartphone users said they had bought something online using their mobile device within the past six months. If people can't easily browse your products on their phone and have a smooth checkout experience, you're missing out on tons of sales.
Want to make sure your site is mobile-friendly? Check out this free tool.
Don't Sacrifice Page Speed
Check out Google's free service to test the page speed of your website: Google Page Speed Analyzer. The test will give you a score for both mobile and desktop, along with some recommendations on how to improve your load times.
Do Reduce Friction and Eliminate Clutter
Amazon's dash buttons are a perfect example of creating a frictionless customer experience. Running low on laundry detergent? Just press this little button and a new carton will be delivered to your house in just a couple of days.
High-converting websites focus on reducing friction for the customer so that it's as easy as possible to interact with you.
Here are some of the main creators of friction we often see on websites:
- Headers that change on every page.
- Hidden or unclear CTAs.
- Requiring multiple clicks to complete an action that should just take one.
Don't Forget About Accessibility
Accessibility is all about making sure the hearing or visually impaired can still use and access your website. Aside from the need to follow regulations around accessibility, part of creating a good user experience is making sure your site is accessible to everyone. It's often forgotten (even by Beyonce), but it's a very important piece to consider as you design your site. Here are the three pitfalls we see sites fall into when it comes to accessibility:
1. Contrast - Your text and backgrounds need to be high contrast so that they are clear and easy to read.
2. Alt Tags - The alt text on your images allow screen readers to tell the visually impaired what is happening in an image.
3. Too Much Animation - Sometimes websites will introduce things like a box that “flips” to reveal a description. While that may look cool, a screen reader won't be able to read it.
Do Track What's Working (and What's Not)
At first, creating a highly engaging website can feel subjective to the whims of whoever's calling the design shots. Everyone has personal preferences, design trends are always changing and new functionalities are constantly being introduced. And, while some age-old digital marketing methodologies never go out of style, it's always important to monitor what's working and what's not.
Use site metrics and heatmaps to understand how your website visitors are interacting with your site. Here are some key areas to focus on:
- What they're clicking on.
- What they're looking for.
- Scroll patterns to see what content they're interacting with.
- What web pages they're spending the most time on.
Putting the "You" in User Experience Design
There are lots of simple steps you can take to improve your site's user experience and convert more visitors but the biggest one is just asking "what would make it easy for my target audience?" You may have to put in a little work, but you'll see a big payoff if you take the time to elevate your user experience for your audience. Always remember that it's less about what we (your brand) want and more about what you (your customer) needs.
Wondering what goes into the cost of your website redesign? We break down the whole process and cost in this blog.