Formulare

Vier Bauteile: Feld, Auswahl, Ankreuzfeld und die Hülle Formular, die den Abstand zwischen ihnen hält. Zusammen ergeben sie jedes Formular auf der Seite — Kontakt, Anmeldung, Profilanlage.

Ein Feld ist nie nur der Kasten. Es besteht aus Beschriftung, Kasten, gegebenenfalls einem Hinweis und im Fehlerfall einer Meldung — und diese vier Teile müssen technisch miteinander verbunden sein, damit eine Vorlesehilfe sie zusammen vorliest. Das je Formular neu zu schreiben, geht ein paarmal gut. Deshalb steht es hier einmal.

Eingabefelder

Mindestens 48 Pixel hoch — darunter wird das Treffen mit dem Daumen unzuverlässig. Der Rahmen ist kräftiger als eine gewöhnliche Trennlinie, weil er das Einzige ist, woran man erkennt, wo man hineinschreiben kann.


Feld

Der Platzhalter zeigt ein Beispiel. Er ersetzt die Beschriftung nicht — er verschwindet, sobald jemand tippt.

Mit Hinweis

Der Hinweis steht unter dem Feld und beantwortet die stille Frage »warum wollen die das wissen«. Bei allem, was persönlich ist, lohnt er sich fast immer.

Freiwillig. Wir rufen nur an, wenn du es im Gespräch ausdrücklich möchtest.

Im Fehlerfall

Rahmen, Fläche und Meldung ändern sich zugleich — die Farbe allein trüge die Aussage nicht, denn etwa jeder zwölfte Mann unterscheidet Rot und Grün nicht. Die Meldung steht über einem etwaigen Hinweis, damit eine Vorlesehilfe sie zuerst liest.

Mehrzeilig

Auswahlfelder

Sehen absichtlich genauso aus wie ein Eingabefeld: gleiche Höhe, gleicher Rahmen, gleiche Beschriftung. Nur der Pfeil sagt, dass hier ausgewählt und nicht geschrieben wird.


Auswahl

Die erste Zeile ist nicht wählbar. So ist beim Öffnen der Seite nichts vorausgewählt, und wir bekommen keine Anfragen mit einem Anliegen, das niemand angegeben hat.

Ankreuzfelder

Die Beschriftung ist hier meistens ein ganzer Satz, deshalb umschließt sie das Kästchen — der gesamte Satz ist anklickbar, nicht nur ein Quadrat von zwanzig Pixeln.


Ankreuzfeld

Das echte Kästchen bleibt im Dokument und wird nur unsichtbar gemacht. Ein nachgebautes aus <div> verlöre Tastaturbedienung und Formularverhalten, und beides müsste man dann von Hand nachbauen.

Etwa einmal im Monat. Abmeldung mit einem Klick.

Ein ganzes Formular

So sieht die Kontaktanfrage aus. Sieben Felder wären zu viele — jedes zusätzliche Feld kostet messbar Abschlüsse. Name, Kontaktweg, Anliegen, Nachricht: mehr klärt sich im Gespräch, das wir mit dem Formular ja gerade herbeiführen wollen.


Formular, zweispaltig

Unter 620 Pixeln klappen die beiden Spalten von selbst untereinander. Ein Feld, das über beide laufen soll, steht in FeldBreit.

Alles, was du hier schreibst, liest zuerst Kerstin persönlich.

Auf dunklem Grund

Kommt im Entwurf am Ende der Startseite vor. Der Fokusrahmen wechselt dort auf Gelb — Violett auf Violett wäre unsichtbar, und der Fokusrahmen ist für alle, die mit der Tastatur bedienen, das Einzige, woran sie sehen, wo sie sind.


Felder, dunkel