Intelligente Formulare - HTML5 - page 47

zu müssen. Was bisher mit einem kurzen JavaScript-Schnipsel erledigt wurde,
kann in HTML5 mit dem autofocus -Attribut erreicht werden.

<input type=search name=query autofocus>

Wie alle Attribute vom Typ boolean kann das Attribut auch als autofocus=
"autofocus" geschrieben werden (vergleiche dazu Abschnitt 2.7.2, Das Element
»time«). Laut Spezifikation darf nur ein Element einer Webseite das autofocus -
Attribut enthalten.

Für ältere Browser stellt autofocus kein Hindernis dar, weil sie das unbekannte
Attribut einfach ignorieren. Den Gewinn an Benutzerfreundlichkeit haben frei-
lich nur neue Browser.

3.2.2 Platzhalter-Text mit »placeholder«

Eine weitere Verbesserung der Benutzbarkeit von HTML-Formularen erreicht
man durch das neue placeholder -Attribut.

<p><label for=email>Ihre E-Mail-Adresse:</label>
<input type=email name=email id=email
placeholder="[e-mail]">
<p><label for=birthday>Ihr Geburtstag</label>
<input type=date name=birthday id=birthday
placeholder="1978-11-24">

Der Wert von placeholder kann dem Benutzer einen kurzen Hinweis darauf ge-
ben, wie das Feld auszufüllen ist, und sollte nicht als Ersatz für das label -Ele-
ment verwendet werden. Das bietet sich vor allem bei solchen Feldern an, wo
ein bestimmtes Eingabeformat erwartet wird. Der Browser zeigt den Hinweistext
innerhalb eines nicht aktiven Eingabefelds an. Sobald das Feld aktiviert wird und
den Fokus erhält, wird der Text nicht mehr angezeigt (vergleiche Abbildung 3.5).

Abbildung 3.5: Das »placeholder«-Attribut in Google Chrome