WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Aria Alert and Progress Loaders

for

From: Birkir R. Gunnarsson
Date: Sep 10, 2020 7:04AM

Well, I used to think so too, but sometimes you need to mark up an
important announcement on a page, one that gets aggressive visual
treatment (imagine an emergency closure alert).
You can do the right things, place it at the top of the page or the
main content, mark it with an h1, but ultimately sometimes you want it
announced. The alert role would work well in this scenario, and I
think there is a role or attribute that should trigger announcement on
page load (doing it by hacking delays and injection with Javascript is
not super reliable).
Then again I am maybe just temporarily being swayed by dealing with a
specific practical problem.


On 9/10/20, Patrick H. Lauke < <EMAIL REMOVED> > wrote:
> On 10/09/2020 13:47, Birkir R. Gunnarsson wrote:
>> I've found a similar issue in that content of elements with
>> role="alert" gets announced on page load in Chrome (I have not tested
>> Edge), but does not get announced in Firefox.
>> In fact, in Firefox, you have no idea what alerts are on the page,
>> unless they get dynamically injected.
>
> And this (alerts announcing after page load, once content is actually
> injected into the container) is how they generally should behave. The
> fact that some browser/AT combos fire an explicit announcement already
> on page load is more a bug/inconsistency than a feature. In general, the
> process should be:
>
> - have a container that's empty on page load, with aria-live="..." or a
> relevant (implicit or explicit) live region role.
> - once the page is loaded, you can update the content dynamically, and
> this change will trigger an announcement by AT.
>
> Getting back to the thread starter: it would obviously be good to see
> this in action, as it's difficult to debug/offer advice on this purely
> theoretically.
>
> P
> --
> Patrick H. Lauke
>
> https://www.splintered.co.uk/ | https://github.com/patrickhlauke
> https://flickr.com/photos/redux/ | https://www.deviantart.com/redux
> twitter: @patrick_h_lauke | skype: patrick_h_lauke
> > > > >


--
Work hard. Have fun. Make history.