Labels, Platzhalter und Benutzerführung

Lernziel

Du verstehst, wie klare Beschriftungen, sinnvolle Platzhalter und kleine Hilfen Formulare verbessern.

Praxis

Benutzerfuehrung bedeutet, dass Besucher sofort erkennen, was sie eingeben sollen. Gute Formulare vermeiden Unsicherheit und machen den naechsten Schritt klar.

Beispiel

<label for="email">E-Mail</label>
<input id="email" type="email" placeholder="name@example.com">

So sieht es aus

Im Browser sieht der Benutzer die Beschriftung E-Mail und darunter oder daneben ein Eingabefeld. Im Feld steht als Orientierung der hellere Hinweistext name@example.com.

Was bewirkt der Code?

Das label macht klar, welche Information erwartet wird. Das type Attribut email hilft dem Browser bei der Eingabepruefung. Der placeholder zeigt ein Beispiel fuer das Format, ersetzt aber keine echte Beschriftung.

Hinweis

Verlasse dich nicht nur auf Platzhalter. Sobald jemand tippt, verschwindet der Hinweistext. Das Label sollte deshalb immer vorhanden sein.