Platzhalter

Ein komplett leeres Formular kann schon mal ein wenig einschüchternd wirken, vor allem wenn man nicht ganz genau weiß welche Daten wo eingetragen werden müssen. Deswegen haben einige Entwickler die Idee gehabt, die Felder einfach mit Texten vorzubefüllen, damit der Besucher schon einmal einen Eindruck hat, was wohin gehört. Heutzutage nennen wir so etwas einfach Platzhalter. Normalerweise wird so ein Platzhalter in einem leichten grau dargestellt, damit er sich eindeutig von den Eingaben eines Besuchers unterscheidet.

Wie man bis hierhin schon festgestellt haben dürfte, ist ein Platzhalter keine wirkliche Überprüfung von Daten. Aber es ist ein langersehntes Feature was bisher durch die Entwickler immer mittels JavaScript gelöst wurde. Der Platzhalter wird in einem input Feld angezeigt, solange dieses leer und nicht angewählt ist. Sobald man das Feld auswählt verschwindet der Platzhalter und erscheint erst beim Verlassen des Feldes wieder, wenn nicht zwischenzeitlich ein Wert eingetragen wurde.

Die Nutzung des placeholder Attributes ist denkbar einfach, wie das folgende Beispiel zeigt:

<form>
	First name: <input type="text" name="firstname" placeholder="Jane"/> <br>
Surname: <input type="text" name="surname" placeholder="Doe"/> <br>
<input type="submit" value="Submit now" />
</form>

Die Platzhalter werden auch durch die meisten Browser bereits unterstützt. Aber auch wenn der Browser das Attribut nicht interpretieren kann schadet es der Funktion der Webseite nicht. Das einzige was passiert ist, dass die Felder leer sind, da der Browser das placeholder Attribut ignoriert. Natürlich kann man aber auch ein polyfill benutzen um das Feature in allen Browsern verfügbar zu machen -schaut euch doch mal meine Empfehlungen an.