When to Use
Apply when designing input fields, form controls, validation, and user data entry interfaces.
Rules
- •Provide visible labels for all form controls
- •Associate labels programmatically with their corresponding inputs
- •Group related form fields with clear legends
- •Provide clear instructions for required fields and formats
- •Display error messages near the related form fields
- •Preserve user input when form validation fails
- •Provide multiple ways to submit forms
- •Ensure form controls are keyboard accessible
- •Clearly identify errors in text with specific descriptions
- •Provide confirmation for critical actions (legal, financial, data changes)
- •Allow users to review and correct information before submission
Avoid
- •Using placeholder text as the only field label
- •Hiding labels that are only visible to screen readers
- •Ambiguous error messages that don't identify the problem
- •Auto-advancing focus that disrupts user control