From HTML WG Wiki
Changed Attribute: "tabindex"
The "tabindex" Attribute in HTML 4.01
Source: The HTML 4.10 Technical Recommendation
tabindex = number CN::This attribute specifies the position of the current element in the tabbing order for the current document. This value must be a number between 0 and 32767. User agents should ignore leading zeros.
The tabbing order defines the order in which elements will receive focus when navigated by the user via the keyboard. The tabbing order may include elements nested within other elements.
Elements that may receive focus should be navigated by user agents according to the following rules:
- Those elements that support the tabindex attribute and assign a positive value to it are navigated first. Navigation proceeds from the element with the lowest tabindex value to the element with the highest value. Values need not be sequential nor must they begin with any particular value. Elements that have identical tabindex values should be navigated in the order they appear in the character stream.
- Those elements that do not support the tabindex attribute or support it and assign it a value of "0" are navigated next. These elements are navigated in the order they appear in the character stream.
- Elements that are " disabled do not participate in the tabbing order.
In this example, the tabbing order will be the BUTTON, the http://www.w3.org/TR/html401/forms.html#edef-INPUT INPUT] elements in order (note that "field1" and the button share the same tabindex, but "field1" appears later in the character stream), and finally the link created by the A element.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <HTML> <HEAD> <TITLE>A document with FORM</TITLE> </HEAD> <BODY> <em>...some text...</em> <P>Go to the <A tabindex="10" href="http://www.w3.org/">W3C Web site.</A> <em>...some more...</em> <BUTTON type="button" name="get-database" tabindex="1" onclick="get-database"> Get the current database. </BUTTON> <em>...some more...</em> <FORM action="..." method="post"> <P> <INPUT tabindex="1" type="text" name="field1"> <INPUT tabindex="2" type="text" name="field2"> <INPUT tabindex="3" type="submit" name="submit"> </P> </FORM> </BODY> </HTML>
Tabbing keys.</b> The actual key sequence that causes tabbing navigation or element activation depends on the configuration of the user agent (e.g., the "tab" key is used for navigation and the "enter" key is used to activate a selected element).
User agents may also define key sequences to navigate the tabbing order in reverse. When the end (or beginning) of the tabbing order is reached, user agents may circle back to the beginning (or end).
Changes to the "tabindex" Attribute in HTML5
Source: the 10 August 2007 Editors' Draft of HTML5
220.127.116.11. Sequential focus navigation
(Editor's Note: This section on the tabindex attribute needs to be checked for backwards-compatibility.)
The tabindex attribute specifies the relative order of elements for the purposes of sequential focus navigation. The name "tab index" comes from the common use of the "tab" key to navigate through the focusable elements. The term "tabbing" refers to moving forward through the focusable elements.
The tabindex attribute, if specified, must have a value that is a valid integer.
If the attribute is specified, it must be parsed using the rules for parsing integers. If parsing the value returns an error, the attribute is ignored for the purposes of focus management (as if it wasn't specified).
A positive integer or zero specifies the index of the element in the current scope's tab order. Elements with the same index are sorted in tree order for the purposes of tabbing.
A negative integer specifies that the element should be removed from the tab order. If the element does normally take focus, it may still be focused using other means (e.g. it could be focused by a click).
If the attribute is absent (or invalid), then the user agent must treat the element as if it had the value 0 or the value -1, based on platform conventions.
For example, a user agent might default textarea elements to 0, and button elements to -1, making text fields part of the tabbing cycle but buttons not.
When an element that does not normally take focus (i.e. whose default value would be -1) has the tabindex attribute specified with a positive value, then it should be added to the tab order and should be made focusable. When focused, the element matches the CSS <b>:focus pseudo-class and key events are dispatched on that element in response to keyboard input.
The tabIndex DOM attribute reflects the value of the tabIndex content attribute. If the attribute is not present (or has an invalid value) then the DOM attribute must return the UA's default value for that element, which will be either 0 (for elements in the tab order) or -1 (for elements not in the tab order).
Why the "tabindex" Attribute Should be Extended to All Elements
- Rationale 1
- Rationale 2
- Rationale 3
- Rationale 4
- Applicable Design Principles (proposed)
- Device Independence
Why the "tabindex" Attribute Should Not be Extended to All Elements
- Unless a user-override is provided by a conforming user agent, the user has no control nor fore-knowledge of where focus will be placed next.
- A pre-defined tab navigation order may disorient the user, by, for example, moving focus to an element outside of the user's viewport.
- If "tabindex" is applied only to a section of a document instance, it may trap the user in a closed loop, containing only those elements for which a "tabindex" has been defined.
- Authors should not be allowed to "hide" elements of a document instance by setting negative integers, unless so as to disable an irrelevant or unavailble/un-editable form control.
- Increases the burden on document authors; complicates the task of updating a document instance by integrating a new "tabindex" into the document's pre-defined navigational flow.
- Applicable Design Principles (proposed)
- Device Independence
Proposed User Agent Conformance Clauses for the "tabindex" Attribute
- "tabindex" must be a user option. Conforming user agents will:
- a) inform the user that there is an author-defined "tabindex" for that document instance;
- b) allow the user to over-ride the author-determined "tabindex" order; "tabindex" should be an option which can be chosen by an end user, not thrust upon her.
Advice From Authorities
Policies, Guidelines, and Law
- HTML: HTML Working Group's Issue List
- TableOfContents: An Index to the HTML WG's Wiki Space
- Glossary: Glossary of Terms for the HTML Working Group