Let’s Chat

Understanding the Power of White Space in Web Design March 19, 2015

White space (also known as negative space) is a term used to describe the spatial relationships between objects on a page (regardless of the colour). Effective use of white space has the power to create feelings of ease, trust and luxury within your viewing audience. The term ‘Less is More’ is not just a buzz word – it is in fact, a psychological necessity.

You don’t have to travel far on the web to view the power of white space, and experience its benefits as Google is a prime example of this technique. Google understands their end user quite well and the importance usability plays in a top performing search engine. If you are to view their home page (also known as a landing page), it’s filled with nothing more than a search box and perhaps some brief content. Occasionally, Google will throw in a cute rendition of their logo celebrating global celebrations or historical events which their users have come to enjoy, but the bulk of their page and it’s purpose is kept intact and free of clutter. It’s no wonder they’ve become a globally recognized entity used in everyday language. When was the last time you said to someone, “Why don’t you Google it?”

Their success however doesn’t stem only from being one of the largest and leading search engines on the web, but because they’ve taken the time to really hone in on what matters to their users, and that is the power of simplicity, trust, and ease of use which goes into each and every product they deliver.

Think about the last time you experienced an easy to use product or made an online purchase that was seamless? Did it make you feel good about your purchase? Are you more likely to recommend it because your experience was positive? When used skillfully, white space acts as a visual signal to draw attention to content you wish your reader to focus on next. It can evoke feelings of simplicity to complex materials (such as hard to digest educational or medical journals).

I often think back to my first year of college when I studied Psychology, which was no easy task. I remember one of the books I was assigned had an online study companion filled with images, videos, tutorials, quizzes and more. They utilized the power of well structured content to enhance their product for online use (which was clearly successful because it was the only medical book I read cover to cover). In essence, they took their ordinary book and turned it into an interactive online machine, engaging their user and thus increasing the success of their paperback product.

Take a peek at the following image below and what do you see first? Without you even realizing it, what you see is being driven by your minds interpretation of the information being presented to it. Many of you may have seen these images before, but if not, most of you will see one image before you see the next, or until someone points out the image to you in reverse. In the first image some will see the man playing the saxophone first while others will see the silhouette of a woman’s face. In the second top image some people will focus on the white space and will see two people staring at each each other while others will see a vase or candelabra.  Below it, do you see a monkey in a tree or a vicious lion? and finally do you see a giant heat with hair or the back of a woman wearing a coat and  holding a purse?

Optical Illusion

Regardless of the product or service you provide, white space is an essential element that should never be overlooked in web design (as demonstrated above), can evoke interpretation in your end user without them even realizing it. Too much white space, and you risk breaking the connection between the elements causing user confusion, lack of trust, and loss of customer retention to name a few. Your viewing audience may not know what exactly it is about your site that makes them feel uncomfortable, but it’s an emotion you surely want to avoid.

User confusion occurs when your website is in a state of chaos or clutter. Clutter can be defined as an abundance of visual stimulation on a page with little to no white space, which distracts and derails your user. Occasionally some less than honest sites will purposefully create imbalance as their intentions are to force the user into making spontaneous purchases (which ultimately results in buyer remorse and failure to retain return customers), but that leads into another topic all together.

Because our working memory is limited, large amounts of written data back to back is hard for our memory to process as our cognitive resources are limited. Too much information and/or misinformation results in processing overload and cognitive dissonance can occur (especially if it goes against your end users belief of what is true). Triggering this emotion will increase the likelihood of your end user’s distrust with your site, product and/or service – and once your down, many companies simply cannot recover themselves without thorough research to undo what’s been done and that can cost a lot of money.

These are just a few examples to summarize why white space plays an important role in everything we create on the web. It helps to alleviate that information or content overload. Whether real or perceived, white space has a detrimental psychological effect on the usability and is a key player in the success of your website.

We Work with Awesome People