Navigation using the Tab key should be restricted to elements on the page that users can interact with.

## Why is this an issue?

The misuse of the `tabIndex` attribute can lead to several issues:

- Navigation Confusion: It can confuse users who rely on keyboard navigation, as they might expect to tab through interactive elements like links and buttons, not static content.
- Accessibility Issues: It can create accessibility problems, as assistive technologies provide their own page navigation mechanisms based on the HTML of the page. Adding unnecessary tabindexes can disrupt this.
- Increased Tab Ring Size: It unnecessarily increases the size of the page’s tab ring, making navigation more cumbersome.

## How to fix it

Simply remove the `tabIndex` attribute or set it to `"-1"` to fix the issue.

### Code examples

#### Noncompliant code example

    <div tabIndex="0" />

#### Compliant solution

    <div />

## Resources

### Documentation

- MDN web docs - tabindex
- The a11y project - Use the tabindex attribute