Formular-Elemente

Keine Formular-Elemente selbst zusammenbauen.

Es gibt viele verschiedene Arten von Formular-Elementen. Eingabefelder für Passwörter, kurze Texte, lange Texte, Radiobuttons, Checkboxen, Selects usw.. Formular-Elemente lassen sich aber in zwei grundlegende Gruppen unterteilen: Elemente die ausgefüllt werden müssen und optionale Elemente.

Damit Deine Benutzer und Benutzerinnen auf einen Blick erkennen können welche Felder sie ausfüllen müssen und welche nicht, solltest Du die Elemente entsprechend kennzeichnen. Wenn jemand trotzdem etwas vergisst oder falsch ausfüllt, sollten die betroffenen Elemente deutlich gekennzeichnet sein. Ein zusätzlicher Hinweis der genau erklärt worin das Problem liegt ist natürlich noch besser.

Außerdem besteht ein Formular-Element noch aus einer Beschriftung, die erklärt was einzutragen ist und einem Platzhaltertext, der ein typisches Beispiel der Eingabe zeigt. Diese Komponenten reduzieren die Wahrscheinlichkeit, dass Elemente falsch ausgefüllt werden.

Wie Links und Buttons hat ein jedes Formular-Element noch weitere Zustände. Einen neutralen im nicht ausgefüllten sowie im bereits ausgefüllten Zustand und einen aktiven Zustand, wenn das Element gerade ausgefüllt wird. Optional kannst Du Dir überlegen was passiert, wenn Du deine Maus über ein Element bewegst.

Jetzt kommen wir doch noch an den Punkt, an dem ich das Thema Design ansprechen möchte. Konkret geht es mir um Checkboxen, Radiobuttons und Selects. Ich rate Dir dazu diese Elemente nicht vollständig umzugestalten, sodass sie zum Rest des Projektes passen. Zumindestens solltest Du sie nur mit CSS umgestalten.

Einfache Eingabefelder kannst Du wiederum bewusst gestalten und verändern ohne dass Du dazu zusätzliches HTML und JavaScript brauchst. Bei Checkboxen, Radiobuttons und Selects kommst du jedoch ohne diese Hilfsmittel nicht weit. Du solltest der Versuchung diese zu verwenden unbedingt widerstehen. Wenn Du das nicht schaffst, müsst Du diese Formular-Elemente selbst nachgebauen. Das kostet viel Entwicklungszeit, die besser in andere Funktionen investiert werden könnte. Wichtig ist, dass Du sicherstellst, dass die selbst entwickelten Elemente auf allen Geräten und Browsern funktionieren, auch auf denen die es jetzt noch gar nicht gibt.

Deswegen rate ich Dir die bewährten Standard-Elemente, so wie sie von den Browsern standardmässig dargestellt werden, zu verwenden, auch wenn die Elemente nicht hundertprozentig ins Erscheinungsbild des Projektes passen. Nur auf diese Art kannst Du garantieren, dass Du ein robustes und stabiles Formular hast, das auf allen Geräten und Browsern tadellos funktioniert. Bei solchen Basisfunktionen eines Formulars sollte diese Garantie unser größter Anspruch sein.