W3C home > Mailing lists > Public > w3c-wai-ig@w3.org > January to March 2014

Re: Semantic implications of tabindex="0"?

From: Ramón Corominas <listas@ramoncorominas.com>
Date: Wed, 15 Jan 2014 21:31:10 +0100
Message-ID: <52D6F00E.5030203@ramoncorominas.com>
To: Bryan Garaventa <bryan.garaventa@whatsock.com>
CC: w3c-wai-ig@w3.org
Thank you for the clarification, I obviously missinterpreted the 
tabindex="-1". I had previously tested without any tabindex and it did 
not work, butt I see now how it must be used :)

Cheers,
Ramón.

Bryan clarified:

> Actually tabindex="-1" should be used for this purpose, since it ensures 
> that the static element such as a heading never appears in the tab 
> order, but will always be programmatically focusable using the .focus() 
> method.
> 
> 
> ----- Original Message ----- From: "Ramón Corominas" 
> <listas@ramoncorominas.com>
> To: "Adam Cooper" <cooperad@bigpond.com>
> Cc: "'Karl Groves'" <karl@karlgroves.com>; "'Mike Elledge'" 
> <melledge@yahoo.com>; <w3c-wai-ig@w3.org>
> Sent: Tuesday, January 14, 2014 5:12 AM
> Subject: Re: Semantic implications of tabindex="0"?
> 
> 
>> Indeed, there are situations where it can be useful to set a 
>> tabindex="0" in a heading or other element...
>>
>> For example, if you want to jump to a specific heading, it is 
>> sometimes safer to use tabindex="0" and then focus() than simply href 
>> to the heading's ID, especially if you are showing a dialog box or 
>> some kind of content that is initially hidden when you activate the 
>> link. The simple <a href="#whatever"> will not work because the 
>> content is hidden and the anchor doesn't exist, but if you show the 
>> content and then use focus() the jump will work fine. In this case, 
>> you can use a sequence like:
>>
>> 1. show content
>> 2. save current tabindex
>> 3. set tabindex="0"
>> 4. focus()
>> 5. restore old tabindex
>>
>> Thus, the focus is moved to the heading, but the element will be no 
>> longer focusable, so it is less confusing if the users continues tabbing.
>>
>> With this technique I've not experienced this "phantom forms mode" nor 
>> the "editable" issue (I've not tested in IE 11, though).
Received on Wednesday, 15 January 2014 20:31:53 UTC

This archive was generated by hypermail 2.3.1 : Tuesday, 13 October 2015 16:21:50 UTC