Discover why white space is so important!
Graphic designers have this incredible knack for giving things names. Even for the smallest, seemingly invisible design elements.
From calling the space between letters ‘kerning’. To the incredibly bizarre word of ‘Skeuomorphism’ which describes the art of designing a digital element to look like a physical world replica.
In fact, graphic designers have even gone so far as to give a name to an area void of any design elements: white space.
Also known as negative space, white space refers to an area of a design that has been intentionally left blank. It’s the space between different elements including images, copy and other graphical components.
But don’t let the name fool you! Just because it’s called ‘white space’ does not necessarily mean this space is white. It can be any colour or pattern that’s intentionally blank or used to create a feeling of space.
Now, whilst I have poked fun at the oddity of naming things in the design world, I have to admit white space is incredibly important.
Why? Because white space can sometimes feel as though it goes against logic. Therefore, it can require a lot of faith from clients.
Leaving white space can feel like a designer is telling you to leave an empty space on a website, or leaflet, or advert. A space that could be filled with information. Something else that helps to promote your brand.
Yet, when used right, white space can change the world.
Ok – I admit it. Saying white space can change the world does sound like a massive hyperbole. But believe me when I say it’s not.
Let’s dive back to the wonderful world of 1998.
Freddos cost 10p. B*Witched had just released that classic song C’est La Vie. And a little search engine start-up in California called Google decided to take on the big boys of the internet.
In fact, I remember when we first got an internet connection when I was a kid. It was in the pre-Google days. The dark days.
I remember loading up a web browser (internet explorer, obviously) all excited. “Yay! I’m going to use the internet for the first time ever!” young James said to himself. And then… nothing. No idea what to do. No idea where to go.
It’s amazing looking back to those early days of the internet and how challenging it was to navigate around. Now, we’re so reliant on the services offered by the likes of Google that it is difficult to imagine a world without it.
And one (of the many) success that led to Google’s rise was, you guessed it – white space.
When you take a look at some of the early search engines, you can understand why.
Here’s AltaVista – perhaps one of the biggest search engines of the early internet:
Notice the amount of information you are presented with?
Here’s Yahoo! – who also maintained a decent market share of the search market:
Once again, the amount of overbearing information you’re presented with. Pushing other services like Yahoo Games.
And finally, you had Lycos:
Yet another search engine with an incredible amount of information presented.
The problem with all these search engines is that they overwhelmed users. There’s so much unnecessary information, you can barely see the search box. They wanted you to stay on their website, so they littered them with links in an attempt to keep you there.
In comes Google. Smashing the doors downs. Ripping out all that useless information. And delivering to people what they want. A tool for discovering new websites.
And look at the amount of white space it used! And it’s still true to today. Go to Google.com and all you get is a logo and a search bar.
It’s all you need after all, why complicate matters further?
As a result, Google has become a perfect example of when white space is used correctly – when empty space – can bring business success.
There is a logic to using white space in design. And it really did change the world!
Now you understand the wonder that is white space – what are some of the reasons a graphic designer might decide to use this design element?
We’ve talked previously about the importance of improving readability on a website.
These tips, such as breaking up large blocks of text, go hand in hand with using white space.
In order to improve readability, the reader needs to be able to scan across the content. Titles, text blocks and other information need to have distance between one other to encourage the reader to find the information they’re looking for.
This also helps improve the legibility of the content, research has shown that white space being used in between paragraphs and text blocks can increase reading comprehension by almost 20%.
And that’s quite a sizeable improvement for such a small change.
Improved focus & attention
What do you think the average time people spend on a website is?
A couple of minutes, maybe?
It’s actually 15 seconds.
Now, that isn’t a long time to capture someone’s attention. So, designers need to use everything in their toolkit to grab attention and improve focus on relevant information.
Part of this is using less to say more. Focussing on one key message and drawing attention to it.
White space helps achieve this by reducing any additional visual distractions. And reducing visual distractions is key to keeping the user focus.
Let me should you an example. The Yale School of Art. Part of the University of Yale.
Now, I know what you’re thinking.
“Yale School of Art? Surely they’ll have an amazing website”.
Let’s be honest. It’s a bit of a mess.
And one of the reasons why it looks a mess is the lack of white space. The font is all crammed together. The colours are all fighting for your attention. You don’t know where to look.
There are too many visual distractions. It isn’t possible for users to focus on one key message.
Adding white space will help separate out the design elements. Giving focus and attention to key messages and important information.
Creating balance & hierarchy
Hierarchy is key for design. It helps tell the user what information is the most important. What information they should pay attention too. And it makes the information easier to understand.
Effective hierarchy in design is usually built around three elements:
• Colour & contrast
• And, surprisingly, white space
White space plays such a vital, but misunderstood, role in creating balance and hierarchy. It gives the most important information the breathing space to get a message across.
Think of it this way. A call-to-action on a design needs to be seen. If a user doesn’t see it, there is no chance they will action it.
Now, would a call to action be more noticeable with reasonable space around it? Or if it was crammed in the middle of lots of other visual elements or words?
This is why white space is important. It allows the right information to be noticed.
Increasing visual appeal
How your design looks goes a long way to showing how reputable your brand is. In fact, we once covered how the design of a website is one of the factors people subconsciously use to judge the credibility of a company.
Now, white space occasionally gets confused with minimalism. And minimalism isn’t necessarily what your brand is looking for. After all, we don’t all want to look like Apple!
But white space isn’t about minimalism. It’s about spacing the right elements in the right way. Giving key information breathing space. Allowing it to be seen.
When used correctly, white space adds an element of finesse to your designs. It allows your marketing materials to look elegant, consistent, and natural.
Apart from graphic designers giving a name to everything, what have we learnt? White space is essential in developing an effective design.
It allows for key messages to be comprehended by users. It helps add a sense of credibility and professionalism to brands. And it improves focus and attention for users.
Empty spaces in designs aren’t something to be scared of. They’re incredibly valuable in their efficiency at getting key messages across. And when key messages are put across in the right way, then positive things will happen!