E-mail List Archives
Thread: Alert messages being interrupted by VoiceOver
Number of posts in this thread: 2 (In chronological order)
From: Nick Bromley
Date: Wed, May 24 2023 9:52AM
Subject: Alert messages being interrupted by VoiceOver
No previous message | Next message →
I'm testing error messaging on the sign in page of a website and have an
issue with VoiceOver. When submitting sign in details with invalid data,
error message text appears in a <div> with role="alert". Validation is
server side, so there is a page reload and focus is moved to the first input
field. The error message is announced automatically as expected by screen
readers, but on Mac and iOS the alert is immediately interrupted by
VoiceOver announcing information about that input field and autofill
options, so the error message text is not heard. Would this be considered a
bug or just the way that Safari/VoiceOver does things? I haven't encountered
that with JAWS, NVDA or TalkBack with Chrome or Firefox.
Other than changing focus behaviour so focus is placed on the error message
itself rather than an input field, is there a way to overcome the overriding
of the alert message?
- - -
Nick Bromley
Director & Accessibility Consultant
Red Kite Digital Accessibility Ltd
From: Birkir R. Gunnarsson
Date: Wed, May 24 2023 8:36PM
Subject: Re: Alert messages being interrupted by VoiceOver
← Previous message | No next message
You could remove role="alert" from the message and instead use
aria-describedby to connect the invalid input that receives focus and
the message element.
That way you likely get the announcement of the input label and type
and then the error message.
It's very hard to reliably and predictably use role="alert" especially
when a lot of things are happening at once, like a page being oaded or
an element receiving focus at the same time. as the alert is
displayed, so you almost have to expect inconsistencies between
browsers/screen readers
On 5/24/23, Nick Bromley < = EMAIL ADDRESS REMOVED = > wrote:
> I'm testing error messaging on the sign in page of a website and have an
> issue with VoiceOver. When submitting sign in details with invalid data,
> error message text appears in a <div> with role="alert". Validation is
> server side, so there is a page reload and focus is moved to the first input
> field. The error message is announced automatically as expected by screen
> readers, but on Mac and iOS the alert is immediately interrupted by
> VoiceOver announcing information about that input field and autofill
> options, so the error message text is not heard. Would this be considered a
> bug or just the way that Safari/VoiceOver does things? I haven't encountered
> that with JAWS, NVDA or TalkBack with Chrome or Firefox.
>
>
>
> Other than changing focus behaviour so focus is placed on the error message
> itself rather than an input field, is there a way to overcome the overriding
> of the alert message?
>
>
>
> - - -
>
> Nick Bromley
>
> Director & Accessibility Consultant
>
> Red Kite Digital Accessibility Ltd
>
> > > > >
--
Work hard. Have fun. Make history.