White Space Tips

Megan HunterTips, Tornado

White Space and Why It Matters

What’s the first thing that comes to mind when you think of white space? If you’re like most people, you think of it as if it’s a blank sheet of paper waiting to be filled. But in reality, white space in the design of your website serves its own important purpose. It’s not wasted or empty space. It’s not even “white” space in the literal sense, as it can be any colour at all.

White space occupies the area in the margins, between images, between lines of text. And far from waiting to be filled, it carries its own power and purpose.

The Power of White Space

Legibility

Ever been intimidated by large chunks of small text in one space? So have your users. Areas of white space between and around paragraphs of text make the experience of reading easier and more enjoyable. That means happier users, and happier users will stay on your site longer and be more likely to make a return visit.

User Interaction

Your visitors come to your site with a specific purpose in mind. White space helps minimise clutter so they can zero in on what they want to do much faster. By placing some strategic white space around a call to action, you can subtly draw your users’ attention to it. Just think about what the Google homepage looks like and you’ll understand what we mean.

Focus and Attention

White space serves as a guide for your users, prioritising what to look at so they’re not overwhelmed. It prevents them from getting distracted as they scroll through your content. You can choose specific focal points that you want them to notice and structure some white space around these.

Branding

The way you use your white space says a lot about who you are. Large amounts of white space can give a feel of minimalism or luxury. (Take a look at the way white space is used on the Apple homepage, for example.) In general, small amounts of white space signal that your purpose is to provide information, much like a newspaper.

Considerations When Using White Space

Macro vs Micro

There is a difference between macro and micro white space. Macro white space occupies the space between large elements of your design. Micro white space exists between words and lines of text. It’s important to have the right balance of both kinds of white space.

Content

You might be tempted to cram as much content as possible onto your page. After all, you want to provide your users with as much information as possible when they first land there. Unfortunately, this can work to your disadvantage if your site looks too cluttered and busy. Give some serious thought to the most important elements you want visitors to notice, and focus on these, instead of overwhelming them with lots of content all at once.

Balance

There’s no one right answer for how much white space a website design should have. You have to consider your brand, your audience, and your content. Too little white space may overwhelm your visitors, while too much can make your site look spare in content.

Despite appearances, white space packs a hidden punch when it comes to grabbing and holding your audience’s attention. By letting it speak for itself instead of filling it with content, you can give your users a positive experience that they will be glad to repeat.