WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Non-dynamic alerts in web page

for

From: Birkir R. Gunnarsson
Date: May 5, 2020 3:58AM

I would use the <aside> element or role="complementary" over the
region role (I think it's slightly better semantic match, not that it
matters overly much).
Add aria-label="announcement" or "important" or some such.
You could use an h1 at the top of the alert text as well to make it
important in the heading structure of the page, h2 if the announcement
is less important.
If you can fit the alert inside but at the top of the main content of
the page you should be fine.
If you have to put it before the main content the role="alert" may be
a possible consideration, depending on how important it is that users
are aware of it (if the text is that all services are currently down
it may be worth the alert role).
Unlike live regions content with role="alert" gets announce on page
load in some screen reader/browser combos, at least on Chrome. I have
to run a little test on this to get a better feeling for it. Since
we're looking at similar questions at work I should be able to get a
better idea today or tomorrow.


On 5/4/20, <EMAIL REMOVED> < <EMAIL REMOVED> > wrote:
> Hi Todd,
>
> Long time no see. I would not use any kind of aria-live region for these
> static announcements. My Personal recommendation is two fold:
>
> 1. Place in high in the reading order, depending on Importance. This could
> be as high as right after the skip navigation link. This may not always be
> easy or possible.
> 2. Put it in an element with role="region" (my suggestion is <div> or
> <section>) with an informative aria-label as you suggested. Depending on
> the criticality of the message, you could start the aria-label attribute
> with something like "Important:".
>
> Thankx,
> Joe Humbert
> Accessibility Champion
> Android & iOS Accessibility Novice
>
> -----Original Message-----
> From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of
> Weissenberger, T M
> Sent: Monday, May 4, 2020 1:44 PM
> To: <EMAIL REMOVED>
> Subject: [WebAIM] Non-dynamic alerts in web page
>
> Colleagues,
>
> My understanding of the ARIA alert is that is announces assertively to
> screen readers when an element with the alert role is dynamically generated
> or revealed. Is there an agreed-upon best practice for when this
> information
> is not presented dynamically, but is instead static? I'm thinking about
> things like public safety announcements or the many COVID-19 updates we're
> now seeing pinned to the beginning of a webpage.
>
> Should we be using <section> or a region role with an informative
> aria-label? Is there some better way to emphasize this specialized,
> high-level info?
>
> Any thoughts are welcome.
>
> Kind regards,
> T.M.
>
> T.M. Weissenberger
> IT Accessibility Coordinator
> University of Iowa
>
> 2800 University Capitol Centre
> 200 S. Clinton Street
> Iowa City, IA 52242
>
> <EMAIL REMOVED> <mailto: <EMAIL REMOVED> >
> 319.384.3323
>
> > > http://webaim.org/discussion/archives
> >
> > > > >


--
Work hard. Have fun. Make history.