Rule

Validate fields after they are touched (blurred), not before, and always on form submit.

Why

Premature errors are noise. Delayed errors after submit leave users hunting for what broke.

Must

• Show field-level errors only after the field has been blurred at least once.
• Revalidate in real time after the user begins correcting an error.
• Show all errors simultaneously on submit, not just the first one.
• Move focus to the first error on submit.
• Associate each error message with its field via aria-describedby.

Should

• Show success indicators for fields with non-trivial validation after they pass.
• Give character count hints for fields with length limits.

Anti-patterns

• Validating while the user is still typing (on every keystroke).
• Submit fails but focus stays on the button.
• Error messages that disappear before the user reads them.

Test Cases

• Error shows after blur but not during typing.
• Focus moves to first error field on invalid submit.
• Screen reader reads error after correction.

Telemetry

• form_validation_error_shown
• form_submit_blocked_by_validation
• form_submit_success