---
title: Frame Focusable Content | Accessibility Rule
description: Frames with focusable content must not have tabindex=-1
source_url:
  html: https://testingbot.com/support/accessibility/web/rules/frame-focusable-content
  md: https://testingbot.com/support/accessibility/web/rules/frame-focusable-content/index.md
---
# Ensure \<frame\> and \<iframe\> elements with focusable content do not have tabindex=-1

Rule ID: frame-focusable-contentUser Impact: seriousGuidelines: WCAG 2.0

Ensure that `<frame>` and `<iframe>` elements containing focusable content do not have a negative `tabindex`, as this can hinder keyboard navigation and accessibility.

## About This Rule

This rule ensures that frames containing focusable elements do not have a negative `tabindex`, thereby maintaining proper keyboard accessibility. Adhering to this guideline helps users navigate interactive content within frames effectively.

## Why It Matters

Assigning a negative `tabindex` (e.g., `tabindex="-1"`) to a frame prevents browsers from directing focus to any interactive elements within that frame. This means users navigating via keyboard may be unable to access buttons, links, or form controls inside the frame, leading to a significant accessibility barrier, especially for users who rely on keyboard navigation.

## How to Fix

To ensure accessibility:

- **Avoid Negative `tabindex`:** Do not assign `tabindex="-1"` to frames containing focusable content. Instead, use a non-negative `tabindex` or omit the attribute entirely. 
- **Assess Frame Content:** If the frame contains no interactive elements and does not require keyboard navigation, a negative `tabindex` may be appropriate. However, exercise caution, as future content updates could introduce focusable elements, inadvertently creating accessibility issues. 

### Examples

#### Incorrect Implementation

An iframe with focusable content and a negative `tabindex`:

    <iframe
      srcdoc="<button>Click me</button>"
      tabindex="-1"
      title="Interactive frame">
    </iframe>

#### Correct Implementation

An iframe with focusable content and a non-negative `tabindex`:

    <iframe
      srcdoc="<button>Click me</button>"
      tabindex="0"
      title="Interactive frame">
    </iframe>

## Other Rules

Interested in other web accessibility rules? Please see these other rules:

- [frame-title-unique](https://testingbot.com/support/accessibility/web/rules/frame-title-unique)
- [frame-title](https://testingbot.com/support/accessibility/web/rules/frame-title)
- [html-has-lang](https://testingbot.com/support/accessibility/web/rules/html-has-lang)
- [html-lang-valid](https://testingbot.com/support/accessibility/web/rules/html-lang-valid)
- [html-xml-lang-mismatch](https://testingbot.com/support/accessibility/web/rules/html-xml-lang-mismatch)