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).

Regards,
Ramón.

Adam wrote:

>> “As a consequence, JAWS will read "editable" for the following  <h1 
>> tabindex="0">Some heading</h1>”
> 
> Just did some testing with JFW 15 & NVDA  2013 on Windows 7 using IE11, 
> GC, FF: both JAWS and NVDA ‘activate’ a phantom forms mode (i.e., the 
> corresponding sound is played), but only in IE.
> 
> Neither screen reader announces ‘editable’ when the element receives 
> focus in any of the browsers.
> 
> Also, JAWS (not NVDA) only activates this phantom forms mode in IE11 
> when the tabindex=”0” is the first, not necessarily  focusable element 
> on a page.

Received on Tuesday, 14 January 2014 13:13:38 UTC