Great user experience is the most important factor to consider when designing a website. It’s the difference between a positive customer experience and one that makes them want to go elsewhere.
The truth is, it’s not enough for a site to function well anymore — it must also look great, be easy to use, inspire the user, and be meaningful.
If you’re looking to boost your website in 2021 but aren’t sure where to begin, here are fourteen of our top tips to help transform your website from ‘meh’ to ‘marvelous’!
1. Make the most of white space
White space, or negative space, is the blank space between design elements. It can help draw the eye to crucial call to actions, as well as make your design look more sophisticated.
Look at minimalist brands like Apple, Nike, and Mercedes Benz and how they use white space in their designs.
Even small changes can make a significant impact. For example, additional padding around images and forms can make your design clearer and more attractive.
2. Give your ‘call to action’ some love
The call to action (CTA) is the part of your design that encourages your visitor to convert, whether it is an invitation to sign up to your newsletter, request a quote or buy your product.
Make sure your CTA is eye-catching and prominent, wherever it is on your page. It should be where your user expects to see it!
You should always design your page around one call to action. As tempting as it is to cram in as many as possible, in an attempt to encourage people to click, this can be counterproductive.
3. Pick the perfect typeface
It’s not just words and images that play a part in the look and feel of your design… the typeface you choose has a lot of impact too!
The combination of font, size, and weight says a lot about your design. Is it fun, formal, or informative? The same content in Comic Sans and in Lato will tell you two different stories!
An excellent place to start is other websites and design projects. Find ones that inspire you and have a similar purpose to the project you are working on.
4. Design better buttons
Buttons are great for usability. A visitor sees a button, and they feel compelled to click on it! Here are some of our top tips to ensure maximum clicks.
- We recommend using square or rectangular buttons as this is what people are most familiar with
- Shadows or roll-over colours can help indicate that a button is interactive
- Think mobile-first. Buttons should be large enough to be able to touch with a finger
- If you have two buttons and you want the user to click on one (for example a ‘pay’ and ‘cancel’ button) – make the button you want them to click is more dominant
- Make sure the text on your label is clear – it should determine what will happen when the user clicks on it
- Keep your button style consistent. Using different styles will confuse your users
5. Think mobile-first
When designing, you should always think ‘mobile-first’.
This means ensuring that your website not only looks good, but works effectively on a smartphone. When you have this down, you can then focus on UX and UI for your desktop site.
What does thinking mobile-first include? It means making sure buttons are large enough to be tapped on with a finger, eliminating the need for double-tapping, and that any popups can easily be closed.
If someone is using their little finger to tap on elements… it means that your buttons and links are too small!
With over half of web traffic now coming from mobile devices, it’s essential to ensure that our websites are optimized for the frictionless user experience.
6. Ensure your website runs quickly
People have less and less patience these days when waiting for websites to load. According to Kissmetrics, 47% of people expect a website to load in two seconds!
This means that your website not only has to be responsive and look good but load fast too. Bear this in mind when designing your site and avoid using elements that will increase your page load time, like unoptimized images, too many redirects, and bloated coding.
7. Always make it easy to get around
You need to make it as easy as possible for visitors to navigate around your website or app, If they find themselves on a page that is not linked to any other page on the website or too many clicks deep, they may decide to try their luck with one of your competitors.
Make sure that your navigation menu is in clear sight and have alternative methods to get around. For example, navigation links in the footer of your site or a search bar.
We also recommend the use of a breadcrumb trail, so web users can easily find where they are – think of it like a brightly flashing ‘you are here’ sign!
8. Make signing in as easy as possible
If a user has to login to use your website or app, make it so they are happy to do so!
Some of the ways you can do this include:
- Highlight any error messages and validation rules, so your user knows if they have logged in incorrectly
- Make it easy to reset a password
- Use single identity sign-on (for example, Google or Facebook) as a login option
- Offer guest sign-in on eCommerce sites if a user does not want to create an account. You can always encourage them to create an account by adding a password once they have purchased.
- Provide two-step authentication for extra security
The end goal of every webshop is to get as many sales as possible. However, if your checkout experience isn’t optimized, you might miss out on a lot of potential profit. Read our Webshop Checkout UX article and learn how to create a more enjoyable shopping experience for your visitors.
9. Show error messages that make sense
If your visitor is trying to use your app, website or system and is getting poorly worded error messages or even worse, no error message at all, they will get frustrated.
If a visitor has done something wrong, provide an informative message saying what has happened and what action they need to take to put it right.
For example, rather than just saying that a user can’t log in, explain that their username and password don’t match. That way they will know that they have probably typed it in wrong.
10. Put important information on your product listing pages
If you are designing an eCommerce site, make sure you put important information on your product listing page like prices, colours and sizes. If it isn’t there, your user will click on an item and then circle back to the product listing page to repeat the process.
Not only is this poor usability and can frustrate your website users but can reduce your page rank in the search engines.
Not a fan of clutter? Let users hover over the product to see more information instead.
11. Design for color-blind users
Colour blindness affects 1 in 12 men and 1 in 200 women. This is something you need to bear in mind when designing a website or app.
What may look vivid and exciting to you may look like a dull, brown, indistinguishable mess to someone who has color blindness.
The best way to test your design is to convert it to greyscale. If it is still legible, then you are on the right track.
Also bear color in mind when utilizing text. For example, if you use red-colored text on a form to indicate mistakes, a color-blind user may not be able to identify them. Use an icon as well to highlight errors.
12. Keep your download indicators user-friendly
People can easily get confused when trying to download content from your website or online system, so make the process as trouble-free for them as you can.
You can do this by showing how the download is progressing (for example, a percentage figure) as well as giving them a button or icon to click if they need to cancel the download.
13. Remember your content!
You may think that content is not a part of your UX design, but it is!
The aim of your content is to encourage your visitors to convert. Ensure it is clear and concise, and works with the design elements on your page, rather than against them.
Avoid using jargon and put your most useful content at the top of your page.
Keep your titles short too. Remember that people scan content and the more appealing it is, the more likely they are to work their way through the page.
14. Don’t be afraid to experiment!
What works for other people may not necessarily work for you. The best thing is to make small changes and then test them (ideally with real-life users) to see if they have resulted in an increase in conversions.
For example, some designers say that you should use a mixture of typefaces on your site to make it look more exciting. While this sounds like a nice idea… it doesn’t work for everyone.
So there you have it – fourteen UX and UI tips you can implement into your design process today!
What is your favorite piece of advice when it comes to web usability and experience?
Do you need any help identifying what could be improved on your website; or do you need help implementing a list of improvements that will make your website a better place to be for your visitors? Please reach out to us, we would love to hear from you! 🙂