Building

White Space

The use of white space in your user interface (Web page) can help to emphasize elements and improve usability. White space (also referred to as negative space) does not necessarily have to be white -- it simply refers to the open areas between the graphics and text on your web page. It is essential for providing spatial relationships and creating a hierarchy between visual items. It assists in guiding a reader's eye from one point to another.

While some designers concentrate heavily on what images or text to put in, they often can overlook what to leave out of their Web pages. A design that is to be visually appealing must also be easy on the eyes. Generous margins and clear simple layouts make it easier for the eye to work. Cluttered layouts tire the eye quickly and hinder clarity. Without an adequate amount of white space, text would be unreadable, graphics would lose their emphasis, and there would be no balance between the elements on a page.

In designing a Web page that is exciting and can capture your audience, it is important to have a layout that is crisp and attractive. Having "White Space" on your page helps to differentiate the elements and contents. White space on a page will keep a page from being clutter and distasteful. Here are some approaches of using white space on your page to catch the attention of your audience:

  • Pictures and Text should have appropriate white space (background) between them.
  • When showing a group of pictures, be sure that there are white spaces between them. Also if they are thumbnail images, they should all have the same dimension.
  • Be consistent with having white spaces
  • Limit your web page to 2 or 3 major colors and be sure to have lots of white space to make it easy on the eyes.
  • Use secondary background for different portions of your page to distinguish the types of elements on your page. See example below:
  • Put a space between the title and the body of content when using text.

Treat white space as more than just a background. Treat it as an integral part to your page design.