RE: heading level order

Thanks, all.

I believe I hear a general consensus that the preferred use for heading tags is for logical document-depth detail while classes handle the visual style, for the benefit of screen readers as well as search engine parsers.  It is my understanding that all screen readers handle h-tags appropriately, while aria-heading is more version/vendor dependent, and therefore not recommended as a substitute.  This, of course, is not common as heading tags are very frequently used as a style cue rather than for logically ordering content.  I hope to take the best-practice approach in the future.

Ian

-----Original Message-----
From: Morten Tollefsen [mailto:morten@medialt.no] 
Sent: Tuesday, May 29, 2012 9:40 AM
To: Johnson, Shawn [USA]; w3c-wai-ig@w3.org
Subject: SV: heading level order

Hi!

This is often the case, Visual consistency is of course important, and therefore headings should often have the same visual presentation from page to page. Sometimes however you'll use headings as a navigation mechanism typically meant for screen readers. An example:

I was involved in designing felleskatalogen.no (actually not 100% finished at this point). This is the official drug information system in Norway. When you've selected a product you'll get a lot of information, e. g. what's written on the drug. This page did not have headings (except for the main h1 heading, drug name) when I started to work on the new site. Therefore we wanted to have h2 tags for the different information categories. Visually this was written as "Bold text": ....
(like it is on the paper version). H2 tags on other places is more like standard headings on a separate line etc. The solution Is of course to use css and make the headings inline (with appropriate formatting).

Therefore a single css is of course OK, but headings may have different classes. I've also quite often used specific h-classes to improve screen reader navigation without changing the visual presentation. Therefore two h2 tags on the same page can have different visual formatting.


Mvh: Morten Tollefsen
www.medialt.no, 908 99 305


-----Opprinnelig melding-----
Fra: Johnson, Shawn [USA] [mailto:johnson_shawn@bah.com]
Sendt: 29. mai 2012 15:00
Til: w3c-wai-ig@w3.org
Emne: Re: heading level order

Thanks for everyone's responses so far.  I work with Ian and this has been a long running discussion on our project.

I'm going to follow-on here.  If you are building a "site" with many "pages", isn't it typical that you have a shared CSS file for the entire site?  In that shared.css, wouldn't you typically define global styles for Heading elements?  I ask this way, because this is the way I have always seen.  Some "pages" may have an H1, H2, H3, while others may have only 3
H3 tags and no H1 tag.  We want to enable the most accessible site we can, however we also want to figure a way that doesn't create a lot of extra work for every "page".  Maybe the heading role is the answer?

If we go with roles, do we do that instead of using header tags?  Does this pose an issue for older readers?

Thanks!
-=Shawn Johnson
  

On 5/25/12 3:52 PM, "David Best" <davebest@ca.ibm.com> wrote:

>Ian, it is recommended that you use a structured Header hierarchy of 
>Headers. If a screen reader navigates by Headers, and skips from a h2
to a
>h4, they might assume they are missing information that the screen
reader
>is not picking up, but web sites rarely follow this principle. You can 
>skip Header levels, but you might prefer to use CSS to style your 
>Header structure. Also, you can use the W3C/WAI ARIA code to make text 
>look
like
>Headers to screen readers. See the WAI/ARIA "5.3.3. Document Structure"
>for
>the Heading Role.
>http://www.w3.org/TR/wai-aria/roles#heading
>example:
><div role=heading aria-level=2>Section Content Sample</div>
>
>Cheers, David
>
>
>
>
>
>From:	"Stewart, Ian [USA]" <Stewart_Ian@bah.com>
>To:	"w3c-wai-ig@w3.org" <w3c-wai-ig@w3.org>
>Date:	05/25/2012 03:17 PM
>Subject:	heading level order
>
>
>
>All,
>
>My name?s Ian Stewart, I?m a GWT/Drupal developer and new to 
>accessibility, but I?ve done extensive research lately in order to make 
>one of my projects as accessible as possible.
>
>Right now, I?m confronted with an interesting issue regarding heading 
>levels.  Heading levels, from my point of view, have always been
primarily
>a visual style cue.  Often an <h4> works better for CSS inheritance 
>reasons than an <h3>, for no reason other than visual style.
>
>Recently, our accessibility tester approached me with an interesting 
>point.
>She suggested that the reader is expecting heading levels to make sense
as
>if the page is a linearized document, with each depth representing a 
>consistent level of detail.  What do you all make of this statement?
Does
>jumping from an <h2> to an <h4> on a page for stylistic reasons truly 
>lessen the intuitiveness of the page for a screen reader?  Is
subclassing
>an <h3> to fit my style needs worth having <h2>s always followed by
<h3>s?
>
>Thanks for your thoughts, I found it an interesting question.
>
>Sincerely,
>
>Ian
>
>

Received on Tuesday, 29 May 2012 14:54:14 UTC