3h 46m – Appropriate for all
In this course, interaction designer Luke Wroblewski shows how to create web forms that encourage visitors to enter information and covers ways to capture input without the use of forms. The course covers boosting conversion rates and customer satisfaction, organizing the structure of forms, aligning and grouping form elements, assigning the correct input field types, validating input, and handling data entry errors. The last chapter highlights alternatives to static forms, such as using dynamic inline forms, using web services, and leveraging device capabilities, which can be used to gather additional information or replace a traditional form altogether.
Topics include:
Understanding why forms matter
Deciding on the form length and structure
Adding tabs to a form
Creating required fields
Adding input masks
Creating selection-dependent inputs and actions
Displaying success and error messages
Adding inline validation
Understanding gradual engagement
Enabling touch and audio input on devices
Introduction – 6m 28s
Welcome – 1m 22s
Why forms matter – 5m 6s
1. Form Organization – 1h 33m
Form length – 9m 38s
Form structure – 4m 17s
Unnecessary inputs – 7m 40s
The path to completion – 11m 3s
Tabbing – 2m 43s
Label alignment – 19m 59s
Help and tips – 13m 19s
Field length – 3m 2s
Required fields – 5m 38s
Input groups – 6m 13s
International addresses – 9m 34s
2. Form Interaction – 1h 3m
Input types – 15m 22s
Smart defaults – 4m 12s
Input masks – 6m 32s
Additional inputs – 4m 24s
Selection-dependent inputs – 10m 14s
Actions – 9m 18s
Actions in progress – 3m 47s
Errors – 7m 15s
Success messages – 2m 29s
3. Moving Beyond Static Forms – 1h 1m
Inline validation – 16m 40s
Dynamic inline forms – 5m 6s
“Mad Lib” forms – 4m 44s
Gradual engagement – 7m 36s
Common tools – 8m 42s
Web services – 8m 26s
Device capabilities – 10m 30s
Conclusion – 1m 21s
Goodbye – 1m 21s