Wrapper to allow user to submit data in a form.
- Users have the option to add new information.
- Users have the option to update information that already exists.
- Displaying information that cannot be edited via an action in the user's control such as selecting an option on the page to enable the form or contacting their client manager.
- Always use labels on input elements in forms.
- Always display labels with the input element.
- Never use a label or help text as a placeholder value.
- Do not ask for more information than is required.
- Be concise when writing help text.
- If inputs can be grouped, group with a short, descriptive heading.
- Order input items and groups from mandatory to optional.
- Order inputs in a form that make logical sense to the user (eg. first name before last name).
- Group inputs logically (eg. All personal information elements together, all address elements together).
- Consider adding headings to grouped inputs.
- Keep labels short and to the point.
- Always write labels in sentence case.
- Always indicate required fields using a red asterisk.
- Use only when required to understand the format of an entry (eg. phone number or date format).
- Leave blank if not required (eg. email format).
The most common usage of a form.
Use when there are 1-2 input elements in a layout element that does not have the height to permit vertical forms layouts.
- Users must be able to navigate the form via keyboard (eg. Tab to get to the next input).