Let’s talk about “nothing”. How can some empty space be important when everyone says to focus on content.
Adding “whitespace” to a design (aka “negative space” or “empty space”) is the art of leaving enough room between elements, and letting them breathe.
Before we dive deeper, let’s look at an example:
Do you notice the whitespace?
Remove that, and you get a cluttered layout:
Many factors come into play to create a good design (fonts, colors, branding, formatting, usability, personality etc.), but whitespace is a great tool for:
- obtaining a cleaner design (more elegant and modern at the same time)
- make text paragraphs more readable (compare texts in the before & after screenshots above)
- guiding users on the page (by bringing pieces of content “into focus”)
- increasing click/tab target areas (especially important on mobile devices)
- emphasizing the most important elements (more whitespace around an image, the more it stands out)
A common concern is that adding too much space at the top of the page causes important content to go lower (“below the fold”) and require scrolling.
Today’s scrolling and browsing habits have changed. I recommend reading this excellent article on the topic: “Life Above and Beyond the Fold”.
And here’s why “People don’t scroll” is a myth.
How do you get a clean website design?
Choose a modern website theme/template or get a developer to tweak your existing site’s CSS code, to add more breathing room between page elements where appropriate:
- increased paddings and margins around elements
- larger line-height for blocks of text (at least font-size * 1.5)
- more space around images
You might feel you have too much content to “afford” adding whitespace (because you wrongly consider it to be a waste of screen real estate), but don’t forget that overwhelming visitors with too much information can affect your results: visitors get confused by all the options, click on a less important element or sometimes even abandon the site.
So whitespace is part of a bigger picture: SIMPLICITY.
Next action: (re)read my entire in-depth article on “Embracing minimalism in your photography website”. Even if you’re not fond of white backgrounds or “flat graphics” (because that’s not what it’s all about), you’ll at least get a better sense of what you should focus on and what other photographers are doing.
