A Look Into The Effective Use Of Whitespace In Design

Get our posts emailed to you with our monthly newsletter, subscribe here.

There are a plethora of techniques and styles to use when creating a new website design or printed design, today I wanted to focus on the use of whitespace in design and the positive effect it can have for your brand and user experience.

What Is Whitespace

Whitespace is the empty spacing separating or surrounding each design elements on a page or website. As an example the space between page elements such as images and text, the line height in the page typography and if a grid has been used the spacing between the columns.

Oddly enough the term whitespace does not necessarily mean actual white spacing but rather actual blank, empty areas between page elements – in other words nothing.

The Effect Of Whitespace

Using whitespace is a great way to let your content breathe and provide the user with a great experience. By utilizing whitespace effectively whilst setting up your page typography you can make the type much more readable and improve how the content flows through a page.

If you use a grid structure whilst designing, you should experiment with various different column and gutter sizes to see how more spacing can help enhance each design element on a page.

Using whitespace correctly in your design can help to make your content become much more legible and prominent, it can also help improve the content flow and convey an image of elegance and sophistication.

Effective Use Of Whitespace In Design

Below are some awesome examples I collected that demonstrate the effective use of whitespace in design, some of the designs use whitespace in their typography, others use it to space their page elements out and others use big grid based design to allow the content to breathe. Whitespace is design often goes together with minimal style – if this kind of style is something you enjoy, you might also want to check out our article about 30 Fantastic Examples of Minimalist App Design on our website.

Coworking & Shared Space in US

whitespace in design

Job Manager – Dashboard

whitespace in design

HUB60 Homepage

whitespace in design

Bamboo Charcoal

Bebank

Mood Fabrics

whitespace in design

Piq Social

whitespace in design

Content Universe

whitespace in design

HoneyPot

Minimal Product

whitespace in design

Aerospace

whitespace in design

Podcast App

whitespace in design

TBC Bank

whitespace in design

Mobile App

whitespace in design

Trackr

whitespace in design

 

Posted by Jason Bayless

2 Comments

  1. Good web design with bad writing is not a winning combination. Your repeated use of two perfectly good, standalone sentences connected by a comma is totally wrong. Just make them into two separate sentences.

    1. Hi Paul,

      Thanks for your feedback. I have removed the comma in question.

      Thanks.

Comments are closed.