White space seems to be one of the most misunderstood and controversial topics between designers and clients. To both parties, it can seem like a very simple concept: white space is empty space. But the full implications of that are difficult to understand and implement properly. Let’s break it down a little bit.
As a designer, I’ve always struggled to explain the difference between white space and a white background. I recently watched a video by John McWade, a real pioneer in the design world, who gave an excellent description of what white space really is.
McWade explained that white space = silence. When listening, moments of silence are necessary. There are pauses in music. The greatest comedy relies on moments of perfectly timed silence for the audience to “get” the joke.
Moments of silence are necessary for all of our senses, sight included. White space gives the viewer a chance for their eyes to rest, to fully take in and appreciate all of the other elements.
Still scared of white? “White space” doesn’t have to be white. It can be any color, even a texture. Black is especially dramatic, like in the image above. Really, white space is just areas where there are no other elements.
5 Reasons to Use White Space
White space increases legibility. Check
out this example. Both sides have the same amount of text and are set in the
same font. But by adding some extra spacing between the letters and between
each line of text, the right side becomes easier for eyes to focus on and read.
(Don’t worry, it’s filler text, you aren’t supposed to be able to actually read
- White space leads to higher comprehension.
Studies have actually shown that when there is more white space in a design,
viewers understand what it is they are looking at much more quickly and easily.
- White space holds your viewer’s attention
longer. Because your site is easier to read and understand, viewers are
more likely to read more and stay on your site longer. If they have to work
hard to read the text or understand what it is they’re looking at, your viewers
will go somewhere else.
- White space can add emphasis. Instead of
making elements bigger, surrounding them with white space is a great way to add
emphasis. This technique isn’t used nearly as often as it should be, so it’s a
great way to make your site stand out.
- White space looks intentional. Believe it or not, designing with a lot of white space can be very difficult. So when you see a good design that features a lot of white space, you know that every single element was specifically chosen and placed with a great deal of attention.
For some more examples from John McWade, check out his video:
In the meantime, don’t go too far! In my next blog post, we’ll talk about the implications of using white space in print media (because as we know, print is not dead!)