WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: ARIA heading - hierarchy and screen readers

for

From: Birkir R. Gunnarsson
Date: Apr 8, 2015 11:06AM

Hi

Does the title line visually look like a heading?
If it does, , I would advocate for marking it up as such.
I believe it is not valid to use heading role without an aria-level,
even if it were its behavior is unpredictable and a.t. support maybe
spotty or inconsistent.
I would use aria-level="5" or "6" for these types of headings. That
definitely reflects their place within the page hierarchy, does not
disrupt user navigating by headings to any major sections (which
should be marked with h1, h2 or h3) and still enables users to quickly
locate these messages, if they so choose.
Cheers


On 4/8/15, Druckman,Geri < <EMAIL REMOVED> > wrote:
> Hi,
>
> We're in the process of re-doing our website, and with it a re-design.
> Within the re-design we have several floating components, and by 'floating'
> I do not mean CSS but they can be placed in varies spots on a page. Those
> components are short, promo like, snippet that have a title/header like
> line, a short paragraph, and a 'call to action' link at the end of it.
>
> Something like the following:
> Strength in Numbers (=title)
> Whether you're a fighter or caregiver, support is available to you and your
> loved ones. (=short paragraph)
> Connect with the Anderson Network (Êll to action link)
>
> My question is, should the title of this short promo snippet marked as a
> header?
> If not, we stop here, and it's all good.
>
> If it should be a header then this is where I have the next question. Those
> components can be placed anywhere on the page, and there is no way to
> predict header hierarchy, and proper nesting.
>
> My initial thought was to mark those titles with ARIA role="heading" and NOT
> use a aria-level. Is it acceptable to just use role="heading" without
> designating the header level?
>
> I also noticed when testing it (VoiceOver on MacOS 10.9.5, and JAWS
> 15.0.12085) that there are differences in how screen readers handle
> role="heading" without a specific level.
>
> JAWS read all the none defined role="heading" as heading level 2 regardless
> of their place on the page, or what the previous header was, and VoiceOver
> read all (with or without a level indicated) as "A X Header".
>
> In your opinion, can and should those promo snippets be marked with just
> role="heading" and no level, or should they just be left as-is untouched?
>
> Thanks,
>
> Geri Druckman
>
> Web Development Specialist
>
> Accessibility & Usability
>
> Department of Digital Experience
>
> MD Anderson Cancer Center
>
> T 713-792-6293 | F 713-745-8134
> > > > >


--
Work hard. Have fun. Make history.