What It Is
An online form is any interaction in which a user supplies information to complete a task. Examples of online forms are event registrations, travel reservations, and customer questionnaires.
Why It's Important
- Fifty percent of U.S. adults read at the 8th grade level or below
- A well designed form balances the needs of low- and high-literacy users
- Your online form might be the only thing standing between your site visitor's goals and your agency's goals
- Your online forms can make your site usable, or unusable
By making your agency forms easy to understand and complete, you help the public get things done quickly without having to ask for assistance. This saves valuable time for both your agency and the public, and can lead to better customer service.
OMB Policies for Federal Agency Public Websites require agencies to (#1A) "disseminate information to the public in a timely, equitable, efficient and appropriate manner," and (#2A) "maximize the quality, objectivity, utility, and integrity of information and services provided to the public."
OMB guidance encourages federal agencies to test and simplify federal forms "to identify ways to reduce burdens and to increase simplification and ease of comprehension."
How to Implement
Here are some guidelines to create online forms that are easy for your customers to understand and use:
- Be sure the form interaction is linear; remember, tab order matters.
- Place examples and field names before an entry: people, and screen readers, read left to right.
- Build templates or business rules for common fields (such as for displaying a phone number).
- Make required elements obvious. Consider using the word “required” rather than an asterisk (which means the user must find the definition of the asterisk). Words are also easier to see than small asterisk symbols.
- Create forms that can be filled out within a Web browser (and submitted there, too).
- If a form is built as a table, make it accessible so that people using screen readers can hear the form element description next to the entry field.
- Explore using wizards (instead of forms) to walk users through questions that only apply to them.
- Make form code shareable, and create APIs for common drop-down menus.
- Avoid jargon and use plain language so users can easily understand your form. If jargon can't be avoided, provide help text to explain the term.
|The words "CRN" and "Telecode" are difficult to understand.|
- Separate final actions such as "Submit" from actions that can retract data, such as "Reset."
|The "Submit Form" and "Reset Form" buttons are dangerously close to each other. The user can accidentally reset the form when he or she intend to submit it.|
- Present error messages that clearly identify a problem, tell the user what to do to fix it, and ensure that the error message is easy to see.
|The error message blends in with the rest of the page and is easy to overlook. Highlighted or red text would be easier to see.|
- Provide inline validation that checks if the user's fields are appropriate. Let users know if they need to change a field.
|Each line is validated and clear feedback is given. Find more guidelines in Usability of Online Forms (MS PowerPoint, 583 KB, 21 slides, December 2012)|
- Design your form—or review your existing forms—using these resources:
- Authorization to Disclose Personal Health Information Form at Medicare.gov
- FTC’s Complaint Assistant form
- U.S. Postal Service Change of Address form
- Online Forms Checklist (PDF, 26 KB, 2 pages, July 2008)—design best practices developed by online literacy expert Dr. Kathryn Summers of the University of Baltimore
- Usability of Online Forms (MS PowerPoint, 583 KB, 21 slides, December 2012), by Cynthia Nguyen, First Friday Usability Testing Program team member
- Creating Usable Online Forms—Usability.gov article
- An Extensive Guide to Web Form Usability—Smashing Magazine
- How to Build Web Forms: Top 10 Best Practices—DesignModo
- Creating Online Surveys