list · WCAG 1.3.1 Info and Relationships · Stufe AWie Sie das „list“-Problem beheben
Die axe-core-Regel list schlägt fehl, wenn ein <ul> oder <ol> als direktes Kind etwas anderes als <li> (sowie script/template) enthält. Screenreader melden die Liste dann falsch — falsche Anzahl oder gar keine Liste. Bezug: WCAG 2.2 1.3.1 (Stufe A).
Was axe-core prüft
axe-core meldet eine Liste, deren direkte Kinder nicht alle <li> sind — z. B. ein <div> oder <a> direkt im <ul>.
Welcher Norm das entspricht
| WCAG 2.2 | 1.3.1 Info and Relationships (Stufe A) |
| EN 301 549 | 9.1.3.1 |
| BFSG / EAA | BFSG § 12 i. V. m. EN 301 549 · EAA Anhang I |
| Kategorie | Struktur & Landmarks |
Warum es zählt
Navigationsmenüs, Produktraster und Filter sind meist Listen. Sitzt ein Wrapper-<div> direkt im <ul>, sagt ein Screenreader womöglich „Liste, 0 Einträge“ und verbirgt das ganze Menü. Die Begleitregel listitem meldet den Umkehrfall — ein <li> außerhalb einer Liste.
Häufige Ursachen
- Ein
<div>-Wrapper direkt im<ul> - Links oder Überschriften als direkte Listenkinder
- Eine Grid-Bibliothek fügt Nicht-
<li>-Knoten ein - Eigene Knoten zwischen Liste und Einträgen
Wie Sie es beheben
Machen Sie jedes direkte Kind eines <ul>/<ol> zu einem <li>. Verschieben Sie Wrapper in das <li>, nicht zwischen Liste und Einträge.
<!-- Fehler -->
<ul><div><li>Eins</li><li>Zwei</li></div></ul>
<!-- Besteht -->
<ul><li>Eins</li><li>Zwei</li></ul>Verwandte Prüfungen
FAQ
Ja — display:flex/grid auf <ul> oder <li>. Die DOM-Struktur muss ul > li bleiben; das CSS-Layout ist unabhängig.
Der Umkehrtest: ein <li> außerhalb eines <ul>/<ol>/role=list. Beide zusammen beheben.
Finden Sie jeden solchen Fehler auf Ihrer Seite
Starten Sie einen kostenlosen WCAG 2.2 AA-Scan — echte axe-core-Engine, ohne Anmeldung. Oder ein zeitgestempelter Beweis-Report für 29 €.