As website viewers, we typically don’t read content, we scan it. Who has ever experienced the sudden discomfort of a blaringly cluttered website? I think it’s safe to say everyone has. One second you’re searching Google to find the perfect recipe, and the next moment the link you clicked on, with great anticipation, appears, screaming at you in a splattered collage of words and images. It’s all you can do to click out of there quickly as possible.
To ensure you never commit such an offense to your own website visitors, pay attention to the whitespace in web design. Whitespace is the “empty” spaces of a website — clear of all text, pictures, graphics, etc. These spaces can exist between lines of text, between columns, surrounding images, in margins, and throughout menus. Essentially, if there is a part of your web page left unmarked, it is whitespace.
Simple layouts are more appealing to the eye than complex layouts. In order to minimize elements that distract from a website’s objective, remove excess content from the page. Perhaps some content would be more appropriate on a different page, or perhaps, after asking, “What is this element’s purpose?” you realize some content is better off removed completely. An organized website will utilize whitespace effectively. Organization brings about a more pleasant user experience because it draws attention to specific areas of the website that are calling for attention, causing viewers to focus on what is most important.
Too often the value of whitespace is diminished. Right now, any misconceptions you have lingering about the value of whitespace, lock those away. These refreshing spaces are used to:
Use white space to create visual hierarchy within the text; let it show the readers what the need-to-know is. The size of type should correlate to the space available around it. Consider this for gaps between lines of text as well, so each sentence is more easily digested. This is so important that Human Factors International conducted a study, and the results showed whitespace between paragraphs and in the margins increased reader comprehension by nearly 20 percent. Another tip, let these spaces rid the website of overcrowding and information overload. Think of it this way, will a salesperson be more successful when loud and in your face, or will a salesperson be more successful when welcoming and presenting a clear, concise message. Most websites are for-profit in one way or another, so design a website that approaches visitors how you would like to be approached.
10 Pound Gorilla designed this web page for Pivotal Innovation. It clearly shares the company’s message and is easily scannable. The whitespace is not actually empty space, but it helps to tell a little bit more about the company, visually, as it leads the viewer’s eyes to the down arrow where they can continue to view more of the site.
Google is an excellent example of successful use of whitespace. There are hardly any actions available on the site (unless you have a login), so it’s clear to the viewer the purpose of Google as a search engine. Completing the call-to-action is intuitive, and there is an organized hierarchy of content on the page.
Too much space relays a message that a website is lacking content, and not enough space is a burden on the eyes. Ask the team at 10 Pound Gorilla to help you design a perfectly balanced website that is sure to boost web visitor interaction and conversions!