Skip to content

Formularfeld ohne Beschriftung

CriticalWCAG criterion 3.3.2WCAG criterion 4.1.2BFSG-relevant

What is the problem?

Ein Eingabefeld hat keine programmatisch verknüpfte Beschriftung (label). Screenreader-Nutzer wissen nicht, was sie eingeben sollen — bei Adress- oder Zahlungsformularen bricht die Bestellung an dieser Stelle ab. Ein nur sichtbarer Text daneben genügt nicht, wenn die Verknüpfung fehlt.

Why does it matter?

WCAG 2.1 Erfolgskriterien 3.3.2 (Beschriftungen oder Anweisungen, Stufe A) und 4.1.2 (Name, Rolle, Wert, Stufe A) verlangen beschriftete Eingabefelder. Formulare sind der kritischste Pfad im Shop und für die BFSG-Bewertung besonders relevant.

How to fix it

Verknüpfe jedes Eingabefeld mit einer Beschriftung: <label for="feld-id">Beschriftung</label> plus passender id am Feld. Platzhalter-Text ersetzt kein Label. Wo kein sichtbares Label möglich ist, aria-label verwenden — sichtbare Labels sind aber die bessere Lösung.

Shopware

Standard-Formulare (Registrierung, Kasse) sind beschriftet — betroffen sind meist eigene Formulare (Form Builder Plugins) oder Theme-Anpassungen: dort Label-Feld pflegen bzw. im Twig-Template <label for> ergänzen.

Check Shopware specifically

WooCommerce

Checkout-Felder: Über Filter woocommerce_checkout_fields die Label pflegen statt sie auszublenden. Bei Formular-Plugins (Contact Form 7, WPForms …) die Label-Option aktivieren — „Label verstecken“ vermeiden oder mit korrekt verknüpftem Screenreader-Label nutzen.

Check WooCommerce specifically

Shopify

Theme-Formulare (Newsletter, Suche): im Code-Editor prüfen, ob <label> mit for-Attribut existiert. Viele Themes nutzen visually-hidden-Labels — sicherstellen, dass die Verknüpfung (for/id) stimmt.

Check Shopify specifically

WordPress

Formular-Plugins: Label-Feld ausfüllen und nicht ausblenden. Eigene Formulare im Theme: <label for> ergänzen. Suchformulare: get_search_form() des Themes prüfen.

Check WordPress specifically

TYPO3

Formulare aus dem Form Framework haben Label-Felder in der Formular-Definition — ausfüllen statt leeren. Eigene Fluid-Formulare: <f:form.textfield> immer mit zugehörigem <label for> ausgeben.

Check TYPO3 specifically

Is your website affected?

The free quick check tests up to 5 pages within minutes — no registration.

Start a free quick check

Related rules

All rules