Benutzerfreundliche Formulare

[Matthias Scharwies]

Servus!

Hallo Matthias,

man muss mit den möglichen Usecases anfangen, und klassifizieren, welche man anbieten will und welche nicht. Business Analysis heißt das. Programmierer tun sich schwer damit, wir neigen zum einfach mal losgaloppieren, deshalb hat man in der IT zumeist eigene Leute dafür. Und dann die Requirement Engineers, die das BA Ergebnis für Leute wie dich und mich verständlich machen.

Wir haben von Mr. Password keine BA bekommen und deshalb schwimmen wir jetzt.

Ja.

Nein. Mein (kostenloses) Beispiel soll jetzt auch keine umfassende Komplettlösung für ein von Dritten gegen Geld programmiertes Backend sein.

---

Für ein Wiki-Beispiel sollten die Business-Anforderungen minimal sein.

Ich bin vor ein paar Wochen auf

• Formulare/Benutzereingaben zugänglich gestalten

gestoßen. Das ehemalige EinzelTutorial "Beschriftungen" habe ich um mehrere placeholder-Beispiele bereinigt und dort integriert.

Der Abschnitt "Mehrteilige Formulare" besteht aus einem Beispiel für fieldset, einem zu progress und zwei multistep-Tutorials ^[1], die beide eben noch nicht multistep sind:

1. Beispiel:Bestellformular_mit_verschiedenen_Abschnitten.html
2. Beispiel:Klassen_mit_JavaScript_umschalten_und_mit_CSS_nutzen2.html (Umfrage)

Was ich zusätzlich noch haben wollte (dort oder woanders), wäre ein Formular, in das man eben immer nur einen Datensatz eingibt und dann eine weitere Zeile mit leeren Eingabefeldern erzeugt werden kann.^[2]

Im Folgekapitel Formulare/Auswahllisten ^[3] gibt es mehrere Beispiele mit Pizza:

3. Beispiel:Radio vs Checkboxen

Könnte man das Thema durchgehend verwenden?

Für eine flexible Anmeldeseite, wie Password sie sich vorstellt, sieht das ganz anders aus. Das können wir für ihn nicht lösen. Wir könnten uns einen Ordner voller Anforderungen zusammenbrainstormen. Aber entsteht dabei etwas, was Password brauchen kann?

Ja, ein gutes Tutorial könnte ihm zeigen, dass man Formulare

• planen und in fieldsets gliedern muss,
• alle Eingabefelder mit label, aber nicht mit placeholder versieht
• mit JS schrittweise einblendet.

Die passgenaue Umsetzung können wir nicht leisten – da hast du Recht!

Herzliche Grüße

Matthias Scharwies

---

1. Mein Lastenheft:
   1x mit Ausgrauen, 1x mit Einblenden des aktuellen fieldsets - Änderung von title , h2 und aria-current="step"
   1x mit progress, 1x mit divs als bullet points ↩︎

2. Die Frage ist, ob man so etwas in einem „Anfänger“-Tutorial oder in einem Tutorial „Formulare mit JS – nur für Fortgeschrittene“ behandelt.
   Ein Tutorial, das sich nur auf die HTML-Elemente an sich konzentriert, würde heute imho nicht mehr ausreichen.
   Selbst der Einstieg Was ist ein Webformular? verwendet JavaScript. ↩︎

3. Dort gibt es einen FlipFlop-Schalter, der mit dem Checkbox-Hack arbeitet, vor dem wir eigentlich warnen.
   @Hörnchen hat uns ja seinen <toggle-switch> gezeigt, den man bei Web Components erklären könnte. Soll der Flip-Flop-Schalter schon vorher weg? ↩︎