Ratgeber: Formularbeschriftungen bei wiederholten Feldern eindeutig zuordnen

Ein verständliches Wort am falschen Feld

Ein Formular kann sichtbar ordentlich aussehen und trotzdem eine falsche Zuordnung besitzen. Besonders bei mehreren Teilnehmern passiert es leicht, dass kopierte Eingabefelder dieselbe Kennung behalten. Dann führt ein Klick auf die Beschriftung womöglich zum ersten Feld, obwohl du den zweiten Teilnehmer bearbeiten möchtest. Dieser Fachratgeber behandelt eine bestehende HTML-Grundlage, die vor der Veröffentlichung geprüft werden sollte.

Die MDN-Referenz beschreibt die ausdrückliche Verbindung über das for-Attribut einer Beschriftung und die passende id des Eingabefelds. Diese Kennung muss im Dokument eindeutig sein. Eine korrekt verbundene Beschriftung hilft auch der Bedienung mit unterstützender Technik und vergrößert die nutzbare Klickfläche. Sichtbare Nähe allein stellt diese technische Beziehung nicht her.

Zwei Teilnehmer als Probe anlegen

Plane ein einfaches Anmeldeformular mit zwei Personen. Beide benötigen einen Namen und eine Ernährungsangabe. Vergib gedanklich getrennte Feldkennungen, etwa für den Namen der ersten und der zweiten Person. Die sichtbaren Gruppenüberschriften sollen zusätzlich erklären, zu welchem Teilnehmer die Angaben gehören.

Bitte den Entwicklungsassistenten, die Zuordnung auch dann eindeutig zu halten, wenn eine weitere Person ergänzt oder entfernt wird. Das ist ein anderer Test als das bloße Ausfüllen eines einzigen Feldes. Verlange, dass nicht nur die Oberfläche, sondern auch die gespeicherten Angaben beim richtigen Teilnehmer landen. Die Beschriftungsreferenz allein baut diesen Datenablauf noch nicht.

Drei einfache Bedienproben

Klicke zunächst auf die Beschriftung des zweiten Namensfelds. Der Fokus soll genau dort erscheinen. Gehe anschließend mit der Tabulatortaste durch die Eingaben und beobachte, ob die Reihenfolge verständlich bleibt. Prüfe zuletzt, wie eine unterstützende Sprachausgabe die beiden Gruppen und ihre Felder ankündigt, sofern dir ein entsprechendes Werkzeug zur Verfügung steht.

Wenn du diese letzte Prüfung nicht durchgeführt hast, notiere sie als offen. Ein erfolgreicher Mausklick ist kein vollständiger Barrierefreiheitstest. Achte auch auf hinzugefügte Felder nach dem ersten Laden: Gerade dort können Kennungen versehentlich wiederverwendet werden.

Den Nutzen für die Redaktion festhalten

Schreibe in die Abnahme: „Jede Beschriftung aktiviert das zugehörige Feld; mehrere Teilnehmer bleiben unterscheidbar.“ Verwende konkrete Testnamen wie Person A und Person B, damit vertauschte Daten auffallen. So wird aus einem abstrakten HTML-Attribut eine verständliche Qualitätsanforderung: Menschen sollen sicher wissen, wessen Angaben sie gerade bearbeiten und welche Informationen später tatsächlich übermittelt werden.