Skipping over navigation links tutorial
Enhance your web site accessibility providing 'Skip to Content or Navigation' links.
And from the usability for accessibility point of view, it is recommended to make such links visible.
Why? Frank Gayne at infocentre.frontend.com
"You must consider people with other types of impairments in this context also. Ask whether or not skip links would be useful for people who cannot easily use a mouse? Many of these people depend on tabbing in order to make progress through an interface and might appreciate a skip links feature to lighten the amount of work they have to do. If there is no visible focus to let these people know they have hit a link then this useful feature is lost to them." Read whole article here: http://infocentre.fr...=article&id=150 How can you build such links?
Immediately after the logo of your web site insert the skip link:
<a class="skiplink" href="#startcontent">Skip over navigation</a>
If this is done do one of the following, depending on the MarkUp Laguage you are using:1.
If you're using any variant of HTML 4, add this just before your main content:
If you are using any variant of XHTML 1.0, add this just before your main content:
<a name="content" id="content"></a>3.
If you are using XHTML 1.1, add this just before your main content:
By the way, if it does not fit in your design, you could do them also invisible as described below: 1.
Create a transparent graphic 1X1 pixels, and name it "spacer.gif". 2.
At the top of you page add this: <a href="#content" accesskey="S"><img src="spacer.gif" alt="Skip to content - (access key = S)" width="1" height="1" border="0" /></a> 3.
At the begining of your content add this: <a name="content" id="content"></a>
Another fact is, that many web sites have the "Skip Navigation" or "Skip to content" links, before the logo of the page.But is that usable?
A logo is a precursor of a web page. It lets the user know what website he/she is on. You may have internal/external links on your page. If a "Screen Reader" user clicks an internal link, your logo's "alt tag" tells the user that he/she have not yet left your website.
If the skip navigation link is before this logo, then the user does not know immediately which website he/she is on.For further reading:Skip repetitive navigation links: http://oc.nci.nih.gov/web508/tip2.html Skipping over navigation links: http://diveintoacces...tion_links.html Skip to Main Content Link: http://www.washingto...torial/ins.htmlBy John Britsios, Web Accessibility and Usability Consultant
at Webnauts Net
Edited by Webnauts, 01 October 2003 - 11:05 PM.