Error suggestion

A form error that tells you how to correct the problem, not merely that your input was invalid.

tell me how to fix the formwhat should I type insteaderror message with the solutionshow the right date formatit just says invalid and I have no idea whythe form rejects my phone number and will not say whyinvalid input but no clue whyerror sugeston

See it

Live demo coming soon

What it is

Error suggestion means that once a form detects a mistake and knows a safe correction, it tells the user how to make it. 'Date must be in the future; use DD/MM/YYYY' equips someone to recover. 'Invalid value' only reports failure. WCAG 3.3.3 requires the suggestion when it is known, unless giving it would jeopardize security or the purpose of the content.

Pair the suggestion with error identification: name the field, state the constraint, and give a concrete next move. Keep the message beside the field and connect it with aria-describedby so assistive technology can find it. Preserve the user's input so the fix is an edit, not a restart.

Gotcha: do not scold people while they are still typing. Validate on blur or submit, then revalidate on change once an error exists. Suggestions also must not leak protected facts: a sign-in form should not reveal which part of a credential was correct just to sound more helpful.

Ask AI for it

Rewrite this form's validation to meet WCAG 3.3.3 Error Suggestion. For every detectable error, render text beside the field that names the constraint and gives a concrete correction, such as 'Use DD/MM/YYYY' or 'Choose a future date'. Connect the message with aria-describedby, set aria-invalid='true', preserve the entered value, and focus the first invalid field after submit. Use the Constraint Validation API and setCustomValidity() where native input rules can detect the error. Validate on blur or submit, then on change only while an error remains. For credentials and security checks, keep suggestions generic whenever specific guidance would disclose protected information.

You might have meant

error identificationform label associationaria live regionfocus managementuse of color