Improving Navigation Accessibility
The Priority 2 recommendations cover site accessibility as well as page accessibility. These recommendations also give usability improvements. One of the key areas is that navigation between pages must be accessible and easy to use.
Web Accessibility Initiative Guidelines
This page explains how to meet:
- Guideline 13.1:
"Clearly identify the target of each link."
- Guideline 13.2:
"Provide metadata to add semantic information to pages and sites."
- Guideline 13.3:
"Provide information about the general layout of a site (e.g., a site map or table of contents)."
- Guideline 13.4:
"Use navigation mechanisms in a consistent manner."
Reasons for following these recommendations
The ability to navigate between pages is essential. A consistent navigation system makes it much easier for people to navigate the site, determine their current position in the site, and find the content they want.
The only universally supported method of linking is the
<a href="link"> tag.
all have alternatives, or some pages may become
Providing a site map or table of contents also increases the likelihood that a search engine will index more of the site, by providing more links to follow.
Adding metadata to pages can provide information about the author, copyright, revision history, keywords and so on. Due to abuse in the past, most general search engines ignore these attributes. However, local search engines can use them very effectively.
Link text must make sense out of context. The ability to skim a
document by links, or get a list of links, is part of some browsers.
If the link text identifies the link target even out of
context, then it improves navigation speed. Therefore, link text
'click here' should never be used. It also makes it
more useful to search engines, as some use the text of a link
to give ranking on those words to the target page. This Google search for the
words 'click here' gives an interesting consequence of this
If you do not have a way to start on any given page and go to any other page (for example, if your pages have no links apart from an index page which links to them all), then users coming in to the site at the wrong point may be unable to navigate at all. Pages using frames for navigation are especially vulnerable to this.
How to improve the accessibility of navigation.
Meta-data can be added by the use of
<meta> tags. They have a
name and a
content attribute. Any legal name may be used, but you
should pick a consistent set for your site. In addition, the
<title> tag should be used to give
a title for the page. This title should be unique on the
site, and should be readily identifiable in a list of titles
(as many browsers use for bookmark lists).
In Dreamweaver, you can add meta data by using the Meta icon in the Head tab, and the page title can be typed in to the Title box.
For ideas on meta data to store, you could read the Resource Description Framework specification.
Meta data (apart from
<title>) is usually
ignored by general search engines due to widespread abuse in the past.
However, it may be useful for the construction of specialist search
Link text must make sense out of context. A link such as
the above is far better than one that said
'to find the Resource
Description Framework click
here'. Also, bear in mind that your users may not be
using a mouse to navigate. Rephrase sentences until you can
make sensible link text. Also, try to keep the link text
Never use 'here' or 'click here' as link text, as it is useless out of context, and the latter assumes a mouse is being used.
If it is useful to have a link with more context than it can have
in its own text, you can use the
title attribute to give
additional context. You can add titles to any tag in Dreamweaver by
going to 'Edit Tag' and looking in the
You can use the Link Context Checker which will display each link on a page out of context to assist assessment.
Design the site so that any navigation structures appear on every page in the same place and behave consistently from page to page. On any site with more than about ten pages, include a site map or table of contents that is linked to from the other pages on the site.
Make sure that links can be distinguished from body text. The default styles allow this easily, by underlining and colour change. Make sure that links can still be spotted on a page at a single glance. Make unvisisted and visited links appear different, if possible.
To aid usability, keep to the convention of blue unvisited links. You may decide to use different colours, but you should never use blue for visited links, nor purple for unvisited. Also, avoid using blue or underlining for non-link text in graphical media. The conventions for visited links are less strong, but a different colour should be used. Purple, or a pale blue are common choices for visited link colours, which will increase user familiarity.
Most aspects of navigation cannot be checked as accessibility checkers view each page individually. However, some checkers will detect link text that may be too short to have good contextual information. There may also be checks for the presence of meta data, but these cannot check for appropriateness.
A useful way to check navigation usability is to get a third party to try to find information on the site and watch where they look for the information. Avoid giving them hints, or you will get less information about your site's usability.
Some browsers have the ability to generate a list of links. Opera 7 has the option to produce a list of links (in the navigation menu). There is an extension to Internet Explorer 5 that includes link listing. IBM Home Page Reader allows the browsing of a page by using the tab key to read the link texts in order. Alternatively, you can use the link context checker to generate this list.