Skip to content

The importance of whitespace in photography website designs

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:

photo-website-whitespace-example-normal

Do you notice the whitespace?

photo-website-whitespace-example-highlighted

Remove that, and you get a cluttered layout:

photo-website-whitespace-example-crowded

 

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. 

Read the article

Off-topic or inflammatory comments may be moderated.
Please add VALUE to the web, thanks!
 

Level up your photography website
with the free guides & resources!

ForegroundWeb free resources preview

You'll get a free eBook (on photo website mistakes), many checklists and guides about improving your site's design and SEO, video recordings of website teardowns, podcast interviews, and more. Plus... fresh free articles, actionable tips and curated links from around the web - sent directly to your inbox (twice a week).