Lernen Sie „Form Design Patterns“ kennen, unser neues Buch über barrierefreie Webformulare – jetzt erhältlich!

Formen. Es ist kein Zufall, dass sich das Wort auf „gähnt“ reimt – Webformulare sind langweilig zu programmieren und noch langweiliger für Ihre Besucher zum Ausfüllen. Aber ohne Formulare wäre das Web nur eine Bibliothek. Sie lassen uns kommentieren, sammeln, buchen, kaufen, teilen und viele andere Verben. Und meistens ermöglichen sie uns, diese Dinge auf eine unangenehme, undurchsichtige, verwirrende, seltsame, frustrierende, alarmierende oder entfremdende Weise zu tun. Formulare sind ein so wichtiger Teil des Webs, aber wir gestalten sie die ganze Zeit schlecht. Wenn sie nicht übertechnisiert sind, sind sie normalerweise überhaupt nicht konstruiert.

Mit dem neuen Buch Form Design Patterns wollen wir dieses Problem angehen. Indem Sie Schritt für Schritt allgemeine Probleme aus der Praxis durchgehen, lernen Sie, wie Sie einfache, robuste , leichtgewichtige , reaktionsschnelle, zugängliche , schrittweise erweiterte , interoperable und intuitive Formulare entwerfen, mit denen Benutzer Dinge erledigen können, egal was passiert. Und am Ende des Buches haben Sie eine nahezu erschöpfende Liste von Komponenten, die als Designsystem geliefert werden, das Sie sofort in Ihren eigenen Projekten verwenden können. (Zum Inhaltsverzeichnis springen.)

Inhaltsverzeichnis

Jedes Kapitel dreht sich um ein bestimmtes Problem – schließlich lösen wir Probleme im wirklichen Leben so. Aber machen Sie sich keine Sorgen, viele der Stile, Komponenten und Muster , die aus jedem Kapitel hervorgegangen sind, sind wiederverwendbar und weit über die Besonderheiten hinaus anwendbar, und Sie werden Beispiele dafür sehen, während wir uns durch das Buch bewegen.

Laden Sie den PDF-Auszug kostenlos herunter (0,7 MB), um ein Gefühl dafür zu bekommen, wie das Buch von innen ist.

1. Ein Anmeldeformular
   Wir beginnen damit, uns die grundlegenden Qualitäten eines gut gestalteten Formulars anzusehen und darüber nachzudenken. Indem wir ein sogenanntes Frageprotokoll anwenden, werden wir uns ansehen, wie wir die Reibung reduzieren können, ohne die Schnittstelle auch nur zu berühren. Dann sehen wir uns einige wichtige Muster an, einschließlich der Validierung, die wir für jedes Formular verwenden möchten.
2. Ein Checkout-Formular
   Wir betrachten Checkout-Abläufe und betrachten verschiedene Eingabearten und wie sie sich auf die Benutzererfahrung in mobilen und Desktop-Browsern auswirken, während wir gleichzeitig nach Möglichkeiten suchen, sowohl Erstkunden als auch wiederkehrenden Kunden dabei zu helfen, schnell und einfach zu bestellen.
3. Ein Flugbuchungsformular
   Wir werden mit ARIA in die Welt der schrittweise verbesserten , benutzerdefinierten Formularkomponenten eintauchen. Wir tun dies, indem wir untersuchen, wie Benutzer am besten Reiseziele auswählen, Daten auswählen, Passagiere hinzufügen und Sitzplätze auswählen können. Wir werden native Formularsteuerelemente analysieren und versuchen, uns von Konventionen zu lösen, wenn dies erforderlich wird.
4. Ein Anmeldeformular
   Wir werden uns das allgegenwärtige Anmeldeformular ansehen. Trotz seines einfachen Aussehens gibt es eine Reihe von Usability-Fehlern, unter denen so viele Websites leiden.
5. Ein Posteingang
   Wir werden Wege zur Massenverwaltung von E-Mails entwerfen, unser erster Blick auf Verwaltungsschnittstellen. Als solches bringt dies seine eigenen Herausforderungen und Muster mit sich, darunter ein responsives ARIA-beschriebenes Aktionsmenü, Mehrfachauswahl und Nachrichten auf derselben Seite .
6. Ein Suchformular
   Wir erstellen ein reaktionsschnelles Suchformular, das Benutzern auf allen Seiten leicht zur Verfügung steht, und wir werden auch die Bedeutung des Suchmechanismus berücksichtigen, der es antreibt.
7. Ein Filterformular
   Benutzer müssen oft eine große Menge unhandlicher Suchergebnisse filtern. Ohne einen gut gestalteten Filter müssen Benutzer aufgeben. Filter werfen eine Reihe interessanter und einzigartiger Designprobleme auf, die uns dazu zwingen könnten, Best Practices in Frage zu stellen, um Benutzern ein besseres Erlebnis zu bieten.
8. Ein Upload-Formular
   Viele Dienste wie Fotofreigabe, Messaging und viele Backoffice-Anwendungen ermöglichen es Benutzern, Bilder und Dokumente hochzuladen. Wir werden die Dateieingabe untersuchen und wie wir sie verwenden können, um mehrere Dateien gleichzeitig hochzuladen. Dann sehen wir uns die Feinheiten einer Drag-and-Drop-Oberfläche mit Ajax-Unterstützung an, die Tastatur- und Screenreader-Benutzer einbezieht.
