Designing at a Click:
Provide Context
Purpose: Organization of information within a web
page must be clear to the user. Use of graphics and text to provide
context clues will ensure that your users can easily navigate through
the site. The principle addressed on our web page will be the use of
consistent layout of graphics and text to aid navigation.
A good web site is easy to navigate. Designers should use navigation
bars or consistent text and symbols that allow a user to go to any
page in the site or return to the main page without using the web
browser back key. By designing clear navigation aids, the user will
be in control and not feel lost or trapped in the web site. On long
web pages, users can use anchors to navigate the web site without
relying on scroll bars.
This is a navigation bar which has internal links
to the top of this page and to the Activity section of the
page.
Look for these characteristics in a navigation
bar.
- Links to all pages on the web
sites
- Locate navigation bar on same place on each
page
- Use the same bar for each page
Other navigation aids include drop down menus,
graphics arrows and text, and clearly identified links.
Examples:
- This site uses a consistent black bar across
the top of each web page that acted as the directory for the
site.
- This site applies the principle of consistent
and predictable placement of its navigation bar across the bottom
of each page.
- This site was chosen for its
consistent use of a drop down menu for easy navigation. It is
consistently located in the same place on all pages in the
site.
- This site does not consistently use a
navigation bar and has dead ends.
- This site has few navigations
aids at all.
- This site demonstrates
inconsistent use of a navigations aids.
Authors: Ann Gartner and Maria Pantoja
(7/12/2001)
Activity: Evaluation of Web Page Navigation
Aids
Look for these characteristics in a navigation
bar.
- Links to all pages on the web
sites
- Locate navigation bar on same place on each
page
- Use the same bar for each page
Other navigations aids include drop down menus,
graphics arrows and text, and clearly identified links.
Select the example and evaluate the ease of
navigation. You will need to use the browser back key to return to
this page. Select good example if the web page evaluated demonstrated
the principle of consistent layout of graphics and text to aid
navigation. Select poor example if the web page lacked clear
navigation aids
Feed Back
Good Example:
Sorry,
this site was chosen as an example of a poor demonstration of the
principle of consistent layout of graphics and text to aid
navigation. Notice that after the home page of the site, no graphics
or text allowed for navigation. Each page was a dead end.
Poor Example:
Congratulations!
Your evaluation is correct. This is a poor example. Notice that after
the home page of the site, no graphics or text allowed for
navigation. Each page was a dead end.