Over the past 20 years of working in design, I’ve had many discussions, and several stormy arguments, with developers, product owners and even board members, about whitespace.
(In case you are wondering what “whitespace” is, it is the space between design elements, such as blocks of text, a table or an image. The space doesn’t have to be white. It just has to be empty.)
To be fair, most discussions I’ve had have not been about whether whitespace is needed, but how much of it is needed! It’s one of the eternal conflicts between techies and designers. One side often wants to cram as much information and functionality onto the screen as possible to allegedly increase productivity and the other side wants a beautiful, clean space for the eye to rest a microsecond and more easily move around. This improves legibility and helps users to more easily understand the content (even if the consequence is that users have to scroll more).
Allow me to provide an example: Imagine the inside of a house. On the floor, there is maze of furniture and storage elements with just a narrow path to get from one room to the next. All of the walls are filled with shelves and pictures. The cabinets and closets have no doors. Everything is very well ordered and efficient, but densely packed into every available space. If your house were like this, you could probably move into a much smaller home! But would you really want to live there? Without any smooth surface to rest the eye, would it be a place that brings you joy or peace? If you were forced to live in a place like this, it just might drive you crazy. That’s because the human psyche craves a certain measure of “nothingness” to appreciate what is actually there. Perhaps this is why the baroque went out of style 300 years ago.
In today’s digital era, many of us spend as much time – if not more – looking into the screens of our devices as we do looking at our surroundings. And also here, in the digital realm, we need some empty space to make our interactions with computers more pleasant and more productive.
Compare the two schematic examples below, the first with a bare minimum of whitespace and the second with more generous whitespace:
Now compare a post from this website (upper image) with a mock-up in which whitespace as been reduced to a minimum (lower image):
Which would be your preference?