White space or negative space is the area between the elements of a design. This space doesn’t need to be white in colour and can help transform a website completely. Gone are the days of the web where you need to squash all of your content into a small space. The mythical user that refuses to scroll or click on your website is a thing of the past and with it we need to embrace white space.
White space is an incredibly powerful tool for the designer to help create a usable, legible, focused and modern online experience. We all need space to maneuver in life and the web is no different. Making elements with enough space around them not only helps to draw your eye towards them, but also makes it easier for you to interact with them. White space also helps to make your text more legible. When text is pushed on top of itself it can be incredibly hard to digest and readers will easily lose their place jumping between the lines. It makes reading take a concerted effort but with a little space to breathe, your content can sing.
Negative space can help you to direct your users through a certain path. Our eyes get distracted by clutter or visual noise, so deliberate use of space can help to draw the eye in.
Below you’ll find some examples I’ve found of white space at it’s best in web design;
Actual ‘white’ space
White space with photography
White space with colour
White space for products
White space on blogs for legibility
White space has become so important that Firefox has developed a plugin called ‘Reader View’. With the flick of a button you can view any page online and transform it into something clean, clear and legible.
Clever use of negative space can help a website be more user friendly, easier to read, more enjoyable to interact with and memorable. No matter what the function of your website, don’t be afraid of white space because it is not your enemy.