Oh, ich muss wirklich meinen Artikel zu diesem Thema fertig schreiben. Hier ist die ungeschliffene Version:
Erste — eine Meldung, die beschreibt, was in ein Feld eingeben ist nicht ein Standardwert. Standardwerte sind Dinge, die möglicherweise eingereicht werden können (z. B. ein Land, das basierend auf GeoIP oder eine Lieferadresse aus Kundendatensätzen eingegeben wird).
Zweite — Verwenden Sie den Standardwert als ein gefälschtes Etikett und dann löscht es, wenn der Benutzer es konzentriert (vermutlich möchten Sie nicht, dass der Benutzer die Nachricht manuell löschen muss) verursacht Probleme mit der Zugänglichkeit. Screenreader lesen den fokussierten Inhalt vor, wenn Sie ihn löschen, wenn er fokussiert wird, können die Informationen nicht abgerufen werden.
Die beste Option, meiner Meinung nach, ist ein <label> neben dem Steuerelement zu platzieren. Webseiten sind in der Regel nicht kurz auf Platz — Bildlaufleisten sind nicht böse.
Wenn Sie wollen, dass es wirklich schauen, wie es dann in der Steuerung ist:
- Setzen Sie die
<label> und <input> in einem <div>
- eine Klasse-Set, das auf
<div> JavaScript verwenden (so tun Sie nicht habe eine Mist Erfahrung ist JS ist nicht verfügbar)
- Wenden Sie CSS, um die
<div> zu position: relative und geben Sie ihm eine Größe.
- Machen Sie den
background des <input>transparent und Stil den div
Position die <label> unter dem <input>- Schreiben Sie eine Funktion zu füllen, wenn der Wert des Eingangs überprüft, eine leere Zeichenfolge ist oder nicht. Schalten Sie je nach Antwort eine Klasse im div ein und aus.
- Wenn diese Klasse auf dem div eingestellt ist, stellten
text-indent auf eine hohe negative Länge (wie -999em), so dass der Text Bildschirm versteckt ausgeschaltet ist (aber immer noch zu Screen-Reader verfügbar)
+1.Innovative, saubere und zugängliche Lösung! Benötigt ein bisschen mehr Aufwand vom Entwickler obwohl (das ist nicht wirklich eine Kritik, nur eine Beobachtung) – PatrikAkerstrand
Ich habe gerade daran erinnert, gibt es ein Beispiel dafür in Aktion (meine erste Umsetzung dieser denke ich) bei http: // playfire .com/(das große Login-Formular in der Mitte/rechts auf der Seite) – Quentin
Danke Jungs.Ich werde mit David's gehen. Auf diese Weise speichere ich die Notwendigkeit zu validieren inout zu chek, wenn der Benutzer den Vorschlagswert (wie erwähnt von Machine). Danke an alle – Annibigi