NHS Designs

Definition
prox·im·i·ty
noun
closeness; the state of being near

Design Principles
Proximity

1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12

Page 10: Web Page

The simple principle of proximity can make web pages easier to navigate by collecting information into logical groups. Check any web site that you feel is easy to get around in - you'll find information grouped into
logical clumps.

example 30

The information on this page is muddled.

Look at the site links just under the title. Are they all equal in importance? In the arrangement above, they appear to be equal in importance - but realistically they're not.

 

I have to repeat myself: Intellectually, you already know how to use proximity. You already know how to collect pieces of information into their appropriate groups. All you need to do is transfer that skill to the printed page. Use space to define groups of elements.

example 31

I moved all the site links into one column to show their relationships to one another.

I set the quotation farther away from the main body copy since it's not directly related.

I also used the principle of alignment: I used flush-left alignment and made sure each element lined up
with something else.

 

Here are the two examples again, side-by-side for comparison:

examples 30-31

 

Next...

1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12

Source: The Non-Designer's Design Book by Robin Williams


ABOUT MRS. PEDERSEN · EMAIL MRS. PEDERSEN
resources · copyright information · Website designed by
Order a Custom, Watercolor Pet Portrait at PetsByDawn.com
>