<frame> und <iframe> Elemente mit fokussierbarem Inhalt dürfen kein tabindex=-1 haben

Blind Mobilität
WCAG 2.2 Level A
Von Menschen für Menschen geschrieben und recherchiert
Foto des Experten
Ritvik Shrivastava
Fachmännisch überprüft von
Kommentare: 0
Ihre gesamte Domain
Erhalten Sie detaillierte Anweisungen, wie Sie jedes Barrierefreiheitsproblem auf Ihrer Website beheben können

Laut Webzugänglichkeitsrichtlinien darf tabindex=”-1″ nicht für <frame>– und <iframe>-Elemente mit fokussierbarem Inhalt verwendet werden.

Warum es wichtig ist

Wenn ein Frame ein negatives tabindex hat, kann ein Browser den Fokus nicht auf den Inhalt innerhalb dieses Frames lenken. Dies führt dazu, dass der gesamte Inhalt bei der Tastaturnavigation übersprungen wird. Bei scrollbaren Frames verhindert es auch, dass der Fokus ein Element erreicht, von dem aus der Frame mit der Tastatur gescrollt werden kann.

Behebung des Problems

Überprüfen Sie alle <frame>– und <iframe>-Elemente mit tabindex=”-1″. Falls solche Frames vorhanden sind, dürfen sie weder fokussierbare Elemente noch verschachtelte Frames mit fokussierbarem Inhalt enthalten.

Gutes Code-Beispiel

Codebeispiel
<iframe srcdoc="<button>Klicken Sie mich</button>" tabindex="0" title="Mein Frame ist ein iframe"></iframe> Kopieren

In einigen Fällen, wenn der Frame keine Tastaturnavigation oder Tastaturscrollen benötigt, kann tabindex=”-1″ auf iframes verwendet werden.

Codebeispiel
<iframe srcdoc="<p>Hallo Welt</p>" tabindex="-1" title="Mein Frame ist ein iframe"></iframe> Kopieren

Schlechtes Code-Beispiel

Codebeispiel
<iframe srcdoc="<button>Klicken Sie mich</button>" tabindex="-1" title="Mein Frame ist ein iframe"></iframe> Kopieren

Testfälle

Für weitere Beispiele besuchen Sie die ATC Rules-Bibliothek auf GitHub von W3C.