The Effective Use of Links
Your Web Site is a Hierarchy of Links
|
|
A web site consists of a series of documents that are strung together using links that take the visitor from one document to the next. If you draw a dozen boxes on a piece of paper and think about how they can be interconnected, you will soon discover that you can organize web sites in a number of different ways. In general, accessibility is enhanced when you use links to organize the pages of a web site in a clear, branching hierarchy with cross links kept to a minimum.
The main menu of your web site should include the base of each of the main branches in this hierarchy so that a visitor to the site can quickly switch from one branch to another. This menu of links should be duplicated on all of the basic information pages in the web site so that it is easy to move to the base of a new branch from any page in the site. The menu should stay in the same place and look the same everywhere it occurs. You are now in the Resources branch of our District Web site. Currently, the hierarchy of pages in this branch is as follows.
Resources
Help with Accessibility
Design & General Considerations
Setting the Stage for Web Page Presentation
The Friendly Use of Links
Allowing the Web Reader to Skip Standard Menus
Lion Tales
How to Identify an Experienced Lion
You can move up and down in this hierarchy, or you can move to its root, Resources, at any time, but cross links to other pages in the web site are only provided when there is closely related material that the reader of the page is likely to find immediately useful.
This approach makes it easy for a blind person to navigate the site using a web reader. When the content of standard menus change, or where there are lots of cross links among numerous pages, getting lost in a maze of links is easy and returning to a particular piece of information on your web site is much more time consuming.
|
|
Make Links That Can Be Taken Out of Context
|
|
Web readers provide blind users with alternative ways of organizing and reading links. One of the most useful and heavily used, is simply a complete list of all the links that occur on the active web page. One can run through these links very quickly and select the desired link provided that the anchor for the link, the bit that's underlined or lights up, provides enough information to identify the significance of the link. A link of the form "Click here for more information," is rendered as "here" by a web reader and so provides no clue as to its purpose. To know what this link is for, a blind visitor has to read the whole of the web page and then momorize the position and meaning of the link in order to use the web reader's links menu the next time the page is visitesd.
To avoid causing such inconvenience, use descriptive anchors, such as "For more information about the Lions, click here."
|
|
Use the TITLE Attribute to Identify Graphical Links
|
|
Sometimes, when you move your cursor over an image or a link, a small box opens up to explain its function. This message is produced by the TITLE attribute, a bit of HTML code that is used to augment other commands, such as those for incorporating images and anchors into a web page. Web readers can read TITLE lines and this is particularly useful when the link is in the form of a graphic image.
On this page, if you place your cursor over the Clubs icon at the base of the menu, a title message will appear. The code that generates this message is:
‹A HREF="../clubs.html"› ‹img src="../ClubIcon.gif" border=0 alt="clubs icon and link to club locations and meeting times" title="CLUBS ICON AND LINK TO CLUB LOCATIONS AND MEETING TIMES"› ‹/a›
Here, the "alt" attribute displays text if the gif image can't be displayed, while the "title" attribute displays the text box when the link is passed over. Web readers can read both "alt" and "title lines.
|
|
When To Specify a Tab Order Amongst Links
|
|
If you have a complex page structure, or one that contains many links, you want to specify the order in which read by web readers. For example, web readers take things from top to bottom and then from left to right. If your page was constructed within the framework of a table and you decided that you wanted your menu in the right hand column of the table, a web reader would read the entire contents of your web page (and the links it contained) before it read out the main menu, a particularly big problem if it were your home page. You can mitigate this problem by specifying the exact order in which you want links to be read by web readers.
To specify set the tab order of the Clubs link to "11", you would add the following TABINDEX attribute command to the language provided above:
‹A HREF="../clubs.html"› ‹img src="../ClubIcon.gif" border=0 tabindex="11" alt="clubs icon and link to club locations and meeting times" title="CLUBS ICON AND LINK TO CLUB LOCATIONS AND MEETING TIMES"› ‹/a›
Details governing the TABINDEX attribute can be found at Blooberry.com.
|
|