Whitespace is Your Friend

Whitespace can be a controversial topic between designers and clients, especially when designing a new website.

As professional designers, we love whitespace. On the other hand, sometimes clients don’t share our love, preferring to fill space with vast amounts of content. We understand where they are coming from but sometimes less really is more. Allow me to explain.

In this post, our goal is to outline why whitespace is so beneficial and how it can improve the overall effectiveness of a site, without the need to compromise the client’s business objectives.

It’s one of the fundamental techniques used not only in great website design but in great design across the board.

website-design-sample

An example of using whitespace, subtle colour and nice imagery in design

What is whitespace?

Let’s first start by defining what whitespace is. Often referred to in the design industry as ‘negative space’, it is the space between the images and information. Whitespace doesn’t always have to be white. Often, it can be a different colour or texture, but in essence, it’s blank space within the design that doesn’t include any content. The purpose of whitespace is to create a balance of space and information to help the reader avoid ‘visual congestion’ and ultimately dictate whether the main messages are delivered clearly or not.

It’s easy to understand why some clients, marketers, publishers and even other designers believe whitespace would be better used to promote their services or products, but with the recent trend in viewing websites on mobile devices(tablets and smart phones) users are happy to scroll and slide to keep following the path of the content they are consuming. The whitespace helps this flow and keeps visitors on your site.

website-design-sample

Zara display a great example of whitespace within ecommerce website design.

Lets look a little deeper into how whitespace can be used to benefit a website.

Used well, whitespace can completely change a website for the better, bringing with it numerous benefits. Aside from the obvious aesthetic benefits, it can also have a positive impact on the effectiveness of a website.

Better legibility

One of the most noticeable benefits of using whitespace in a body of text is it helps increase legibility. Reading line after line of content without a break makes it difficult for the reader to engage and hold concentration, whereas a good use of whitespace can make a significant difference, helping with focus and ease of reading.

Increase the reader’s attention to a specific point

Whitespace can be a very effective way of drawing the reader’s attention to a particular element within the site. The most obvious way to increase prominence to a highlighted point is to make it bigger, but whitespace can do the job just as effectively.

Create a tone of voice

Whitespace can act as a dynamic way to communicate tone of voice. When The Designery went to task on our new website, we wanted to convey a professional and charismatic tone; one of the ways we achieved this was by incorporating whitespace.

Better understanding

The use of whitespace between paragraphs and blocks of copy can increase understanding of what is being communicated. According to an article published by humanfactors.com in 2004, whitespace can increase reader comprehension by almost 20%.

website-design-sample

Plenty of whitespace combined with sharp imagery.

We really believe that whitespace can and should play a pivotal role in any good website design, not only enhancing the site aesthetically but also increasing it’s overall effectiveness. Furthermore, we believe that graphic designers and clients can work in harmony, with mutual agreement on getting the right balance of whitespace, imagery and typography to achieving the site’s overall business objectives.

More blog posts: