WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: ARIA heading - hierarchy and screen readers

for

Number of posts in this thread: 11 (In chronological order)

From: Druckman,Geri
Date: Wed, Apr 08 2015 11:00AM
Subject: ARIA heading - hierarchy and screen readers
No previous message | Next message →

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

From: Birkir R. Gunnarsson
Date: Wed, Apr 08 2015 11:06AM
Subject: Re: ARIA heading - hierarchy and screen readers
← Previous message | Next message →

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 ADDRESS 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.

From: Druckman,Geri
Date: Wed, Apr 08 2015 11:22AM
Subject: Re: ARIA heading - hierarchy and screen readers
← Previous message | Next message →

Yes, the title line is visually designed to look like a heading.
If it is needed to specifically indicate the heading level, then I¹d
rather straight up use h5 or h6 (isn¹t simpler better?), but then if that
promo component is placed on the page following a h2 header, and followed
by a h3 header, all accessibility testers will alert that the headers are
not in hierarchical order.

Does the order not matter as much?

Which is the lesser ³evil²? Not marking a heading on a component that is
not really part of the content/story, or marking heading and risking it to
disrupt the heading order and hierarchy on the page?

Geri

On 4/8/15, 12:06 PM, "Birkir R. Gunnarsson" < = EMAIL ADDRESS REMOVED = >
wrote:

>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 ADDRESS 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.
>>>>

From: Birkir R. Gunnarsson
Date: Wed, Apr 08 2015 11:41AM
Subject: Re: ARIA heading - hierarchy and screen readers
← Previous message | Next message →

I actually believe this is very much in line with proper heading hierarchy.
This is a subsection of less importance )or at least less content)
than the next subsection on the page.
Yes, you may be skipping heading levels which is not an accessibility
failure under WCAG 1.3.1 except in some seriously strict
interpretation.
It will help screen reader users rather than hinder them.
The problem would come up if you marked these as h1 or h2 headings,
and then these little messages would look like primary content on the
page and disrupt the screen reader heading navigation that the user
expects.



On 4/8/15, Druckman,Geri < = EMAIL ADDRESS REMOVED = > wrote:
> Yes, the title line is visually designed to look like a heading.
> If it is needed to specifically indicate the heading level, then I¹d
> rather straight up use h5 or h6 (isn¹t simpler better?), but then if that
> promo component is placed on the page following a h2 header, and followed
> by a h3 header, all accessibility testers will alert that the headers are
> not in hierarchical order.
>
> Does the order not matter as much?
>
> Which is the lesser ³evil²? Not marking a heading on a component that is
> not really part of the content/story, or marking heading and risking it to
> disrupt the heading order and hierarchy on the page?
>
> Geri
>
> On 4/8/15, 12:06 PM, "Birkir R. Gunnarsson" < = EMAIL ADDRESS REMOVED = >
> wrote:
>
>>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 ADDRESS 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.
>>>>>>>>>
> > > > >


--
Work hard. Have fun. Make history.

From: Duff Johnson
Date: Wed, Apr 08 2015 12:55PM
Subject: Re: ARIA heading - hierarchy and screen readers
← Previous message | Next message →

Whatever you say about headings here... is this really generalizable?

Consider the case of a lawnmower manual. The most "important" text in the manual is the warning not to try to clear the mower while it's running. However, this may well not be "heading" text - maybe it's simply a paragraph within the "Critical Information" section, or whatever.

So what are you to do, with this "headings mean importance" idea in such a case?

- Following the idea that heading tags definitely connote "importance" you could argue that the warning text get should be H1 or H2.
- Following the idea that "this warning isn't a section heading, but it's still important" you could (I guess) justify using H5 or H6.

Either way, you have left any chance at consistent and predictable navigation far behind. "Importance" per se is wholly subjective - after all, instructions for starting the mower are also very "important".

"Importance" is far from synonymous with "heading". Want to use a semantic tag for this purpose? Use <strong> instead.

Note that HTML5 (and PDF, for that matter) is clear on this exact question: Heading tags are about sections - ***not*** importance.

Maybe I'm a purist. In my view (and I'm interested to hear from others on this): for HTML5, you can't get 1.3.1 (not to mention 4.1.1) right if you use headings to connote "importance" rather than following HTML5's unambiguous design intent (as evidenced by the change from HTML 4).

I blame this endless confusion about headings (an idea at the very CORE of accessibility!) on the fact that HTML4 (at least) is a very poor facsimile of the semantics people actually need (and use) in their documents.

That, and the fact that since web pages are short the size and organization of each "page" just hasn't, historically, mattered that much.

That's why there are rules for "web pages" and somewhat different rules for other forms of content….

Duff.



> On Apr 8, 2015, at 13:41, Birkir R. Gunnarsson < = EMAIL ADDRESS REMOVED = > wrote:
>
> I actually believe this is very much in line with proper heading hierarchy.
> This is a subsection of less importance )or at least less content)
> than the next subsection on the page.
> Yes, you may be skipping heading levels which is not an accessibility
> failure under WCAG 1.3.1 except in some seriously strict
> interpretation.
> It will help screen reader users rather than hinder them.
> The problem would come up if you marked these as h1 or h2 headings,
> and then these little messages would look like primary content on the
> page and disrupt the screen reader heading navigation that the user
> expects.
>
>
>
> On 4/8/15, Druckman,Geri < = EMAIL ADDRESS REMOVED = > wrote:
>> Yes, the title line is visually designed to look like a heading.
>> If it is needed to specifically indicate the heading level, then I¹d
>> rather straight up use h5 or h6 (isn¹t simpler better?), but then if that
>> promo component is placed on the page following a h2 header, and followed
>> by a h3 header, all accessibility testers will alert that the headers are
>> not in hierarchical order.
>>
>> Does the order not matter as much?
>>
>> Which is the lesser ³evil²? Not marking a heading on a component that is
>> not really part of the content/story, or marking heading and risking it to
>> disrupt the heading order and hierarchy on the page?
>>
>> Geri
>>
>> On 4/8/15, 12:06 PM, "Birkir R. Gunnarsson" < = EMAIL ADDRESS REMOVED = >
>> wrote:
>>
>>> 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 ADDRESS 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.
>>> >>> >>> >>> >>
>> >> >> >> >>
>
>
> --
> Work hard. Have fun. Make history.
> > > >

From: Angela French
Date: Wed, Apr 08 2015 1:51PM
Subject: Re: ARIA heading - hierarchy and screen readers
← Previous message | Next message →

So what about wrapping it in a <section> tag which, as I understand it, will allow you to use a header outside of the linear order of headers.

Angela French

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Druckman,Geri
Sent: Wednesday, April 08, 2015 10:00 AM
To: WebAIM Discussion List
Subject: [WebAIM] ARIA heading - hierarchy and screen readers

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

From: Steve Faulkner
Date: Wed, Apr 08 2015 2:13PM
Subject: Re: ARIA heading - hierarchy and screen readers
← Previous message | Next message →

On 8 April 2015 at 20:51, Angela French < = EMAIL ADDRESS REMOVED = > wrote:

> So what about wrapping it in a <section> tag which, as I understand it,
> will allow you to use a header outside of the linear order of headers.

.

The HTML5 Recommendation is clear on use of headings in conjunction with
sections:

authors are strongly encouraged to use headings of the appropriate rank for
> the section's nesting level.


http://www.w3.org/TR/html5/sections.html#outlines

nit: headings (h1-h6) are not ,'headers'. There is a <header> element which
does not equal a heading, a th (table header) element and a headers
attribute in HTML
--

Regards

SteveF
HTML 5.1 <http://www.w3.org/html/wg/drafts/html/master/>;

From: Gunderson, Jon R
Date: Wed, Apr 08 2015 4:10PM
Subject: Re: ARIA heading - hierarchy and screen readers
← Previous message | Next message →

Geri,

The role=heading does require an aria-level attribute, see.
http://www.w3.org/TR/wai-aria/roles#heading

In general through you should use a standard heading element (e.g. H1, H2,
H2Å ), ARIA should be reserved for cases when there are not native
semantics for the feature or it is a repair situation and the code changes
would affect behavior or styling of the original web resource.

Jon


On 4/8/15, 1:00 PM, "Druckman,Geri" < = EMAIL ADDRESS 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
>>>>

From: _mallory
Date: Thu, Apr 09 2015 4:42AM
Subject: Re: ARIA heading - hierarchy and screen readers
← Previous message | Next message →

On Wed, Apr 08, 2015 at 02:55:28PM -0400, Duff Johnson wrote:
> "Importance" is far from synonymous with "heading". Want to use a semantic tag for this purpose? Use <strong> instead.

But strong has zero meaning to any UA. It styles stuff a bit bolder.
For any user it's no different from adding a class of "heading" and
styling to taste.

>
> Note that HTML5 (and PDF, for that matter) is clear on this exact question: Heading tags are about sections - ***not*** importance.
>
Which is too bad, because most HTML pages are *nothing* like school
paper documents: usually the h1 and the main content are after all
the "page stuff". Especially e-commerce: you almost always have headings
before the h1, meaning you cannot use school-paper structure and have
headings going from h1 to h2 to h3, etc.

What almost every web page has today is a "site" set of information,
and a unique "page" set of information. These actually usually need
completely different heading levels, but because we're still using
a "single document" idea, we munge it all together instead.

Either that, or you must stop using headings before sections like
nagivation sections, column headings, etc. These are more often before
the main content and h1 than other way around.

Once upon a time we devs used to use a brittle, magical CSS setup called
"Holy Grail" where the page was divided into columns and the main column
was placed first in source. The other two were wrapped around using
convoluted floats and negative margins. Granted, everyone did this to
please the SEO voodoo cultists rather than for accessibility reasons,
but it was often toted as a "win-win" for both.

I haven't seen a Holy Grail layout in a few years now.

_mallory

From: Duff Johnson
Date: Thu, Apr 09 2015 7:32AM
Subject: Re: ARIA heading - hierarchy and screen readers
← Previous message | Next message →

> On Wed, Apr 08, 2015 at 02:55:28PM -0400, Duff Johnson wrote:
>> "Importance" is far from synonymous with "heading". Want to use a semantic tag for this purpose? Use <strong> instead.
>
> But strong has zero meaning to any UA.

Implementation is - of course - another matter, but the meaning of <strong> is clearly defined in the specification.

Consider: what's the better outcome?

- Everyone continues to ignore <strong> (or treat it as a mere styling point) and the world stays with inconsistent hacks that violate the spirit (if not the letter) of WCAG 2.0, negates the richness of the format, and forces AT users to remain as 2nd class consumers… or

- People start to pay attention to the specification, and thus finally move the accessibility subject past its tiny cabal of activists and into the mainstream.

> It styles stuff a bit bolder.

<strong> doesn't "style" at all. The world of content is not defined by browser defaults.

…or are you next going to tell me that content within an <a href> tag "is" underlined?

> For any user it's no different from adding a class of "heading" and
> styling to taste.

Back to the classic confusion between semantics and style…

<strong> is a perfectly reasonable semantic tag. If developers fail to take the specification seriously because of a deep, unrelating HTML4 hangover… who's fault is that?

The the (correct) use of <strong> would make it easy for AT users to locate items the author deemed of critical importance without confusing the matter with sections and headings.

But of course, if one ignores the specification, and simply considers <strong> as a styling cue, then you won't see any value, won't leverage the richness and your AT users will still be 2nd class consumers.

One should, I think, not spend too much energy defending and facilitating the tendency of web-developers to serve slop.

>> Note that HTML5 (and PDF, for that matter) is clear on this exact question: Heading tags are about sections - ***not*** importance.
>>
> Which is too bad, because most HTML pages are *nothing* like school
> paper documents: usually the h1 and the main content are after all
> the "page stuff". Especially e-commerce: you almost always have headings
> before the h1, meaning you cannot use school-paper structure and have
> headings going from h1 to h2 to h3, etc.

No-one said web-pages are "like" paper documents… I'm with you there!

> What almost every web page has today is a "site" set of information,
> and a unique "page" set of information. These actually usually need
> completely different heading levels, but because we're still using
> a "single document" idea, we munge it all together instead.

Leaving aside certain eccentricities (for the moment)… HTML5's <section> model and/or ARIA roles addresses this, does it not?

> Either that, or you must stop using headings before sections like
> nagivation sections, column headings, etc. These are more often before
> the main content and h1 than other way around.

You must simply use the format according to its specification, and educate others to do the same.

Fail to do that and you are tossing consistent accessibility (and the chance of it becoming widespread) down the rat-hole.

> Once upon a time we devs used to use a brittle, magical CSS setup called
> "Holy Grail" where the page was divided into columns and the main column
> was placed first in source. The other two were wrapped around using
> convoluted floats and negative margins. Granted, everyone did this to
> please the SEO voodoo cultists rather than for accessibility reasons,
> but it was often toted as a "win-win" for both.
>
> I haven't seen a Holy Grail layout in a few years now.

Hacks either eventually die or become part of the specification… In this case it looks (sort of) like the latter - now HTML5 has <section> to meet this need. :-)

Duff.

From: Angela French
Date: Thu, Apr 09 2015 9:01AM
Subject: Re: ARIA heading - hierarchy and screen readers
← Previous message | No next message

Mistyped that. I meant heading.

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Steve Faulkner
Sent: Wednesday, April 08, 2015 1:13 PM
To: WebAIM Discussion List
Subject: Re: [WebAIM] ARIA heading - hierarchy and screen readers

On 8 April 2015 at 20:51, Angela French < = EMAIL ADDRESS REMOVED = > wrote:

> So what about wrapping it in a <section> tag which, as I understand
> it, will allow you to use a header outside of the linear order of headers.

.

The HTML5 Recommendation is clear on use of headings in conjunction with
sections:

authors are strongly encouraged to use headings of the appropriate rank for
> the section's nesting level.


http://www.w3.org/TR/html5/sections.html#outlines

nit: headings (h1-h6) are not ,'headers'. There is a <header> element which does not equal a heading, a th (table header) element and a headers attribute in HTML
--

Regards

SteveF
HTML 5.1 <http://www.w3.org/html/wg/drafts/html/master/>;