Design Tip: The Value Of White Space

"Above the fold" is not just a newspaper term. On the Web, it refers to the part of a Web page displayed in the browser of a visitor without scrolling. It is the most valuable part of the page - and everyone in an organization wants privileged. But, in trying to please everyone, web designers often try to cram too much within too small a space.

Remember that the value of white space. It makes your page look more attractive, professional, and readable. All are key components of a successful website!
Activate your blank

White space is a term that refers to the design of space that is not occupied by text, images, or other elements of the visible page. The amount and use of white space is a key component of legibility and readability of a page. There are two types:

      Active White Space: Space that is deliberately left blank for a better structure of the page and to emphasize the different content areas.
      Passive white space: The empty space around the outside of the blank page or within the content areas as a result of poor design.

 

A page with very little white space makes visitors feel uncomfortable because the page seems cluttered and difficult to read. Visitors get overwhelmed quickly and move to a more welcoming place. Conversely, pages with lots of white space seem empty, as if there is not enough content to fill the page. Visitors may wonder, "why bother with anything?" and go somewhere else.

If properly used, the blank is an integral part of the design of a page and a major contributor to the ease of use. The content is structured feel, it's easy to find information, and the page layout works with the content to highlight the most important information.
The design with white space in mind

So when you are designing or redesigning your page layout, consider using the active whitespace to create a consistent look. Create your own or choose a ready-made template with white space in mind template.

A good page template includes an active whitespace as an intentional element that visually separates page navigation, content, header, and footer. Visitors can predict where the areas of navigation and content will, as they jump from page to page.

Often, it is best to make your first page layout design on paper instead of coding it. Avoid the temptation to start adding site logo and "just a little content" and focus on how the individual elements combine to create the overall effect instead. When you've spent a lot of time coding example, are less likely to change - even if the page is not as great.

Consider creating shadowboxes as placeholders for content. You get a better sense of weight and contrast page without being distracted by the content.

Here's an example. At a glance, you can immediately identify areas blank white space on liability: