How to fix tabindex on Webflow

Remove or replace all positive tabindex values (tabindex="1" or higher) on your page elements, using tabindex="0" for focusable elements and tabindex="-1" only when programmatic focus is needed.

Steps for Webflow

  1. Open your project in the Webflow Designer.
  2. Select the element flagged with a positive tabindex — check its settings in the right-hand panel under the Element Settings tab (the gear icon).
  3. Look for the 'Tab Index' field in the element settings panel and change the value to '0' (to include in natural tab order) or leave blank/remove to use the default.
  4. For elements you cannot configure via the Designer panel, switch to the project's Custom Code section: go to Project Settings → Custom Code and check the Head and Body code injection areas for hardcoded tabindex attributes.
  5. Also check any Embed components on the canvas that contain raw HTML with tabindex set — click the Embed element and edit the HTML directly in the embed editor.
  6. Publish the site and verify the tab order by pressing Tab through the page in a browser.
Official Webflow documentation ↗

What is tabindex?

The `tabindex` attribute controls the order in which keyboard users move through interactive elements on a page using the Tab key. A value of `tabindex="0"` means an element joins the natural tab order based on where it appears in the HTML. A value of `tabindex="-1"` removes the element from the tab order but still allows it to receive focus via JavaScript. A positive value — like `tabindex="1"`, `tabindex="5"`, or any number above zero — forces a custom tab order that almost always creates a confusing, broken experience for keyboard and screen-reader users. This accessibility rule flags any element with a tabindex value greater than 0.

Positive tabindex values hijack the natural reading and navigation order, causing keyboard-only users and screen-reader users to jump around the page unpredictably — often skipping important links, buttons, or form fields entirely, or hitting them in an illogical sequence. This directly violates WCAG 2.1 Success Criterion 2.4.3 (Focus Order) and can expose your store to legal accessibility complaints or lawsuits, which are increasingly common in e-commerce. Beyond legal risk, a broken keyboard experience means customers who rely on keyboard navigation (including many users with motor disabilities) may be unable to complete checkout, contact forms, or product searches — directly costing you conversions and revenue. Fixing this is also a signal of overall code quality that can indirectly support SEO through improved Core Web Vitals and reduced bounce rates from frustrated users.

See the complete Tabindex guide for every platform and the full background.

Not sure if your Webflow store has this?

Run a free SEOLZ scan — we’ll find tabindex and every other issue across your whole site.

Scan my site free

Fix tabindex on another platform