16 Tips for Balancing Website Design and Conversion
Poor website design is a conversion killer.
It doesn’t matter how good your content is: If you don’t address design and usability issues, you’re wasting your time.
To get the ROI you want, it’s essential to balance design with content for better conversions—and that’s an art. Here’s what you need to think about.
Design – The Big Picture
Let’s start with the overall design elements, like content, typography and navigation.
1. Where’s Your Top Content?
Web users will judge your site before they make the first click. Their immediate reaction determines whether they will stick around or go elsewhere. Some people only look at what they can see at the top of the page, known as “above the fold.”
Put the most important content up top.
That might be a signup box for your newsletter. Or it might be a great headline that makes them want to read the whole page. Unbounce has some great examples of above-the-fold landing page designs, while Kissmetrics says you should use the area above the fold to motivate customers to go further.
2. Clearing the Clutter
Remember those websites from the early 1990s where people crammed everything they could onto a single page? There are still some around, but thankfully, things are a lot saner now.
White space gives design elements room to breathe and makes it easier for readers to scan your content. In fact, one study shows that using white space might keep people on the page longer (because they read more slowly).
More time on the page = improved conversion rate.
3. Getting Around
Don’t mess around with navigation.
People expect to find navigation elements in a few standard places, like at the top of the home page, to the left, or sometimes at the bottom. Mess around with that and you make it harder for them to find information.
Frustrated visitors don’t buy.
It’s also vital to get the labeling right so people know where to find key information, like the home page and contact page.
Think that choosing the right font has nothing to do with conversion?
Good typography can help deliver the cues that guide web visitors towards the most important elements on your page. Use larger headings for the most important elements on the page, while using smaller font sizes for less crucial content. This gives you the trifecta of great design, readability and an excellent user experience.
Oh, and it’s good for branding and customer perception too.
Getting the Visuals Right
How your content looks can be a major factor in boosting conversions. That’s why it’s important to look at the role of color, images, graphics placement, movement and those important call-to-action buttons.
5. Color Schemes
The colors you choose on your website make a big difference to the people’s perceptions and the actions they eventually take. Kissmetrics found that 93% of people say that visuals are a key influencer in purchase decisions.
That same study gave several examples of companies experiencing higher conversions when changing the color of some web design elements.
Using colors taps into emotions.
It also improves brand recognition, so it’s important to get those right. A/B testing is your best friend in finding the right colors for your web design.
6. Visual Hierarchy
Visual hierarchy is a key part of high-converting design. It’s all about using visual cues to rank the information on the web page. That means using bigger images for the important elements and smaller images for those that aren’t. And using bigger headings or bold type were necessary to draw the attention.
The point is to subtly tell visitors to your web page what they should be looking at. Check your analytics and do some testing; you’ll find that using this technique improves conversions.
7. Image Dos and Don’ts
While we’re talking visuals, here are a few tips for getting the images right:
DO use the rule of thirds for well composed images that grab attention.
DO remember that cuteness and beauty appeal: studies show that pictures of babies, animals and beautiful women tend to improve conversions.
DON’T overuse stock images—stick to something fresh, interesting or unexpected for best results.
8. Use Movement
When using images of people, pay attention to the direction of the eyes, because web users will too. Without even realizing it, they will follow the eyes, so make sure people are looking towards the right area of your web page. Check out some tests on the Quicksprout blog for evidence.
9. Button It Up
Before people can complete an action, they often have to press a button, so this is a hugely important design element. As well as the text, designers have to get the color and placement right to lead web users to the desired action.
One Unbounce client got a 35% boost in sales by changing the shape and color of the call-to-action button.
Designing for Usability
Want people to stick around? Then you have to consider the mobile user experience (UX), the page load speed, and meeting users’ needs with simplicity—and designing for conversion.
10. Mobile UX
Great design is not just about colors and content; it’s also about how easily people can use your site. And these days, that’s got to include the mobile user experience (UX). As Google’s Mobile Path to Purchase report shows, 59% of consumers visit mobile business websites, and many spend as much as 15 hours a week searching for information.
That means if you want to boost conversions, you have to consider smaller mobile screens, identifying the elements that must take priority for users to easily get the information they need. A year ago, Google said that mobile design was a business imperative; that’s even more true now.
11. Speed Rules
Another proven conversion killer is slow page load times. So don’t sacrifice speed to a beautiful design; make them work together instead. Get rid of Flash, keep scripts to a minimum and keep images small. Once your site design is live, try a usability testing tool to see if there are any bottlenecks you can design out.
Amazon excels at this, with a quick-loading mobile page:
12. Design for Conversions
Visitors want to take action; don’t make it hard.
If all you want is to get them to sign up for your email list, then put the email form near the top of the page and use visual cues to point towards it.
If you want to lead them to a landing page for another product, then include a big button in the middle of your text that encourages them to click it. The easier you make it for web visitors to complete those actions, the better your design will convert.
13. Embrace Simplicity
A rule of thumb for good web design is to keep it simple. Studies have shown that the more choices you give people, the worse they convert. Other ways of embracing simplicity include:
Make it easy for web users to fill out forms. Only require the minimum information you need on the first pass. There’ll be time to collect more info later.
Ensure that if you’re sending web users to another URL on your site, then it’s transparent, using words instead of numbers so they know where they are going.
Keep payment options simple—like Amazon’s One-Click—so you don’t fall prey to shopping cart abandonment.
Building a good relationship with potential customers can help with conversions, both before and after the sale. Here are three ways to do this with design elements on your page.
14. Social Proof
For consumers, there’s safety in numbers.
Nothing gets people to buy like the knowledge that other people have done the same. Social proof is a psychological trigger that vastly improves conversions. Build reviews, ratings, testimonials and positive social media updates into your design to leverage this trend and build trust in your brand. When you have earned a significant social following, incorporate the list of your likes, followers and connections into your site.
15. The Power of Trust
Build trust factors into your design to help sway potential customers your way when they’re about to make a decision. Include customer logos, number of purchases of the same item and safe shopping buttons.
And seal the deal with incentives—like free shipping.
16. After the Sale
Don’t stop aiming for conversions just because a customer has completed the sale. You can keep the relationship going—and inspire them to come back again by:
Offering additional discounts or rewards.
Notifying them that the sale has been completed successfully.
Showing them what others have bought.
Amazon does this well with its “People who bought this also bought” feature, which could lead to additional conversions.
Finally, keep an eye on your analytics to spot when some pages or page elements are losing power. Continuous testing will ensure that you always enjoy maximum conversions.
Website design may seem like an ideal place to exercise creativity. But like every other element of your website, the design should be used as a tool to boost conversions. Follow these tips to make sure you are making the most of your site design, delighting customers and keeping them coming back for more.
Image credits: Kristian Bjornard, screenshot 12/3/13 of webdesignledger.com, SocialIsBetter, visualwebsiteoptimizer.com, Kristian Bjornard, screenshot 12/3/13 of amazon.com, Terry Johnston, screenshot 12/3/13 of amazon.com