Welche Elemente in HTML5 können ARIA-Attribute verwenden?

Praktisch alle Standard-HTML5-Elemente können ARIA-Attribute verwenden, um die Zugänglichkeit für Nutzer assistiver Technologien zu verbessern.

Einige Beispiele:

• Semantische Strukturelemente: header, footer, nav, main, aside, article, section. Können verwendet werden, um Rollen von Seitenbereichen zu definieren.
• Interaktive Elemente: button, a, input, select, textarea. Können Attribute wie aria-label, aria-describedby, aria-expanded und andere erhalten.
• Listenelemente: ul, ol, li. Können aria-setsize, aria-posinset verwenden.
• Tabellenelemente: table, tr, th, td. Obwohl HTML5 eigene Attribute für die Zugänglichkeit von Tabellen hat (scope, headers), können ARIA diese ergänzen.
• Formularelemente: form, fieldset, legend.
• Multimedia-Elemente: img, audio, video. Können beschreibende Attribute (aria-label) erhalten.

Es gibt Ausnahmen, zum Beispiel:

• Elemente, die initial versteckt oder dekorativ sind (script, style, meta, link).
• Elemente, die nicht im DOM angezeigt werden oder nicht für Interaktionen zugänglich sind.

Es ist wichtig, ARIA nur zu verwenden, wenn native HTML-Attribute unzureichend sind, und dem Prinzip "Verwenden Sie native Elemente, wann immer möglich" zu folgen. Übermäßiger oder falscher Einsatz von ARIA kann die Zugänglichkeit verschlechtern.