ARIA Roles HTML
ARIA Roles HTML: Passt die Rolle zum Element?
Wählen Sie Element und Rolle. Das Labor zeigt implizite Semantik, zulässige Überschreibungen und einen robusteren Codeweg.
01 / Live-Rollen-Matrix
Element und Rolle wählen, das Ergebnis sofort sehen.
Die Demo startet von selbst und zeigt die wichtigsten Zustände. Sobald Sie eingreifen, gehört die Matrix Ihnen.
Rollen-Matrix
HTML × ARIA
HTML-Element
Codefix
Diese Rolle widerspricht den Regeln für das HTML-Element.
<button type="button">Speichern</button>Erlaubt heißt nicht vollständig: Name, Zustand, Fokus und Tasten bleiben prüfpflichtig.
Navigation und Rolle button gewählt. Nicht zulässig.
02 / Der Unterschied
Eine erlaubte Kombination ist der Anfang, nicht die Website.
Erlaubt heißt nicht bedienbar
Eine zulässige Rolle bringt weder Namen, Zustände noch Tastaturverhalten mit. In der Praxis scheitern div-Buttons und doppelt gesetzte Rollen genau daran.
Rollen im gerenderten DOM
Der Website-Check findet ungültige ARIA-Attribute, Bedienelemente ohne zugänglichen Namen und fehlende Struktur auf Ihren Seiten – automatisch erkennbar, ohne Codezugang.
Fundstellen statt Tabellenabgleich
Jeder Befund nennt Seite, Vorkommen und den konkreten nächsten Schritt. Kostenlos und ohne Installation.
03 / Auf Ihrer Website
Jetzt die eigenen Rollen prüfen.
Die Matrix prüft Einzelkombinationen. Der Website-Check findet Rollen- und Strukturprobleme im gerenderten DOM Ihrer Seiten.
Der Website-Check ist bereit.
- 1URL
- 2Auswahl
- 3Prüfung
- 4Ergebnis