Name ist Pflicht veröffentlicht in 2013
Vorbelegung von Eingabefeldern
Die Beschriftung eines Eingabefelds sollte grundsätzlich mit sichtbarem Text erfolgen. In der Regel wird der sichtbare Text außerhalb des Eingabefelds positioniert und mit dem LABEL
-Element mit dem Eingabefeld verknüpft. Somit erhält das Eingabefeld einen eindeutigen Namen.
Eine Alternative für die Beschriftung eines Eingabefelds kann die Vorbelegung des Eingabefelds sein.
Eine ungünstige Variante dieser Technik ist die Verwendung des value
-Attributs:
<input name="suche" id="schnellsuche" type="text" value="Suchbegriffe eingeben" />
Diese textliche Vorbelegung muss der Nutzer beim Fokussieren des Eingabefelds löschen, bevor eine eigene Eingabe vorgenommen werden kann. Das ist in den meisten Fällen kein großes Problem, allerdings ist es beim Einsatz eines Screenreaders nicht immer klar, dass der Text eine Vorbelegung und nicht etwa eine Beschriftung ist. So kommt es nicht selten vor, dass Screenreadernutzer solche Eingabefelder falsch ausfüllen und der im Formular enthaltener Text eine Zusammensetzung der Vorbelegung und der eigentlichen Eingabe wird.
Das value
-Attribut sollte nicht für die Vorbelegung eines Eingabefelds benutzt werden, d.h. wenn es doch genutzt wird:
- sollte es sich bei der Vorbelegung um einen gültigen Eingabewert handeln und das Eingabefeld wird anderweitig beschriftet oder
- das
value
-Attribut wird per JavaScript dem Eingabefeld hinzugefügt, bei Fokus entfernt und bei Verlassen des Eingabefelds, wenn kein Text eingegeben wurde, wieder eingefügt.
Alternativ zum value
-Attribut kann auch das placeholder
-Attribut eingesetzt werden. Mit dem placeholder
-Attribut wird erreicht, dass ein Hinweistext solange in einem Eingabefeld angezeigt wird, wie der Fokus nicht darauf liegt und solange der Nutzer keine Eingabe vorgenommen hat:
<input name="suche" id="schnellsuche" type="text" placeholder="Suchbegriffe eingeben" />
Das Attribut wird immerhin von Screenreadern unterstützt, d.h. der Wert des placeholder-Attributs wird in Ergänzung zu der eigentlichen Beschriftung erfasst. Um Redundanzen zu vermeiden, sollten deshalb placeholder
-Texte keine Wiederholungen der Beschriftungstexte enthalten.
Der "Platzhalter" ist in den meisten Fällen dennoch kein Ersatz für eine korrekte Beschriftung eines Eingabefelds. Während eine sichtbare Beschriftung immer angezeigt wird, wird die Vorbelegung in dem Moment, in dem es konkret gebraucht wird, ausgeblendet. Außerdem könnte die Vorbelegung als Eingabewert missverstanden werden. Schließlich weist die standardmäßige Darstellung der Vorbelegung (eingegraut) ein geringes Kontrastverhältnis auf. Es gibt also mehrere Gründe, dieses Attribut aus Sicht der Barrierefreiheit nicht zu nutzen (auch wenn es in der Praxis legitime Gründe für dessen Einsatz gibt).
Der Beitrag Name ist Pflicht besteht aus folgenden einzelnen Webseiten:
- Beschriftung mit
LABEL
Sichtbare Beschriftungen für Steuerelemente müssen mit dem
LABEL
-Element mit dem dazugehörigen Steuerelement explizit verknüpft werden.title
-Attribut als RettungsankerDie Beschriftung von Steuerelementen mit dem
title
-Attribut sollte nur in Ausnahmefällen vorgenommen werden.- Beschriftungen nur für Screenreader
Wenn auf sichtbare Beschriftungen für Steuerelemente verzichtet wird, gibt es weitere Techniken, die eine Beschriftung zumindest für Screenreadernutzer berücksichtigen.
- Vorbelegung von Eingabefeldern
(Aktuelle Seite)
Der folgende Begriff auf dieser Seite wird im Glossar definiert:Name