Web surfers are basically an impatient
bunch and if a website is hard to figure out because
the links are not obvious, they will click away never
to return. Website navigation is one of the most crucial
elements in determining the effectiveness of a website.
This article discuses the basic principle of designing
website navigation.
To be effective website navigation must first and
foremost make sense to the average person. While there
is always room for creativity, well-designed websites
tend to have similar navigation layouts.
As a web designer you must always keep in mind the
basic purpose of the website and the intended audience
when designing navigational elements. Most websites
exist to either inform the visitor about a product
or service or to actually sell the product or service.
Therefore there are some basic guidelines to follow:
Make sure all navigational elements are clearly links
by using standard conventions for links such as buttons,
menus, underlining the text or changing color on mouse.
Resist the temptation to use clever or ambiguous names
for links.
When using non-conventional links, explicitly tell
the visitor that this is a link. For example, suppose
you design a web page where you want to use a map
showing several different cities and want to let the
user click on the city name to pull up information
about that city. Just make sure you tell the user
to click on the city name to get more information
about that city.
Remember the “Three Click Rule” that
most professional web designers use. Studies have
shown that most users will not click more than three
links to get to the information they want. So every
page on your website should be reachable within three
clicks.
I do not recommend using a flash movie or other type
of splash page on your website. Keep the web page
design simple yet attractive. But if you do decide
to use one, make certain you use the META REFRESH
tag to take the visitor automatically to your home
page after a few seconds and provide a clickable,
clearly marked button or link so the visitor can skip
the entry page and go directly to your home page otherwise
a large percentage of visitors will just click away
never to return. Remember most visitors are looking
for information not entertainment.
Navigation Element Locations
Top Menus – a top of the page menu bar is usually
located directly below the page header graphic that
contains the site logo. These menu items may be single
links, drop down menus, or expanding menus. Each menu
item can be represented by a graphic or just text.
In ether case a hyperlink is associated with each
item that the visitor can click on to get to the information
described.
Left Side Navigation – left side navigation
is typically implemented as either a column or text
area on the left top portion of the webpage. Like
the top menu, each item can be a single link or an
expanding menu.
Right Side Navigation – right side navigation
is not used that often, but when used, it is implemented
as a column or text area on the top right side of
the webpage. Most designers use this area for advertisements
rather than site navigation.
Bottom Menus – bottom menus can be either a
menu bar or footer. Menu bars use either graphics
or text links while footers almost exclusively use
text links.
Important Navigation Elements
Internal Page Links – Every page on the website
should be within two or three clicks from the home
page. Important pages should be ONE click away. The
type of website will determine which links are more
prominently displayed.
Login Boxes – login boxes should be prominently
displayed. Common locations are top left, top right
or inside the page header.
Shopping Carts – if you use a shopping cart
to sell your products, you should prominently display
a view cart button on each page. The most commonly
used location is the top right side just below or
as part of the header.
Order Buttons – if you use individual order
buttons they should be large and visible. The fewer
clicks it takes to get to your order page, the more
orders you will get.
Breadcrumbs – breadcrumbs are both links and
a graphical representation of where you are in the
site. Breadcrumbs are usually located at the top left
of the page just under the header. Each word is a
link back to the previous page. They are in the form
Home-> Articles-> Marketing
External Links – external links can be used
anywhere but are most frequently used inside the text
areas on a website. They may be references to more
information located on another site, to recommended
products, or to almost anything else.
Advertisements – advertisements are usually
either a graphic or text with an associated hyperlink.
Ads can be placed anywhere on a webpage but are usually
used just under the header banner, down the right
hand side of the page, under navigation elements on
the left margin, across the bottom of the page or
even interspersed within the test areas of the page.
Studies show that ads “above the fold”
are more effective.
(“Above the fold” refers to the area of
a webpage that is visible without having to scroll.)
Downloadable Items – if you offer downloadable
items such as audio, video or pdf files, make sure
that you tell the user haw big the file is and whether
they need an application to use the file. If they
do an application, provide a link to the application.
For example, provide a link to the free Acrobat reader
if you offer pdf files.
Site Map – A site map is a good way to layout
your entire site for your visitor. (Search engine
spyders like them too.) It is just a hierarchical
listing of every page on your site with a clickable
hyperlink to that page.
Summary
A good navigation system can increase the numbers
of pages viewed by each visitor. This in turn can
increase signups, customers, sales, members or whatever
it is your site is designed to do and make your website
more successful.