Das Attribut tabindex bestimmt, ob ein Element den Fokus bekommen kann und an welcher Stelle der Tab-Reihenfolge es steht. Es wird an das Element im Markup geschrieben und nimmt eine ganze Zahl auf.
- tabindex
Das Attribut, das bestimmt, ob und in welcher Folge ein Element den Fokus bekommt.
Beispiel: „Das Dialogfenster bekam tabindex gleich minus eins, damit das Skript den Fokus hineinsetzen kann.“Die Reihenfolge, die daraus entsteht, ist die Tab-Reihenfolge.
Bedienelemente wie Links, Schaltflächen und Eingabefelder sind von sich aus erreichbar und brauchen es nicht.
Welche Werte tabindex kennt
Drei Fälle. Der Wert null macht ein Element erreichbar und belässt es an seiner Stelle im Markup. Ein negativer Wert nimmt es aus der Reihenfolge heraus, erlaubt aber, den Fokus per Skript hineinzusetzen.
Ein positiver Wert zieht das Element nach vorn, vor alles ohne positiven Wert. Das ist der Fall, der in der Praxis Ärger macht.
Warum positive Werte bei tabindex Ärger machen
Weil sie eine zweite Reihenfolge neben der des Markups aufmachen. Sobald irgendwo eine Eins steht, springt der Fokus dorthin, bevor er oben beginnt, und jedes weitere Element muss sich einordnen.
Das ist bei einer Seite noch zu überblicken und bei einem Baukasten mit vielen Bausteinen nicht mehr. Deshalb lautet die verbreitete Empfehlung, ausschließlich null und minus eins zu verwenden.
Wofür tabindex gebraucht wird
Für Bedienelemente, die aus Elementen gebaut sind, die von sich aus nichts können. Wer eine Schaltfläche aus einem Kasten baut, muss sie eigens erreichbar machen und dazu die Tastaturereignisse selbst behandeln.
Der zweite Fall ist die Fokusführung in Dialogen. Dort wird der Fokus beim Öffnen hineingesetzt und beim Schließen zurückgegeben; das gelingt nur, wenn das Ziel den Fokus annehmen darf.