Three quick wins to boost User Friendliness on your website
As Designers, we rarely start designing something from scratch. It’s fun to build something from the ground up, but in reality, we make improvements on existing products, don’t we?
I collected quick and easy methods that you can use to check and improve your website usability.
So before you go all out and do a full-blown usability test, make sure you check these first.
#1 Check your color contrast
Low contrast makes it hard for users to distinguish text from the background. This makes text harder or impossible for them to read.
You can look up the exact rules in the WCAG Guidelines.
Use a tool like WebAim.org to check the contrast of your copy and buttons against the background. This step helps your users, especially:
- People with color blindness
- People with special visual conditions
- People with inadequate end devices
Adjust your colors to make your product more readable and accessible.
#2 Enhance readability
Research shows, that only 16% of users read a web page word by word. 79% of people scan a page and pick out individual words or sentences.
How can we help users to do that?
First, ensure a large enough font size and line-height. For example, use SEOptimer.com to check your website.
It’s hard to generalize what you should use because it depends on the font that you are using.
A general best practice is to use 16px for the body text. It is about the same size as the printed text in a book, which makes it pleasing for our eyes to read. A line height of 130–150% of that is ideal.
You can use a visual calculator like Type-scale.com. It helps to ensure sufficient contrast between your body text and headlines.
Make sure you don’t use long passages of body text. Break it up with clear and meaningful headlines, highlighted keywords, and bullet-point lists.
You can also find a great, in-depth guide about web font sizes here:
📝W3-Lab: Website Font Size Guidelines
#3 Reduce cognitive load
Sounds complicated — it’s not.
We know all the dusty corners of your web pages — we spend a lot of time there!
It is hard to imagine how users feel when they consume our content for the first time.
So, what’s cognitive load?
Cognitive load is the user’s brain capacity to understand and process information. So basically, it’s the user's RAM.
If we overload users with information, their user experience and performance will suffer. They might not be able to achieve their goal.
Ok, but how much is too much? Surely, our users are high-end machines that can process a lot and not some outdated 90s gadget?!
Well, that is hard to say in general (Depends on your target group)
But be sure, less can never hurt.
Especially younger or older audiences have limited working memory capacities. They are easily overwhelmed by videos that play on their own (who wouldn’t be?)
(And yes, cognitive load theory is where the famous 7+/- 2 rule comes from.)
Now that’s out of the way — where are my quick wins now?
- Remove automated objects like automated sliders (don’t get me started), auto-playing videos, flashy Text, auto-playing audio…
Basically, anything that is out of the user’s control should be eliminated. Users need to be in control of actions, always. (Ok, maybe Gifs are an exception;)
- Remove unnecessary fields from your forms.
- Reduce the number of options. Hick’s law states that more options = more difficult decisions.
- Focus on one action per page: Don’t promote too many different things on one page.
- Focus on consistency: Buttons and Links should have a consistent style across the page. Once underlined, always underlined.
Here you can find more information about cognitive load:
📝Nielson Norman Group: Minimize Cognitive Load to Maximize Usability
📝 Smashing Magazine: Reducing Cognitive Overload For A Better User Experience
Summary
Usability is good when all user groups can use a system to accomplish their goals. Hence, remove things that are unnecessary and make the rest as readable as possible.
I wrote a related post about UX mistakes to avoid, you can read that here:
Further Reading
📝‘What’s in it for me?’ and other user questions you must answer by Azza El Arabi
📝 Nielson Norman Group: How Users Read on the Web
📝Mark Schenker: Designing Content for Readability, Legibility, and Clarity
