← All terms
Glossary

tabindex

The HTML `tabindex` attribute controls whether and in what order an element receives keyboard focus when the user presses Tab. Only three values matter: `0` (focusable, in document order), `-1` (focusable via script, out of Tab order), and a positive integer (almost always wrong).

Also: tab indexAlso: tabindex attributeAlso: keyboard focus order

Detailed explanation

Native interactive elements (`<a href>`, `<button>`, `<input>`, `<select>`, `<textarea>`) are in the Tab order automatically. `tabindex="0"` adds a non-interactive element (a `<div>` acting as a button) to the Tab order. `tabindex="-1"` removes an element from the Tab order but lets JavaScript focus it (useful for managing focus inside dialogs, error summaries, or roving-tabindex widgets).

Positive `tabindex` values (`tabindex="3"`) override document order and almost always cause WCAG 2.4.3 (Focus Order) failures. The W3C ARIA Authoring Practices Guide recommends never using positive tabindex values in production HTML.

How this applies to Shopify stores

AccessComply detects positive `tabindex` values across the storefront and flags them as 2.4.3 violations. We also detect missing `tabindex="-1"` on dialog containers, which causes screen readers to lose focus when modals open.

Primary source: html.spec.whatwg.org