Unterstützung #82
geschlossenSind Placeholder barrierefrei?
100%
Beschreibung
????
Von David Mock vor etwa 11 Jahren aktualisiert
- Status wurde von Neu zu Gelöst geändert
- % erledigt wurde von 0 zu 90 geändert
Bestimmt
Von Christian Ehringfeld vor etwa 11 Jahren aktualisiert
- Status wurde von Gelöst zu Feedback geändert
- Zugewiesen an wurde von David Mock zu Matthias Unterbusch geändert
Vor HTML5 musste man JavaScript einsetzen, um in einem Textfeld eine Vorbelegung mit mehr oder minder sinnvollem Hinweistext zu erreichen, dann prüfen ob der Nutzer das Feld fokussiert hat und den Platzhaltertext entfernen, dann erneut testen ob der Benutzer etwas eingegeben hat wenn er das Feld wieder verlässt, und gegebenenfalls den Platzhaltertext wieder einfügen (ohne aber bereits gemachte Eingaben wieder zu überschreiben).
Diesen ganzen Aufwand können Sie sich sparen, wenn Sie das placeholder-Attribut aus HTML5 einsetzen – dann macht der Browser diese Arbeit nämlich von ganz alleine:
<input type="email" id="email" placeholder="name@domain.de">
Die Unterstützung hierfür ist nach unseren Tests allerdings noch lückenhaft. Erst die neuesten Versionen von Firefox 4, Opera 11 und Safari 5 unterstützen dieses Attribut – wenn Sie einen hohen Prozentsatz von Nutzern mit älteren Browsern haben und essentielle Hinweise in diesem Platzhalter stehen haben sollten, dann brauchen Sie auch hier einen Fallback.
Zum Glück gibt es eine ganze Reihe Skripte wie zum Beispiel Modernizr, um die Unterstützung von placeholder und anderen Attributen zu testen und entsprechend zu reagieren.
Was Sie nicht machen sollten ist, das placeholder-Attribut als LABEL-Ersatz zu missbrauchen – diese werden nach wie vor benötigt, weswegen dies in der HTML5-Spezifikation auch ausdrücklich verboten ist. Längere Hinweistexte sind nach wie vor besser in einem title-Attribut oder noch besser im sichtbaren Anleitungstext des Formulars aufgehoben. Tests zur barrierefreien Umsetzung dieses Attributs finden Sie unter html5accessibility.com: »HTML5 placeholder attribute tests«.
http://www.einfach-fuer-alle.de/artikel/barrierefreie-formulare/html-css/
Wohl erst Support ab FF 4 und auf labels soll wohl nicht ganz verzichtet werden, ich will dein Design ja nicht kaputt machen aber naja ^^
Von Christian Ehringfeld vor etwa 11 Jahren aktualisiert
Placeholder sind die Dinger die als Text in einem Inputfield stehen. Vor HTML5 musste man das immer mit Javascript machen...
Von Matthias Unterbusch vor etwa 11 Jahren aktualisiert
Das ist ist alles klar. Aber ob wir die Browseranforderung angeben oder auf Barrierefreiheit verrichten, müssen wir morgen mal klären.
Von Christian Ehringfeld vor etwa 11 Jahren aktualisiert
Laut HTML5 Spezifikation dürfen wir auch nicht mal auf die Labels verzichten, das bedeutet die Placeholders wären eh nur optional und erst mal egal auch wenn das natürlich Davids Design kaputt macht...
http://stackoverflow.com/questions/9157867/placeholder-vs-label-for-input-in-html5
Von David Mock vor etwa 11 Jahren aktualisiert
Von Matthias Unterbusch vor etwa 11 Jahren aktualisiert
Mach erstmal nichts wir klären das morgen
Von Matthias Unterbusch vor etwa 11 Jahren aktualisiert
- Zugewiesen an wurde von Matthias Unterbusch zu David Mock geändert
Von David Mock vor etwa 11 Jahren aktualisiert
- Status wurde von Feedback zu Erledigt geändert
- % erledigt wurde von 90 zu 100 geändert