aria-placeholder
Das aria-placeholder
Attribut definiert einen kurzen Hinweis (ein Wort oder eine kurze Phrase), der dem Benutzer bei der Dateneingabe helfen soll, wenn ein Formularfeld keinen Wert hat. Der Hinweis kann ein Beispielwert oder eine kurze Beschreibung des erwarteten Formats sein.
Beschreibung
Ein Platzhalter ist ein Text, der im Formularfeld erscheint, wenn kein Wert gesetzt ist. Das HTML-Attribut placeholder
ermöglicht es, einen Beispielwert oder eine kurze Beschreibung des erwarteten Formats für mehrere HTML <input>
-Typen und <textarea>
bereitzustellen.
Wenn Sie ein textbox
mit einem anderen Element erstellen, wird placeholder
nicht unterstützt. Genau hier kommt aria-placeholder
ins Spiel. Das aria-placeholder
Attribut kann verwendet werden, um einen kurzen Hinweis zu definieren, der dem Benutzer hilft zu verstehen, welche Art von Daten erwartet wird, wenn ein nicht-semantisches Formularfeld keinen Wert hat.
<span id="date-of-birth">Birthday</span>
<div
contenteditable
role="textbox"
aria-labelledby="date-of-birth"
aria-placeholder="MM-DD-YYYY">
MM-DD-YYYY
</div>
Der Platzhalter-Hinweis sollte dem Benutzer immer dann angezeigt werden, wenn der Wert des Steuerelements leer ist, auch wenn ein Wert gelöscht wird.
Hinweis: ARIA modifiziert nur den Zugänglichkeitsbaum eines Elements und damit, wie unterstützende Technologie den Inhalt Ihren Benutzern präsentiert. ARIA ändert nichts an der Funktion oder dem Verhalten eines Elements. Wenn Sie semantische HTML-Elemente nicht für ihren vorgesehenen Zweck und ihre Standardfunktionalität verwenden, müssen Sie JavaScript verwenden, um das Verhalten zu steuern.
Das aria-placeholder
wird zusätzlich und nicht anstelle eines Labels verwendet. Sie haben unterschiedliche Zwecke und unterschiedliche Funktionalität. Ein Label erklärt, welche Art von Informationen erwartet wird. Platzhalter-Text gibt einen Hinweis auf den erwarteten Wert.
Warnung: Die Verwendung eines Platzhalters anstelle eines sichtbaren Labels beeinträchtigt die Zugänglichkeit und Benutzerfreundlichkeit für viele Benutzer, darunter ältere Benutzer und Benutzer mit kognitiven Einschränkungen, motorischen Einschränkungen, feinmotorischen Fähigkeiten und Sehbehinderungen. Labels sind besser: Sie sind immer sichtbar und bieten eine größere Trefferfläche, um sich auf das Steuerelement zu konzentrieren. Platzhalter haben mehrere Nachteile: Sie verschwinden, wenn das Steuerelement einen Wert hat, einschließlich nur Leerzeichen, sie können Benutzer verwirren, indem sie denken, dass der Wert vorausgefüllt ist, und die Standardfarbe hat einen unzureichenden Kontrast.
Hinweis: Platzhalter sollten nur verwendet werden, um ein Beispiel für die Art der in ein Formular einzugebenden Daten zu zeigen; sie ersetzen kein richtiges Label.
Werte
<string>
-
Das Wort oder die kurze Phrase, die in einem Steuerelement angezeigt wird, wenn das Steuerelement keinen Wert hat.
Zugehörige Schnittstellen
Element.ariaPlaceholder
-
Die
ariaPlaceholder
Eigenschaft, Teil derElement
Schnittstelle, spiegelt den Wert desaria-placeholder
Attributs wider. ElementInternals.ariaPlaceholder
-
Die
ariaPlaceholder
Eigenschaft, Teil derElementInternals
Schnittstelle, spiegelt den Wert desaria-placeholder
Attributs wider.
Zugehörige Rollen
Spezifikationen
Specification |
---|
Accessible Rich Internet Applications (WAI-ARIA) # aria-placeholder |