HTML tabindex: Put some links last without complete enumeration

Posted by Emanuel Berg on Server Fault See other posts from Server Fault or by Emanuel Berg
Published on 2012-11-24T21:50:50Z Indexed on 2012/11/24 23:05 UTC
Read the original article Hit count: 408

Filed under:
|

I know I can use the HTML anchor attribute tabindex to set the tabindex of links, i.e., in what order they get focused when the user hits Tab (or Shift-Tab).

But, I have a home page with tons of links, and to enumerate all those is a lot of work.

The actual case is, I have four image links that by default gets index 1, 2, 3, and 4 (well, the behavior is equivalent, at least). But, I'd much rather have the first non-image link as number 1. Check it out here and you'll understand immediately.

I tried to give the first non-image link (the link I desire to have tabindex 1) - I tried to give it tabindex 1 explicitly, hoping that it would cascade from there, but it didn't (i.e., the first image link got implicit tabindex 2).

I also tried to give the image links ridiculously high tabindexes, but that didn't work: as the other links didn't have tabindexes at all, those highs were still "first".

As a last resort (the solution currently employed) I gave the image links all tabindex -1. That makes for logical tabbing, but, it is suboptimal, as those image links are excluded from the tab loop - a user tabbing away will probably never realize that the images are clickable. I'd like them to be reachable with tabbing, but last, after all the ordinary links.

If you wonder why I'm so determined to achieve this, it has to do with my own finger habits: I almost exclusively search for links, tab back, tab forth, etc., and very seldom using the mouse.

Note: I'll accept a script to change the actual HTML for a complete enumeration, if you convince me there is no "set" way to solve this problem.

© Server Fault or respective owner

Related posts about html

Related posts about tab