select-name · WCAG 4.1.2 Name, Role, Value · Stufe AWie Sie das „select-name“-Problem beheben
Die axe-core-Regel select-name schlägt fehl, wenn ein <select>-Dropdown kein zugeordnetes Label hat. Der Nutzer hört die gewählte Option, aber nicht, wofür das Feld ist. WCAG 2.2 (4.1.2, Stufe A) verlangt einen Namen.
Was axe-core prüft
axe-core meldet ein <select> ohne verknüpftes <label>, ohne aria-label/aria-labelledby und ohne title.
Welcher Norm das entspricht
| WCAG 2.2 | 4.1.2 Name, Role, Value (Stufe A) |
| EN 301 549 | 9.4.1.2 |
| BFSG / EAA | BFSG § 12 i. V. m. EN 301 549 · EAA Anhang I |
| Kategorie | Formulare & Labels |
Warum es zählt
Größe, Farbe, Land und Menge steuern den Checkout. Ein unbenanntes Select bedeutet, dass ein Screenreader-Nutzer ein „Größe“-Dropdown nicht von „Farbe“ unterscheidet — ein Stufe-A-Fehler auf dem Conversion-Pfad.
Häufige Ursachen
- Ein nacktes
<select>mit einem<div>daneben als optisches Label - Varianten-Auswahl ohne echtes Label
- Eigene Dropdown-Widgets statt nativem
<select>ohne ARIA - Label vorhanden, aber nicht per
for/idverknüpft
Wie Sie es beheben
Verknüpfen Sie ein <label> per for/id oder ergänzen Sie ein aria-label.
<!-- Fehler -->
<select><option>S</option><option>M</option></select>
<!-- Besteht -->
<label for="groesse">Größe</label>
<select id="groesse"><option>S</option><option>M</option></select>FAQ
Nein. Eine Platzhalter-Option wie „Größe wählen“ ist kein zugänglicher Name für das Feld selbst.
Ersetzen Sie das native Select durch ein div-Widget, müssen Sie Rolle, Zustand und Namen selbst ergänzen — natives Select ist sicherer.
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 €.