← Alle Regeln

ARIA

Manche Rollen setzen bestimmte Kindelemente voraus

• Regel: aria-required-children
• Schweregrad: Kritisch
• WCAG-Stufe A

Warum das wichtig ist

Eine Tabliste enthält Tabs, eine Liste enthält Listeneinträge. Fehlen die erforderlichen Kindelemente, bricht das gesamte zusammengesetzte Widget im Accessibility-Baum zusammen und nichts davon wird korrekt angesagt.

So beheben Sie es

1. Geben Sie den direkten Kindelementen die erwartete Rolle (role="tab" innerhalb von role="tablist").
2. Liegt ein Wrapper dazwischen, geben Sie ihm role="presentation", damit er die Beziehung nicht unterbricht.
3. Entfernen Sie die Elternrolle, wenn die Struktur gar kein solches Widget ist.

Im Markup

<div role="tablist">
  <div>Overview</div>
</div>

<div role="tablist">
  <button role="tab" aria-selected="true">Overview</button>
</div>

Die Anforderung dahinter

Diese Regel ist eine Art, die folgenden WCAG-2.2-Erfolgskriterien zu verfehlen. Das W3C, das den Standard herausgibt, erläutert jedes davon:

• 1.3.1 Info und Beziehungen (öffnet in neuem Tab) — WCAG-Stufe A

Weiterführende Quellen

Deque University zu aria-required-children (öffnet in neuem Tab)

Deque entwickelt axe-core, die quelloffene Prüf-Engine unseres Scanners. Ihre Seite dokumentiert die Regel so, wie die Engine sie umsetzt.

Automatische Prüfungen finden Fehler, die ein Browser nachweisen kann. Ob eine Untertitelspur inhaltlich stimmt, ob ein Alternativtext wirklich hilft oder ob sich eine Seite durchgängig mit der Tastatur bedienen lässt, kann nur ein Mensch beurteilen.