PROXIMITY
The Principle: Group related items in close
proximity. For example, group a header with its following paragraph more tightly
than with the preceding paragraph. When you lay out numbered and bulleted lists,
consider grouping them so that there is more space between the items than within
elements. Think about how to bring related graphics objects together in ways
that make them appear to be a group.
Common Mistakes: The number one beginner's mistake is to
fill up all of the available space. Art historians say this is evidence of
horror vacui, fear of negative space. If you're used to publishing in print,
forget the old rules about cost; page space is cheap on the web. Make it your
friend.
- Proximity refers to the distance between elements on a Web page and ......
- how the elements relate to one another.
- These elements include text, navigation, headings, and so on.
- Generally speaking, elements that are close together appear to
have a stronger relationship than elements that farther apart.
- Remember the Contrast rule when considering proximity.
Fairly straightforward |
Proximity makes it much easier to follow. |
| This recipe card includes all the details that one might
need to prepare the food, but the ingredients are set just above the
preparation instructions, and the whole card is generally unappealing. |
By contrast, the use of alternate fonts and colors works to
separate the headers from the rest of the document. Notice how the
ingredients have been moved away from the instructions -- the blank space
in the card is used to separate the directions from the ingredients. |
|