RE: A question on bypassing a group of links

Jim Thatcher: <quote> 
The most common skip link technique is providing a link to an empty named
anchor <a name="content"><a> or <a id="content"><a> or even <a 
id="content"
/>. That technique does NOT work in IE6 with the keyboard as one of the
first skip links at http://wwww.acb.org illustrates. (Remember to tab one
more time after executing the skip link.) However I have come up with a
counter example to that statement. http://westciv.com has a visible skip
link at the top of the page. The target is an empty anchor. It works from
the keyboard. To make matters worse, when I saved westciv.com locally
without their style sheet, the skip link did not work with the keyboard -
which I would predict. When I downloaded the style sheet and attached it -
the skip link did work - which baffles me. This is a mystery to me and if
anyone can figure it out - I would love to here. 
</quote> 

Becky: 
I don't have any answers but a few observations.
The skip link doesn't seem to work correctly at all in Mozilla with the 
keyboard.  What I see in Mozilla is that tabbing to the "Skip to Content" 
link and pressing enter,  I am brought to the orange "S" graphic on the 
right hand side of the page rather than the content when the file is local 
or "live".  With the page downloaded locally running without the 
stylesheet the behavior is the same - although the orange square "S" 
graphic is no longer positioned on the right. 

I see the same thing as Jim in IE 6 - the "live" page and local page with 
a stylesheet works properly.   I tab to the "Skip to Content" link, press 
enter and I am scrolled to the main content.  Pressing tab again takes me 
to the "Style Master" link within the main content.   Without the 
stylesheet IE exhibits the known problem when using a named anchor - tab 
to the "skip to content" link, press enter, tab again and focus is back on 
the "skip to content" link. 

The style for the div containing the <a name="content">westciv</a> link 
is:
#maintext {
                BORDER-RIGHT: #091c5a 1px solid; BORDER-TOP: #091c5a 1px 
solid; 
                MARGIN-LEFT: 0px; BORDER-LEFT: #091c5a 1px solid; WIDTH: 
500px; 
                MARGIN-RIGHT: 0px; BORDER-BOTTOM: #091c5a 1px solid
        }

If I remove this from the stylesheet IE behaves the same as Mozilla - the 
next link when I press tab is the orange square "S" graphic.  If I remove 
the right hand side section of the document (that contains the orange 
square "S" graphic) from the local html, IE and Mozilla behave the same, 
pressing tab after the "skip to link" correctly takes me to the "Style 
Master" link in the main content.  This is because this is the next 
physical link in the document (the orange square "S" is gone).  It still 
doesn't answer the question why this link works at all in IE, though. 

-becky 



Becky Gibson
Web Accessibility Architect
                                                       
IBM Emerging Internet Technologies
5 Technology Park Drive
Westford, MA 01886
Voice: 978 399-6101; t/l 333-6101
Email: gibsonb@us.ibm.com

Received on Friday, 9 July 2004 12:55:59 UTC