WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: forms and multiple aria-live regions

for

From: Birkir R. Gunnarsson
Date: May 24, 2018 7:12PM

I think this set up is less than ideal. The errors may be located
farther away from the invalid input fields making it difficult for
people using screen magnification to discover them.

It is better design to place the error message inline with the invalid
field and connect the two using aria-describedby (make sure only to do
this when the error message is visible).
That being said, you may be too far along in the process to change it now.
If you stick with your setup the key is to place focus on the first
error message when it is displayed rather than using live regions.
Ideally the error message should be a link to the associated input
element, making it faster for users to get to it.
I created a side-by-side comparison the techniques using HTML5 validation.
I need to upload it to Codepen, I'll try to fit that into my schedule
tomorrow and post back to this thread with links.



On 5/24/18, Jonathan Avila < <EMAIL REMOVED> > wrote:
> In my experience use of role alert may cause screen readers to announce
> content outside the current tab. This can be problematic when the user is
> on another tab and ARIA alerts are fired that are not emergencies.
>
> Jonathan
>
>