Why whitespace is so important

Why whitespace is so important

Whitespace, also known as negative space, is a powerful yet overlooked tool that can take your designs to the next level if used correctly.

But what is it? Well, in it’s simplest form, whitespace is the spacing between different elements, whether it be between the actual sections of the page, or the spacing between paragraphs.

Negative space increases readability.

The majority of internet users don’t read, they scan. With so many people scanning content, we want to make this as easy for our users as possible. Good use of whitespace helps the reading experience and ability to pick out the most important key points.

Just by increasing the leading of text (space between lines) can make a great improvement. A general rule of thumb is to keep the leading no less that 160% of the font size. For example; if your font size was 20px, your leading would be 32px.

Compare the paragraphs below. The content and font size is the same, but the leading and padding are different. Which is easier to read?

Version 1

Startup accelerators are traditionally tough places where long hours are worked and everyone is keen to show that they’re ‘killing it.’ With demo days looming, few people stop to consider the mental health implications of operating in the high-pressure tech world.

Version 2

Startup accelerators are traditionally tough places where long hours are worked and everyone is keen to show that they’re ‘killing it.’ With demo days looming, few people stop to consider the mental health implications of operating in the high-pressure tech world.

 

Creating the right tone

The correct use of negative space can communicate elegance and luxury. Here’s an example from Mark Boulton showing the difference with whitespace in a direct mail.


Mailer Examples
source: alistapart.com

We can clearly see a difference in how each design comes across. The one of the left feels cheap and overcrowded and the one on the right is the opposite, feeling luxurious and calm.

Using Whitespace to Increase Conversions

Every website has elements that are more important than others. Call to actions are probably one of the most important elements on any webpage. We can use whitespace to emphasise these principal elements by removing, or spacing out any competing visuals within their proximity.

Take for example the two diagrams below. Because of the added spacing around the CTA button on the right, it gains a more visual impact.

Call to Action spacing

Final Thoughts

Aside from the practical benefits of a clean, uncluttered website, whitespace can be a very potent tool. Readability, tone and conversions are just some of the things that can be enhanced if we use whitespace as an active element.

Do you use Whitespace?

If your answer is no, then you need to start. Our website redesign team makes sure all your pages includes the best elements for consumer engagement and the perfect appearance. If you want to make an enquiry for our web redesign services, email us at chris@bravelittletank.com or call us on 0333 121 2013.