Clean Website Design – More White Space

Clean Website Design - More White Space - BloggingTutorial.NetUnless you are a talented artist or graphic designer we can pretty much guarantee that both your site and your posts could use a little extra white space. We know this because 99% of ALL sites could benefit from a more white space. White space is simply the empty space on your site. It improves legibility, creates a sense of elegance, and brings balance to your site design.

More importantly, white space entices readers to read. And without readers your blog is just a fancy diary.

Embracing White Space

Why Blogs Don’t Have Enough White Space

It is almost impossible to maintain a good balance of white space on a blog because many competing priorities are working against you. Readers don’t always look at what is below the fold (or not immediately visible on their computer screen), so you have to squish everything up towards the top to make sure it gets noticed. There are many important, fun, and useful things to put in your sidebar. So its understandable that we pack it so tight it looks like luggage on the way home from a big vacation. Admit it, most people barely have enough time to write posts much less to edit and format them after the fact.

But luckily creating white space doesn’t have to be a time-consuming chore.

Quick Ways to Create White Space on Your Blog

  1. Break up posts with headlines (H1, H2, and H3 tags).
    Edit before you publish. Draft #2 should be at least 20% shorter than draft #1.
  2. Mix up paragraph sizes. Follow a chunky paragraph with a single sentence paragraph. Or even a single word.
  3. Format your content. Use shortcodes (if your theme supports them) or use the TinyMCE Advanced plugin on any WP blog.
    Keep the sidebar lean if it doesn’t HAVE to be there, take it out.
  4. Use images in your posts.

Great Blogs With White Space

Marian Librarian is an excellent resource on social media and is also a great example of a design with a lot of clean white space. The color scheme is subdued, there is a lot of open space in her design, and she breaks up her content with images, headings, and bullets.
Clean Website Design Example MarianLibrarianDOTcom - More White Space - BloggingTutorial.Net

This is not that blog is a personal favorite and an excellent example of a minimalist design. What is missing from the top of the page? Navigation. Not needed so its not there.

Another hysterical and brilliant minimal blog is xkcd which is almost entirely white space with a clever navigation scheme modeled on a tape player (for those of you old enough to know what that is).

Clean Website Design Example xkcdDOTcom - More White Space - BloggingTutorial.Net

But to be clear white space doesn’t equal blank. Smashing magazine is a very busy site loaded with advertising and navigation, and yet it works because of very careful attention to spacing and proportion. However, since you and we don’t have the design team on hand that they do, managing a site this full while maintaining white space would be challenging (i.e.,. don’t try this at home).

Clean Website Design Example SmashingMagazineDOTcom - More White Space - BloggingTutorial.Net

Let’s start clearing the clutter of our website. We all need to do this now and then. Like the vegetable crisper, we forget what we’ve put in there, and some of it isn’t edible anymore. Take a few minutes of your precious time to look at your site or a recent post and pick one thing that doesn’t need to be there anymore.

Leave a Reply