But this week EyeQuant released an exciting new feature – the visual clarity score.
What is the visual clarity score?
The EyeQuant visual clarity score assesses visual clutter on a page. The mind can only process a limited amount of information at any one time, meaning that when you add more to a page, you are not really adding more but simply diluting the prominence of what was there. Have you ever heard the saying “I can’t see the wood for the trees”?
By trying to show the user everything at once, they end up showing them nothing. The result is a higher bounce rate and lower conversion rates.
If you want to communicate a powerful message, you need to keep your page design clean, simple and free from clutter. The visual clarity score gives you a really quick, scientific way of assessing how clean or cluttered your web page designs really are.
Let’s look at a few example:
1. Cluttered Design – Lings Cars
The infamous Lingscars.com gets a visual clarity score of 0%. The EyeQuant team say that this is the lowest scoring site they have tested, and for good reason. Take a look at the scan result below.
2. Clean Design – Wholegrain Digital
Our own homepage was designed with visual clarity in mind, with a simple background and a single bold message, resulting in a visual clarity score of 86%. It could be better, but this puts it at the upper end of the spectrum for visual clarity and is a good example of an effective homepage (if we do say so ourselves).
3. Magazine Design – BBC News & Mashable
Magazine and blog websites are inherently hard to optimise for a variety of reasons. They often don’t have clear conversion goals and the design are in some ways inherently cluttered, since there is a need to show people lots of content at the same time so that they can scan through it quickly.
BBC News is respected as one of the world’s top sites but yet it scores only 13%, demonstrating just how hard it is. You need to be realistic about the type of site that you are designing, but there is perhaps even more need with this type of site to focus on reducing any unnecessary clutter as far as possible since there is less margin for error.
Very few magazine and news sites have managed to achieve a clean design, but a great example of one that has is Mashable.com. It scores an impressive 78% on the visual clarity test, which is no doubt one of the reasons why it is so often referenced as a great example of online magazine design.
4. E-commerce – Very & iTadka
E-commerce, like magazine sites, can be challenging when it comes to focussing the users attention. In this case, you have a clear goal to encourage the user to add products to their cart and purchase them, but you have loads of different products, which can bamboozle the user and confuse them to the point that they don’t know where to look or what to buy. Visual clarity is therefore both extremely important and extremely difficult to achieve.
Very.co.uk is one of the top ladies fashion stores online in the UK and t does a decent job of keeping things clean and simple, scoring a respectable 66%.
On the other hand, independent Indian grocer iTadka.com has a much more cluttered and confusing design, scoring only 35%. This is a shame because it is a great store and a simpler design could no doubt help them increase sales.
Is it all clear and simple?
The fundamental principles here are really very simple. Keep the design of your important web pages clean and simple. Focus on only displaying the most important information above the fold, use simple background images (if at all) and keep some space between each element on the page. As my friend and digital guru Simon Phillips often says – “We need more negative space people!!”
Not everyone has lots of money to spend on design or has access to a tool like EyeQuant, but just taking the principle of visual clarity on board can help you improve suer experience, reduce bounce rates and increase conversions on your website.
