WebMaster Solutions
Web Site
Design
Web Site
Navigation Systems 101
by Kenneth Catto
While you should
design your website to be aesthetically
pleasing, beautiful graphics and clever little
details are no substitute for a good navigation
system. No matter how great your website looks,
it will be useless if your visitor can't find
their way around your site.
Traditionally the
navigation menu is placed just below the header
area or on the left hand side of the web page.
Usability studies have shown that web site
visitors instinctively look in these areas
first.
Wherever you
decide to place your navigation menu, remember
that consistency is important. The most
important thing is to place your navigation menu
in the same spot on every one of your web pages.
If you use an image to represent a navigational
button, use the same image and the same color
for that image on each page of your website. For
example, if you use an image of a green house in
the left hand corner of your web page as your
"Home" navigational link, use the same green
house image in the left hand corner of every one
of your web pages to designate the "Home" link.
Your visitor
should be able to find what they are looking for
within 3 clicks of your home page. This is
usually not a problem for small sites. However,
if you have a large site with many pages, you
will need to design a navigation menu that
provides access to all areas of your website
without getting your visitor lost or confused.
You may want to
use a bread crumb trail type of navigation
system for large sites (Homepage > Category >
Subcategory > Content). Another option is to use
a dynamic menu that changes according to the
page your visitor is, but be aware that search
engines may not be able to spider sites using
dynamic menus.
Usability studies
have shown that a navigation menu should contain
no more than 8 links. The more choices a user is
given, the more difficult it will be for them to
make a decision. Also, if you have many links,
your visitor may get the impression that your
site is complicated and difficult to navigate.
If you have only a
few links, use mouse rollovers to visually
enhance your website. You will need to add some
JavaScript that pre-loads the rollover images
and then add "onMouseover" events to your image
links. Alternatively, use CSS for text rollovers
that change the link color when the mouse cursor
hovers over a link.
Navigation links
should be considered the most important part of
your website for two reasons:
1) They are used
by your visitor to find content on your site.
2) They are used
by search engines to spider your site.
The reason users
visit your site is to get information. If
visitors can't find the information they are
searching for, they will click away, perhaps
never to return again.
While different
search engines have different rules on how they
spider and rank a site, basically a "bot" or
"spider" will visit a site, search for a "HREF"
link and follow the links to other pages,
indexing the pages as it goes along. If the "bot"
or "spider" doesn't find a "HREF" tag on a page,
it is blocked from going any deeper into the
site. As you can see, you need to design your
navigational system so that a search engine can
spider all pages of your website.
When designing
your website, take the extra time to design a
good navigational system. It is vital to your
success!
Recommended Reading
|