UI DESIGN LAB
  • Home
  • Community
  • Library
  • Knowledge
  • Docs
ZHLogin
Back to knowledge
Typography Color Accessibility

Accessible Form Feedback

Form feedback should sit near fields, explain why, and remain understandable before and after submission.

formsaccessibilityfeedback

Design Principle

Error messages are not punishment; they guide users toward completion.

Principle Error messages are not punishment; they guide users toward completion.

Design action Each field needs label, help text, error text, and visible focus; submit buttons should show loading, success, and error states.

Examples Positive example: Submission, login, edit, filter, and payment forms. Counterexample: Only a generic error appears at page bottom.

Apply when Submission, login, edit, filter, and payment forms. Fields have format, permission, or required constraints.

Source notes Source note: Synthesized from W3C WCAG 2.2, Apple Accessibility, IBM Carbon Accessibility, and accessibility practices in major design systems.

Agent Directive

Each field needs label, help text, error text, and visible focus; submit buttons should show loading, success, and error states.

Apply When

  • Submission, login, edit, filter, and payment forms.
  • Fields have format, permission, or required constraints.

Avoid

  • Only a generic error appears at page bottom.
  • Error state uses only a red border.

Knowledge Metadata

Category
Typography Color Accessibility
Quality
82%
Version
v1
Published
6/6/2026