Development and design of web site navigation structure or interface is one segment of
web site development and design that is seldom well thought out. While reviewing sites for
the award our site presents I have seen plenty of poorly structured sites. These sites
seem to have no plan for the user to follow to easily find the information they have come
Overview of Design and Development of Web Site Navigation
Most of these sites require plenty of back button navigation that interrupts the free
flow of the user to various topics covered on the site. When reviewing sites this is the
first thing I notice as do most reviewers I'm sure.
When starting a site the first thing you should consider is the entry page. This page
should be the top of the sites navigation hierarchy. In other words you should be able to
reach all areas of the site from this page. A good practice here is to add a comment or
description of the link so the user knows that this is what they came to get.
Before I go onto the navigation on sub pages I want to discus the use of graphics and
image maps. ALL images must have the "alt" information in the image tag in
order for users with images off or text browsers to navigate the site. I have also been
told that users with text to speech browsers especially like good "alt"
descriptions because this is the only means of distinguishing a link in these. It is a
good practice to make these descriptive. This is also a good practice because some
search engines index the "alt" in the image tag.
Using images is a good and aesthetically pleasing means of navigation however, the page
shouldn't be solely dependent on these for navigation. The first so called test of a site
I do is to arrive at the site with images turned off.
Far too often this demonstrates the dependence of the site on graphics to navigate it.
Always, include text links either at the top or bottom of the page for the links in the
graphics and image maps to major areas of the site.
On the interior pages you want to continue your top navigation hierarchy using images
keeping in mind the last statement about images. Now you have to decide the hierarchy for
the page. If the page is long and divided into topics or resources I like to have a
targeted text link to each topic or resource group after a short opening statement.
This enables the user to quickly find what they have come for. From the feedback I've
received users dislike scrolling down endlessly and prefer a quick targeted jump. To do
this you use this HTML for your link: <a href="../site_dev/index.html#box> then
above the target link insert this: <a name="box"></a> you can also
put the title between name and </a> like you would on a link. The name or target
doesn't necessarily have to be on the same page as the link either. This makes targeted
links an excellent form of navigation.
There you go a well laid out site that enables the user to quickly find what they came
for. To finish the inner page navigation I would suggest a link to the top of the page and
placing your text links to the top hierarchy at the end of the page or article. This makes
moving to the next area of interest easy and the link to the top makes for easy navigation
of that particular page.
As always, when it comes to site development or promotion I'll repeat those immortal
words "have a plan and work your plan" the results may surprise you.