I get asked a lot about white space. Seems like public interest in art and design is higher than I’ve ever seen it. More people know more about these terms. Web design clients come better prepared with the words to make their requests clear. But there’s one question that always comes up about white space.
Does there have to be so much of it?
Let’s take the next step and learn why many web designs are so full of space.
White Space Makes Content Easy to Read
Messages typed in all capital letters catches your attention, but the letters and words kind of blur together. There’s a reason books aren’t printed in all caps. Capital letters stand out partly because of their different shapes, but also because of their height, which creates white space above the lower case letters. White space shows you the shape of familiar words. Without white space, readers lose the visual clues that help them understand the text.
White space is the little holes in letters and words, but it’s also the wide open spaces around the paragraphs, headlines and images. This white space causes trouble. I’ve heard designs described as plain, empty, stark, cold or wasteful. Yet renowned designer Jan Tschichold described white space as “an active element, not a passive background.” Macro-level white space gives order to the layout, drawing important elements out, distinguishing them by its surrounding presence. And those precious reader eyeballs require space to rest. White space helps readers discern one group of information from another.
Think about it this way. In music, white space is the silence or the quiet moment that makes the chorus sound even better when it comes crashing back in. What would the guitar solos be in “Good Times, Bad Times” without the pauses just before? The pause is an active element providing contrast and valuable space from the other parts.
White Space Makes Content Look Rich
More white space means less of everything else. White space puts value on its contents. You can tell something’s quality when it stands alone.
Walk through the mall and pay attention to the shopping bags. The fancy shops hand their customers solid color bags with the logo printed simply in the center. Would a Tiffany box be the same if it had a paragraph describing its contents and a stick-on coupon for returning customers? High end cell-phone makers don’t need to offer you ten kinds of phones or tempt you with packages of extras. People line up for just the phone, packaged in a simple, slim box.
Clutter and density, as in a discount store, visually discounts the items by crowding them together. Low quality content on the web is baked into a crust of offers, ads and other distractions to squeeze value from minimal effort. Sure, you can see every option at a glance in these stores, but none of the options stand out. You’ve gotta stare at the wall of savings for a while to figure out if there’s anything worthwhile. By giving your web design elements white space, you immediately tell the customer what’s good enough to look at.
Even if you’re not a luxury consumer brand, chances are you want cleanliness, simplicity, openness and professionalism in your web design. Allow white space to emphasize the quality of your products and services while it cleans up distractions and focuses your customers.
When White Space Isn’t Right For You
Sometimes, white space isn’t quite the right solution. Some situations demand a denser layout. Think about news websites, database portals and web-based interfaces for technical software. No need to look rich or premium there. And a large white background with minimal text won’t satisfy an audience looking to scan data quickly. Effective designs use white space to serve the web page’s function. While liberal use of white space works for effect on a homepage or other entry page, interior pages can fill out with more text and pictures.
Think back to your college commencement ceremony. Two speakers take the majority of the time. The first is your commencement speaker, maybe a local business leader or politician. Maybe Oprah. They speak in measured sentences, stop for dramatic pauses and focus on one or two key points they want everyone to leave the room with. The slower rate of speech and careful breaks in the sound are white space around these key points. Compare the speaker with the name-reader. They carefully announce everyone’s name as they cross the stage. Each name is really only relevant to the student and his or her family. Names are read rapidly, but clearly. There’s a lot to get through, so the speaker pauses only to take a breath or start a new section. The name-reader uses less white space than the speaker, but keeps just enough to serve the purpose of their speech.
Does there really have to be so much white space? You kind of can’t escape it. Without white space, web designs are hard to read. Without white space, web designs look cheap. White space brings simplicity, focus and professionalism to your business’s online home.
Now that you know how white space works in web design, why not audit the design of your current site? Take our website self-audit today to see how your design and content hold up to today’s standards: