Whitespace Is Our Friend
Whitespace, also referred to as negative space, is just what its name suggests: “empty” space within a design.
But don’t let that concept fool you. Although whitespace is an absence of anything, it’s an integral, classically overlooked aspect of Web design.
Why is it important?
The core idea is that the key elements on a page – images, headlines, paragraphs – need breathing room to increase their impact; their readability and the overall feel of the design as a whole. Imagine shopping at a store where all the items, signage, and displays are placed overlapping on top of and next to each other. As unpleasant an experience as that would be, the same negative effect can be applied to a website.
The use of whitespace can do many things, but perhaps most importantly, it provides consistency in the spacing of elements, which improves overall readability. Let’s take a look at a few applications of good and bad whitespace use.
Less distraction = more consumption
Elements need space to breath, and when they get that space they are easier to distinguish from one another, creating less eye distraction and enabling the user to better consume the information.
In the following example, we’ll look at the spacing of a few blocks of copy. With the proper amount of margin and padding, the elements are allowed the space they need to be most effective. Then, we’ll look at the same copy blocks with little whitespace, and you’ll see that the congestion makes it more difficult to tell where one section ends and another begins. This makes it harder for the user, which could result in the user deciding not to read it at all.
The same rules apply to text. In the first example, margin and padding were used to increase whitespace in the layout. When it comes to text, leading is used to achieve similar results. By creating space between headings, paragraphs, and lines of text we can increase readability and thus message consumption.
Challenges
At times, designers are required to fight for whitespace in their designs. Sometimes clients feel as if they are paying by the pixel – they want to attempt to cram as much content on the screen in as little space as possible. Often times, this is due to the belief in the mystical “fold” that all “important” content should be above, or it’s a lack of prioritizing the importance of the content (Note: it can’t all go at the top.). As designers, it becomes our job not just to act in our clients’ best interest, but also to help educate them on the values of good, clean readable design.
You wouldn’t want to shop in a cramped store, so why would you want to view a cramped website?
Whitespace is our friend – even if you don’t see it, its still there to help you out.
