Form field error message component for the Municipality of Utrecht based on the NL Design System architecture
npm install @utrecht/form-field-error-message-cssGebruik dit component voor foutmeldingen bij formuliervelden die geen valide invoer hebben.
Dit component is meestal een onderdeel van het _form field_ component.
- form komt van in HTML en role="form" in WAI-ARIA.
- field komt van in HTML.
- error-message komt van aria-errormessage.
Gebruik een id attribuut op dit element, zodat je met aria-describedby op de _form control_ met aria-invalid="true" een koppeling kunt maken. Support voor aria-errormessage is nog onvoldoende, dus gebruik voorlopig nog aria-describedby.
Gebruik in HTML in plaats van aria-live="polite" het attribuut role="status".
Gebruik in HTML in plaats van aria-live="assertive" het attribuut role="alert".
- WCAG eis 1.4.1: gebruik niet alleen kleur om duidelijk te maken dat het een foutmelding is.
- WCAG eis 3.3.1. Gebruik id attribuut op de _form field description_ en koppel de _form control_ met aria-describedby aan deze id. Zie ook: WCAG Technique: Using aria-invalid to Indicate An Error Field
- WCAG eis 3.3.2. Zie ook: WCAG Technique ARIA1: Using the aria-describedby property to provide a descriptive label for user interface controls
- WCAG eis 3.3.2