Question

In IE, Firefox, Chrome and most Windows-based interfaces that I've used, the Tab key can be used to navigate from one form field or hyperlink to the next (e.g. "actionable" items) (note: I have not tested on other Operating Systems)

However Safari and Opera skip all hyperlinks in a web page when tabbing. IMHO its a usability bug but I digress.

Is there a workaround/hack to make Safari and/or Opera navigate through these links?

I've noticed that Opera will accept the tabindex attribute if set e.g. tabindex="0" thus maintaining the links "index" within the flow of the DOM on the page... but Safari does not want to accept this.

For those interested, this bit of jQuery will make all the hyperlinks tabbable.

//Make links 'tab-able' in Opera
$(document).ready(function(){
  if($.browser.opera){
    $('a[href]').attr('tabindex', 0);
  }
});

...and although this seems to work for Opera... is there a better workaround?

Was it helpful?

Solution

In Safari, it's not a bug, it's an optional feature. On the Mac, tab selects objects other than links, Option+Tab select all objects. You can swap the behavior of these shortcuts in Preferences->Advanced. Then tab will behave like in other browsers.

On Windows, Option+Tab is not available. By default tab selects objects other than links , but there is an option in Preferences->Advanced that makes tab select all objects. Then tab will behave like in other browsers.

You should probably not try to interfere with this, as you would interfere with the user's preferences.

OTHER TIPS

Actually this is a bug, according to the spec (see below) anchors (<a> elements) are supposed to accept the tabindex property, and a tabindex of 0 should make it focusable in the order the elements appear in the document.

http://www.w3.org/TR/html401/interact/forms.html#adef-tabindex

Opera traditionally thought this was a feature, not a bug (we had and have other key shortcuts for navigating links, when you know those you might find it useful to have distinct navigation for links and form elements - tried shift+arrow spatial navigation yet?). To some people it still is a feature. True anecdote: once upon a time an internal build made links tab'able by accident and this caused so many bug reports and complaints it was promptly reversed. (As far as I remember, also because the tabbing was buggy in other ways).

We know, however, that tabbing to links is something most users expect and that we should implement a pref for this like Safari has. In the meantime, you can add something like your JS fix above to a user javascript to have tab navigation to links on all websites out there.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top