WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: "Skip to content" links, vissibility and keyboard users without screen readers, to hide or not to hide?

for

From: Jared Smith
Date: Sep 16, 2011 11:00AM

On Fri, Sep 16, 2011 at 9:41 AM, Paul J. Adam wrote:

> Jared what do you think about adding that code to your awesome example? Does require JS though.

I added a link to this example and to this thread so as not to muddy
the CSS3 example.

Because of poor keyboard support, keyboard-only users would rarely use
Webkit browsers, the exception now being VoiceOver users who are still
stuck with this long-standing bug.

This JavaScript hack works very well. For those that are wondering, it
sets the tabindex value of the main content to 0 (this should probably
be -1) and when the "skip" link is activated, it sets focus using
JavaScript focus() to the target. This does adequately trigger the
keyboard focus change.

I just added this to the focus scripting to the WebAIM site. You can
check out the scripting at http://webaim.org/media/scripts/main.js or
try it out at http://webaim.org/intro/. Of note is that this requires
jQuery. We also do yellow fade highlighting for in-page links, error
messages, etc., so our implementation is a bit more complex.

Jared