9. Ein Spesenformular
   Wir werden das besondere Problem untersuchen, dass viele Ausgaben (oder irgendetwas anderes) in einem System erstellt und hinzugefügt werden müssen. Dies ist wirklich ein Vorwand, um das Muster add another zu behandeln, das in Verwaltungsschnittstellen oft nützlich ist.
10. Eine wirklich lange und komplizierte Form
    Einige Formulare sind sehr lang und das Ausfüllen dauert Stunden. Wir werden uns einige der Muster ansehen, die wir verwenden können, um die Verwaltung langer Formulare zu vereinfachen.

Über den Autor

Adam Silver ist ein Interaktionsdesigner mit über 15 Jahren Erfahrung in der Arbeit im Internet für eine Reihe von Unternehmen, darunter Tesco, BBC, Just Eat, Financial Times, das Ministerium für Arbeit und Renten und andere.

Er interessiert sich besonders für inklusives Design und Designsysteme und schreibt darüber in seinem Blog und in populären Designpublikationen wie A List Apart . Dies ist auch nicht sein erstes Buch: Zuvor hat er Maintainable CSS geschrieben, ein Buch über das Erstellen wartbarer UIs mit CSS.

Technische Details

• 384 Seiten, 14 × 21 cm ( 5,5 × 8,25 Zoll),
• ISBN: 978-3-945749-73-9 (Druck),
• Hochwertiger Hardcover mit Fadenheftung und Lesebändchen,
• Das eBook ist als PDF, EPUB und Amazon Kindle erhältlich.
• Kostenloser weltweiter Luftpostversand aus Deutschland. Lieferzeiten.
• Erhältlich als gedrucktes, hochwertiges Hardcover und eBook.

Referenzen

Unser Ziel war es, das Buch so praktisch und nützlich wie möglich zu gestalten . Wir fühlen uns geehrt, sehr positive Bewertungen von Leuten zu erhalten, die Websites in kleinem und großem Umfang erstellen.

• „Seit über 20 Jahren schreibe ich Formulare in HTML. Dieses Buch fängt die Essenz dessen ein, was es bedeutet, Standards zu übernehmen, schrittweise zu verbessern und einfache, zugängliche Formulare bereitzustellen . Durch die Formalisierung von Designmustern, die wir alle verwenden und implementieren können, können sich Entwickler und Designer auf ihre Website und ihr Produkt konzentrieren. Ich wünschte, das wäre schon vor 20 Jahren verfügbar gewesen!“
  — Paul Duncan, Designtechnologen und Lehrer für Barrierefreiheit
• „In einer Welt schrecklich markierter Formulare ist dieses Buch ein Leuchtfeuer, das den Weg zu zugänglicheren Benutzererfahrungen erhellt. Ich kann es jedem wärmstens empfehlen, der Benutzeroberflächen entwirft oder entwickelt, um die üblichen Fallstricke bei der Barrierefreiheit von Formularen zu vermeiden, denen wir allzu oft begegnen.“
  – Marcy Sutton, Befürworterin der Barrierefreiheit
• "Formen. Es ist kein Zufall, dass sich das Wort auf „gähnt“ reimt – Formulare sind langweilig zu programmieren und noch langweiliger für Ihre Besucher zum Ausfüllen. Sorgen Sie also dafür, dass sie für alle besser funktionieren, indem Sie die konkreten Tipps, den Code und die Mikrokopie in diesem Buch verwenden. Und nehmen Sie Ihr eigenes Gähnen weg, da Adam Silver die gesamte Recherche und Programmierung für Sie erledigt hat.“
  — Bruce Lawson, Verfechter von Webstandards
• „Form Design Patterns legt gesunden Menschenverstand und integrative Lösungen für einfache und potenziell komplexe Formulare dar. Es ist Ihr Begleiter, wenn Sie danach streben, ein einfacheres und einfacheres interaktives Web zu erstellen.“
  — Heydon Pickering, Berater für UX und Zugänglichkeit

Warum dieses Buch für Sie ist

Dieses Buch ist ein praktischer Leitfaden für alle, die alle Arten von Formularen für digitale Dienste, Produkte und Websites entwerfen, prototypisieren und erstellen müssen. Du lernst :

1. Verfügbare native Formularelemente und ihre Befugnisse, Einschränkungen und Einschränkungen.
2. Wann und wie barrierefreie benutzerdefinierte Formularkomponenten erstellt werden , die Benutzern im Vergleich zu ihren nativen Äquivalenten eine bessere Erfahrung bieten können.
3. Wie man Reibung in Formen durch sorgfältigen Umgang mit Sprache, Fluss und Ordnung deutlich reduziert .
4. Möglichkeiten (und Möglichkeiten nicht), Benutzern zu helfen, Formularfehler einfach zu beheben .
5. Umgang mit komplexen Schnittstellen , mit denen Benutzer Dateien hochladen und mehrere Elemente beliebiger Art hinzufügen können.
6. Möglichkeiten, Benutzer eine große Menge von Ergebnissen nach ihrem eigenen mentalen Modell durchsuchen und filtern zu lassen.
7. Wie man Kunden hilft, besonders lange und komplexe Formulare auszufüllen, deren Ausfüllen Wochen dauern kann.

Wir können es kaum erwarten, Ihre Meinung zu dem Buch zu hören! Viel Spaß beim Lesen und wir hoffen, dass Sie das Buch genauso nützlich finden wie wir. Halten Sie natürlich eine Tasse Kaffee (oder Tee) bereit, bevor Sie mit dem Lesen beginnen. Bleib smashing und ... miau !