Positive tabindex changes the keyboard order
What it is
One or more elements on the page have a tabindex above zero, such as tabindex="1". Keyboard users move through links, buttons and form fields with the Tab key, normally in the order they appear on the page. A positive value pulls an element to the front of that order: every element with a positive value is visited first, lowest number first, before anything else on the page.
Why it matters
People who navigate by keyboard, including many screen reader and switch users, then jump from the search box to a footer link and back to the menu, and can lose their place or miss content. The order is also fragile, since each new element needs a number that fits around the others. MDN recommends using only 0 and -1. A focus order that breaks the page’s meaning fails WCAG 2.4.3 Focus Order (Level A), and W3C failure F44 describes this use of tabindex. Since June 2025 the European Accessibility Act requires many businesses selling online to EU consumers to meet it.
How Asky checks it
Asky reads the page’s raw HTML and checks every element that has a tabindex attribute. The value is read as a whole number, and the element is reported when it is 1 or more; 0, negative values and values that are not numbers are fine. Elements inside aria-hidden="true", hidden, <noscript> or <template>, or with an inline display: none or visibility: hidden style on the element or around it, are skipped. Values set by JavaScript are not seen. One issue per page gives the count and up to 20 examples with their values.
Reported as a warning with low severity.
How to fix it
- Find the elements listed in the issue, with their
tabindexvalues. - Remove the positive
tabindex. Links, buttons and form fields can take focus without it. - For an element you made focusable on purpose, such as a custom control built from a
<div>, usetabindex="0", which keeps it in the natural order. A real<button>is better still. - If the order feels wrong without the numbers, change the order of the elements in the HTML rather than their
tabindex. A skip link, for example, belongs as the first element inside<body>. - If a plugin or embedded widget adds the values, look for a setting that turns them off, or report it to its maker.
- To leave it as it is: if the element is hidden from everyone by your stylesheet and never shown, it cannot take focus; mark the issue resolved.
Example
The search box on https://example.com is forced to the front of the keyboard order:
<!-- Before: focused before the menu and the logo -->
<input type="search" name="q" aria-label="Search" tabindex="1">
<!-- After: focused in page order -->
<input type="search" name="q" aria-label="Search">