“Well, hello there, inter-website blog post traveller!”
As you might have guessed from the title, this article is entirely about easy peasy hacks to improve your website user experience (or UX as we call it in the biz).
We all know how important the UX is for a website, product or app - we know that if our users don't have a good experience, they will leave.
Look, we've all been there. We have this great website that we've poured our heart and soul (and money!) into and it looks amazing in our eyes but the sales just aren't rolling in.
Sometimes we find ourselves without a budget to hire a professional, and that’s okay. At the end of the day, you want to create something that people will love using, and I'm here for that.
These hacks won't suddenly skyrocket you to having the best website in the world, but they will contribute significantly to improving your users’ experience and will help you to think from their perspective, (plus it’s fun) so, without further ado, let's get into it!
Hack #10 - Embrace the white space
As a designer, I can't get enough whitespace, but for every client, I have always wanted to reduce it. What’s with that!?
There is a very important thing to keep in mind with whitespace - it can work for you, there is no such thing as wasted space on the internet - it’s all strange digital pixels we draw into objects and craft meaning from.
Anyway, that's for another post - what we want to do with whitespace is draw a user’s eye to important content. Take a look at the images below and compare how well they draw your eyes to the important content.
What is the first thing you notice?
Now, what are you noticing with this image?
If my years of study tell me anything, it's that you'll have read the headline in the second image, probably after you saw the happy person on the phone - because your eyes took you there and made it easy.
I bet your eyes fluttered around quite a bit in the first example, unsure where to land and what to look at first.
Keeping space around each section and element also creates a feeling of calm and orderliness on your website, which is subconsciously reassuring for users. It might sound like a small thing but it does make a difference.
Hack #09 - Give users an out
It's one of the 10 Usability Heuristics for User Interface Design: users must have a way out of where they are currently.
This means simple things like ensuring each popup (more on dastardly popups later) has a close button that is clear and visible or that a hamburger menu turns into an X to indicate now you tap here to close it, or simply providing a link back to the homepage in your main menu.
It also means things like breadcrumbs are really important, which are the links at the top of that page that let you know where you just came from, such as Shop > Womenswear > Shirts > Product Name.
Being able to find their way back reduces confusion and frustration for users - even when you think your website is the easiest thing to navigate, there will always be a user unable to complete a specific task, and that's because we all think differently and interpret things differently.
Another great idea is adding a search function on long pages or some kind of index at the top with links to each chapter or section further down the page.
No one wants to feel trapped, so make sure your website design isn't unintentionally inciting those feelings in your users.
Hack #08 - Put anxiety-reducing content front and centre
Let's be real: Who signs up for a free trial that requires a credit card without some kind of assurance that they can cancel anytime? Nobody!
Likewise, many people don't want to buy shoes online unless they know they can return them, and how easy or difficult it is to do so.
One of the reasons websites like The Iconic, were so widely adopted was because of their amazing returns policy (which most companies do quite similarly) however, if you have to dig through a FAQ page to find this information then it's useless. Put it front and centre, right near the 'Buy Now' buttons and be proud of it.
It's also quite typical for the service industry to lack pricing information on websites, which is a relic of the past. People are reluctant to pick up the phone today and call to discover the price is out of their budget, they want to know answers now and not have to feel judged for their affordability or lack thereof - I know I hate those discussions!
Put your pricing out there, and if it’s too complex put a "from $2000" with some call to action to call or email for a more personalised quote.
Not only will this make users feel better by providing them with the information they seek, but it will also mean those who make the effort to contact you understand the price and are good with it - and that's a pretty warm lead.
Hack #07 - Use social proof
I know, I know, we've heard this one many times before. If you have any kind of testimonials, reviews or even just photos of people using your product - use them!
People are more likely to buy a product that has been tried and tested by others, it's just human nature.
Enough said this one is simple and foolproof.
Hack #06 - Get personal
Your website is an extension of your brand, or yourself, and as such should reflect the same values, culture and personality.
Don't forget that your users are real people, with senses of humour, personalities, with lives - if you're a fun-loving company, inject some humour into your copy. If you're a luxury brand, make sure your design and imagery are high quality and aspirational.
You're About Us page is the perfect place to start infusing some personality - after all, it's all about you (or your brand, or company) so it should reflect that. The days of being “professional” for the sake of it are over, and we’re all looking for more genuine experiences and connections.
Hack #05 - Get rid of those pop-ups!
Yes, I said it. Remove them. Take a look at this fantastic website and click on the first dummy Google result. This site brilliantly illustrates how overwhelmed we are with popups and notifications. I am certain you will agree wholeheartedly and maybe even giggle.
We are all drained from these inconvenient alerts, everywhere, on every single website we visit and if you're feeling it, you bet your ass your users are too.
If you feel the need to grab attention with a popup - the equivalent of a stranger grabbing you by the arm when you're halfway out the door - then you're doing it wrong.
Try to think of ways you can shift that content into a section on your site or as a captivating call to action.
Hack #04 - Speed up that website
If you're hosting your website on GoDaddy, CrazyDomains or anywhere less than $5 per month then my question to you is, are you invested in making this website work for you?
A website is only as good as its hosting provider. Just like a house needs a solid foundation, a website needs a reliable host to keep it running smoothly. A quality hosting provider will have great uptime, meaning your site will be accessible to users almost all of the time regardless of how many background requests are going on. They also offer faster server response times, so users won't get frustrated and click away before they've had a chance to explore your site.
Oftentimes when you check your page speed using Google's Page Speed checker, you lose about 1s of server response time with poor hosting providers.
My number one recommendation to improve your website speed is to choose a great host, and my absolute favourite is Cloudways. The setup isn’t as easy as GoDaddy might be, but if you hire a good developer to assist they will have you up and running in less than an hour.
Another great tip to speed up your website is to serve your images in Next Gen formats, as I’m sure the Google Page Speed checker likely told you to do. However, I’ve found over the years that most plugins that offer this service don’t work as anticipated or they add extra scripts to the site which may solve the image issue, but then creates another.
Cloudways have a fantastic little feature built in that you can simply toggle on or off which will enable WebP Redirection at a server level - no extra plugins, no messy scripts, no additional service payments to yet another website. If you don’t have any WebP images available to use, the fallback is your standard JPG and PNG.
For WordPress users, the ultimate caching plugin I can recommend is W3 Total Cache and here is a great article on the best settings to use when combined with Cloudways hosting.
The best part is W3 Total Cache has an extension called Image Service - install this extension and it will automatically convert all newly uploaded images to WebP. Cloudways will do the rest with WebP Redirection in place and viola - you’re caching and speeding up your website like never before.
Hack #03 - Think from your users’ perspective
This seems obvious, but don't roll your eyes yet. What are the questions your clients ask you most often? What is the most common question that comes through your contact forms? When a new customer phones you what do they usually ask? Write all of these down and then take it all in.
Now, go to your website and pretend you are a customer. Can you find the answers to all of those questions easily? No? Then I hate to say it but you're not done yet!
You need to make sure that everything is easy for your users, from finding your contact details to your pricing structure, product ingredients, shipping details, returns policies and especially learning about your products and services.
And think about it, if they’re asking you these things then those are the things your users/clients want to know.
Hack #02 - Run through everything, then do it again
Run through your entire website as if you've never seen it before. That means if you have a sign-up page, put your email in and test the process - did the email arrive in your inbox? If you accept payments, set all of your payment processors to test mode and make a dummy payment.
Did the payment take forever to go through?
Did your receipt come through?
Was there a strange glitch when you clicked the gift wrapping button? But then it went away? What was that?
This is all-important, because anything you experience, your users experience.
It might feel like these small things belong in the "too-hard" basket, or the "nobody will notice" basket, but they don't. Every small thing should be addressed, and if we're frank with ourselves: the best sites don't have these issues and there is no reason ours should either.
Now that you're done, run through it again.
Hack #01 - Validate everything you just did with user testing (for just $35 per test)
That's right, it's not that expensive to user test AND you can do it yourself.
Of course, if you choose to do it yourself you miss out on a UX Specialist's years of experience, study and deep knowledge on how to interpret the data, however, we all have budgets and sometimes it just isn't possible.
All you need is about 3 to 5 users, to validate your ideas, and a good set of questions to ask your users. Here is a great article explaining the reason you only need 5 users.
There are sites like User Brain where you can buy single users and conduct single tests for only $35 per test. Plus you get 2 free tests when you first join (score!). Two free tests plus one at $35 is a great deal, and that's a perfectly valid quantity to test with.
Also, a little note here that their interface makes it seem like you need to purchase 1000 tests to start with, but you don’t. Simply create your test then click through to find users, then you’ll see the ability to pay for single tests.
Now for the questions - what will you ask them to do?
The best things to set up are tasks for your users and ask them open-ended, qualitative questions such as the below:
When you first land on this website, what do you think the product/service offering is?
How would you find pricing for [product name]?
How would you find information on [product name]?
Pretend you want to buy [product name], go through the entire process and stop when you reach the checkout.
How does the colour scheme make you feel?
Tell us how easy or difficult you found it was to navigate the site. Explain why.
Always start letting users know they should speak out loud as they navigate the site and answer your questions.
Keep the questions simple and don't lead the users into an answer, for example, you wouldn't ask a question like "How great do you think our site is?" or "Can you see we are interior designers when you first visit the page?" because you're unintentionally steering their answers.
Once you're done setting up the tasks, select some participants that are in your demographics and wait for the results to roll in. You'll quickly receive some videos with users navigating the site and completing your missions, all while they're thinking out loud - which is always fun to listen to.It might feel daunting, but you can do it. Be bold and be brave - your website (and your real users!) will thank you for it.
Now, for how to interpret what they’re saying: listen and listen. The small throw-away comments and actions such as clicking multiple times around something (also known as rage-clicking) are some of the biggest clues you can look out for.
If a user hovers and opens every single sub-menu going back and forth to try to find a specific page, then it means they weren’t able to easily locate it - consider renaming your tabs or consider condensing the menu.
Well, there you have it - 10 easy peasy hacks to help improve your website user experience like a pro. I spilled a fair amount of insider knowledge here, so I hope you take it and use it.
Let us know how you went with implementing any of these hacks and what you learned along the way. If you need any help, don't hesitate to reach out - creating a great User Experience is my favourite thing, if you can’t already tell.
Kiara Aliano
User Experience Designer, Website Developer, Founder of Desode
E: kiara@desode.com
Comments