I was checking resources about what to use to make the errors in my form accessible and I found two possible approaches. Considering we are compiling a form, which approach is the correct one?
- To use
role="alert"which impliesaria-live="assertive". This will disrupt the flow of the user and the error will be announce
<form>
<label for="user-email">Email:</label>
<input type="email" id="user-email" aria-describedby="email-error">
<span id="email-error" role="alert">Error message</span>
</form>
- Use only
aria-live="polite"and make the assistive technology report the error after the user flow ended, without interrupting it immediately.
<form>
<label for="user-email">Email:</label>
<input type="email" id="user-email" aria-describedby="email-error">
<span id="email-error" aria-live="polite">Error message</span>
</form>