WebAIM - Web Accessibility In Mind

E-mail List Archives

RE: Skip Navigation

for

From: Jukka Korpela
Date: Jul 22, 2002 11:38PM

John Foliot wrote:

> Even in crummy old HTML3.2 you could go:
> <a href="#content"><img src="spacer.gif" height="1" width="1"></a>
>
> <a name="content>Content here</a>
>
> works in just about everything.....

Except in those situations where it is really needed. :-) But your
forgetting to include an alt attribute was of course just a casual slip.
However, there's a problem with the _optional_ attributes that you included,
height and width. The problem is that some graphic browsers (well, at least
IE with default settings) shrink the alt text to the dimensions specified,
when the image is not displayed (e.g., because automatic image loading has
been turned off). This means in this case that the alt text wouldn't show,
defeating the purpose of a "skip navigation" link in this browsing
situation, and causing confusion. It wouldn't hurt in many other situations
where such a link would be useful, of course.

(Why would anyone need "skip navigation" links if he is using a graphic
browser? Well, to skip navigation and to reach the content proper! Those
links are not _only_ for the blind. For example, a person with perfect
eyesight might suffer from cognitive problems, like difficulties in
recognizing the structure of a page from its visual presentation, including
the separation between "standard navigation" of a site and the content
proper of a page. Actually, I think most of us face such situations, on
sufficiently complex pages.)

Thus, I'd advice against using height and width attributes for links like
this; the only thing you could win is some marginal efficiency, but there's
a lot to be lost. Naturally, this means that the image itself should be a
transparent 1 by 1 pixel GIF. And for reasons associated with popular
graphic browsers, it's perhaps best to include the attribute border="0" into
the <img> tag; no matter how deprecated it is, it is the most effective way
of preventing "normal" people that use "normal" browsers in "normal" mode
from seeing a colored border around the single-pixel image.

Finally, my ceterum censeo: "Skip navigation" links are a workaround, not
the solution. Use them only if you have first considered and rejected (for
some good reasons) structural solutions that do not create the problem that
those links are intended to solve. At the simplest, put "navigational links"
at the _end_ of a page, or use just _one_ contextual link, which points to
an index page, where you can insert all the navigation you want. As a more
complicated approach, put the links at the end _and_ use some CSS that
suggests (using CSS2 positioning) that they be _visually presented_ at the
start of the page.

--
Jukka Korpela, senior adviser
TIEKE Finnish Information Society Development Centre
http://www.tieke.fi
Phone: +358 9 4763 0397 Fax: +358 9 4763 0399







----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/