Purpose and content model
Tabindex affects whether and where an element participates in sequential focus navigation. Autofocus requests initial focus when the relevant context is presented. Accesskey supplies a shortcut hint that the browser maps to platform-specific key combinations. These attributes alter navigation, so use them only to support a clear interaction model.
Native links and controls already provide useful focus behavior. Adding tabindex to every paragraph makes a page tedious to navigate and does not improve its semantics. A logical DOM order usually produces a better keyboard path than assigning positive numbers to force a separate order.
Syntax and working example
<h1 id="result-heading" tabindex="-1">Search results</h1>
<!-- After a deliberate search update, a script may focus this heading. -->Supported attributes and behavior
Tabindex=0 places an otherwise appropriate element into normal sequential order; tabindex=-1 allows programmatic focus without the usual Tab stop. Positive values create an explicit priority order and are generally best avoided. Autofocus is boolean and can move focus on page or dialog presentation. Accesskey is a list of character hints, not a guaranteed keyboard shortcut that works identically on every operating system.
Another practical pattern
<dialog aria-labelledby="dialog-title">
<h2 id="dialog-title">Rename a draft</h2>
<label for="draft-name">Draft name</label><input id="draft-name" autofocus>
</dialog>Accessibility and browser notes
Unexpected autofocus can bypass introductory content, move a screen reader's position, or open a mobile keyboard. Positive tabindex can produce a focus order that differs from the visible and reading order. Accesskey combinations can conflict with browser or assistive-technology shortcuts and need discoverability.
Common mistakes
Tabindex does not turn a div into a button or implement Enter and Space activation. Do not place tabindex on dialog itself. Removing outlines without an equivalent visible indicator hides the user's current position. Focus must not disappear when content updates.
Verify your implementation
Navigate the complete page with Tab and Shift+Tab, then compare that order with the visual reading sequence. Test programmatic focus after opening, closing, deleting, or filtering content. Verify autofocus and shortcut behavior on actual mobile and assistive-technology environments.
Standard status and sources
Standard; browser availability must be checked independently of specification status.