E-mail List Archives

You are here: Home > Community > E-mail List Archives > View Thread

Thread: HTML heading styles

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

From: Martin Godfrey
Date: Tue, Oct 19 2004 5:17AM
Subject: HTML heading styles
No previous message | Next message →

I have a quick question about HTML heading styles.

Now, we all understand that it's important to use heading styles to give
structure to documents and enable screen-reader users to navigate a page.

A strict reading of WAI guidelines is that heading styles must be used in
strict sequence ie. H1, H2, H3, H4, H5.
However, not all pages lend themselves to this; on some pages it is
appropriate to move, for example from H1 to H2 to H4.

My question to the group is whether this is a problem in terms of
accessibility ?
My feeling is that this approach enables us to use headings consistently so
that a particular heading level always corresponds to the same type of
information.

However RNIB took the view on a recent audit that skipping heading styles in
this manner was illegal.

Any opinions on this ? Please reply directly to me ( = EMAIL ADDRESS REMOVED = )as
well as the list.

Thanks and regards
Martin

----------------------------------------------------------------
Martin Godfrey
Project Manager

NYKRIS, 148 Curtain Road, Shoreditch, London UK, EC2A 3AT
T: +44 [0]20 7749 9349
D: +44 [0]20 7749 9334
F: +44 [0]20 7729 8188
E: = EMAIL ADDRESS REMOVED =
http://www.nykris.com

Digital passion that delivers
----------------------------------------------------------------

From: Bob Easton
Date: Tue, Oct 19 2004 5:53AM
Subject: Re: HTML heading styles
← Previous message | Next message →

martin wrote:
> I have a quick question about HTML heading styles.
>
> Now, we all understand that it's important to use heading styles to give
> structure to documents and enable screen-reader users to navigate a page.
>
> A strict reading of WAI guidelines is that heading styles must be used in
> strict sequence ie. H1, H2, H3, H4, H5.
> However, not all pages lend themselves to this; on some pages it is
> appropriate to move, for example from H1 to H2 to H4.
>
> My question to the group is whether this is a problem in terms of
> accessibility ?
> My feeling is that this approach enables us to use headings consistently so
> that a particular heading level always corresponds to the same type of
> information.
>

Thinking in terms of structure (a document outline if you please), is it
the case that the material that would normally be designated h3 is
actually missing and we fall into h4 level material? Or, is it the
case that a certain header appearance is wanted?

If it is only for appearance, then use CSS to apply the appropriate
appearance. Never mangle the document structure for sake of appearance.

It it actually is a missing leayer of information (difficult to image),
then mark the material appropriately even if it skips a level. The
person who cannot see the content might have come to a sense of it from
surrounding content and would appreciate the h4 level material not
jumping up a level. (assuming it's easy enough to differentiate the levels)

--
Bob Easton

From: Martin Godfrey
Date: Tue, Oct 19 2004 6:04AM
Subject: Re: HTML heading styles
← Previous message | Next message →

Thanks for the reply Bob.

It's the former case - a layer of information present on some pages but not
others.

Regards
Martin

>

From: Jukka K. Korpela
Date: Tue, Oct 19 2004 6:23AM
Subject: Re: HTML heading styles
← Previous message | Next message →

On Tue, 19 Oct 2004, martin wrote:

> I have a quick question about HTML heading styles.

It's technically about heading _elements_. In Web authoring, it is best to
reserve the word "style" for styling presentation (mainly with CSS).
This is a bit confusing, since if you use e.g. heading styles in MS Word,
then save as HTML, Word will create heading elements (which is nice, but
the Word terminology confuses presentation with structure).

> Now, we all understand that it's important to use heading styles to give
> structure to documents and enable screen-reader users to navigate a page.

Hopefully so... this is one of the key aspects of accessibility, also
because it makes it possible to view a page meaningfully with all
author-supplied styling suppressed in favor of user-controlled styling of
headings and other elements.

> A strict reading of WAI guidelines is that heading styles must be used in
> strict sequence ie. H1, H2, H3, H4, H5.

This has often been discussed on various fora. The experts' consensus is,
more or less, that heading levels should normally not be skipped, though
there might be different special cases - and there's some disagreement on
whether there are such cases and what they might be.

Basically, h1, h2, etc. are 1st, 2nd etc. _level_ headings, and h2, h3
etc. implicitly divide a document or part thereof into sections,
subsections, etc. This was said very clearly in the HTML 2.0
specification, later sadly obscured by babble about "importance".
For example, among 2nd level headings, some may well be much more
important than others. But they should still all be h2 elements.

The relevant item (or "checkpoint" - a misnomer for a rule) in WAI
guidelines is 3.5, and the wording is somewhat vague, but the related
techniques document says the rule rather explicitly:
http://www.w3.org/TR/WCAG10-HTML-TECHS/#document-headers

> However, not all pages lend themselves to this; on some pages it is
> appropriate to move, for example from H1 to H2 to H4.

Hardly. What you might find suitable is _styling_ e.g. h2 elements much
less prominent visually than h2 are by browser defaults. But this is
styling issue and can be dealt with properly. It's simply wrong to make a
2nd level heading h3 or h4 just because you want smaller font; you can
easily put h2 { font-size: 120%; } or something like that into your style
sheet instead.

> My question to the group is whether this is a problem in terms of
> accessibility ?

It could. For example, a user agent that constructs a table of content for
quick overview, or for use in navigation, would probably produce something
that confuses the user - it may look or sound as if the document were
wrongly structured and the table of content distorted.

> My feeling is that this approach enables us to use headings consistently so
> that a particular heading level always corresponds to the same type of
> information.

You might have one of the rare special cases then. Hard to tell without a
URL. Maybe the material is indeed structured into sections, subsections
etc. so that some of them lack headings. But won't this create confusion
anyway? Auxiliary intermediate headings might help everyone.

> However RNIB took the view on a recent audit that skipping heading styles in
> this manner was illegal.

I wonder why. What law might apply? Anyway, the WAI item 3.5 is not
crystal clear, and using h1 followed by h6 does not violate HTML 4.01
specification (which oddly almost laughs at structured use of headings
by labelling it as "some people's" opinion only). So the question arises
what the normative status of the HTML techniques document is. Assuming
that the law says just "follow WCAG 1.0 guidelines" or something similar,
I would surely vote "not guilty" as a jury member.

But it _would_ be possible, technically, to require by law that heading
levels be not skipped. The ISO HTML standard (a little known exercise in
futility, in general) even shows how the rule could be formalized.

> Any opinions on this ? Please reply directly to me ( = EMAIL ADDRESS REMOVED = )as
> well as the list.

Done, but such requests will often be missed by people who respond, so I'm
afraid you need to read the list anyway, so Cc'ing isn't that useful.

--
Jukka "Yucca" Korpela, http://www.cs.tut.fi/~jkorpela/

From: Martin Godfrey
Date: Tue, Oct 19 2004 7:00AM
Subject: Re: HTML heading styles
← Previous message | Next message →

Thanks for your characteristically pithy reply Jukka! ;)

Here's a simple example of how it might be appropriate to skip heading
styles.

H1 is the page heading
H2 is a sub-heading
H3 is a sub-sub-heading
H4 reads "Related content" and precedes a list of links to related pages on
the website

It's very possible that there may not be any content suitable for inclusion
at the H3 level but there are related content links. It strikes me that it
would be stranger to suddenly move "Related content" up to H3 than to simply
skip H3.

From: julian.rickards
Date: Tue, Oct 19 2004 7:22AM
Subject: Re: HTML heading styles
← Previous message | Next message →

I have always felt that documents must be structured like a tree with
branches: if the trunk is h1, then the branches off the trunk are h2, etc.
You cannot skip from the trunk to a distant branch (h5) without passing
through h2, h3, and h4 branches. As Jukka wrote, if h4 is too large, use
styles to resize it or de-emphasize it.

HTH,

Jules

-----------------------------------------------
Julian Rickards
A/Digital Publications Distribution Coordinator
Publication Services Section,
Ministry of Northern Development and Mines,
Vox: 705-670-5608 / Fax: 705-670-5960

From: Mike Moore
Date: Tue, Oct 19 2004 8:56AM
Subject: Re: HTML heading styles
← Previous message | Next message →

I find this discussion particularly enjoyable. Our organization,
Knowbility http://www.knowbility.org/ hosts a series of programs called AIR,
Accessibility Internet Rallies where we facilitate training in accessible
web design development and the creation of accessible web sites for
non-profit organizations. During a recent rally a discussion on the judging
panel regarding the appropriate use of headings was initiated. The
discussion centered around the question of whether it was appropriate to use
more than one heading on a page. My opinion is that this is
appropriate in certian circumstances. In particular when you have a main
heading to introduce the subject of the page and then use additional
headings to to set up sections of navigation. Others felt that the
navigation should properly be placed under level headings. What do you
folks think?

Mike

On Tue, 19 Oct 2004, martin wrote:

> I have a quick question about HTML heading styles.

From: Austin, Darrel
Date: Tue, Oct 19 2004 9:53AM
Subject: Re: HTML heading styles
← Previous message | Next message →

> Any opinions on this ? Please reply directly to me
> ( = EMAIL ADDRESS REMOVED = )as well as the list.

I wish html had tags like to indicate that this is a child header of
the parent. In your case, I don't think you have too much to worry about.
Skiping a header level shouldn't change the parent/child relationship. One
will always be a sub-level of the other regardless if it skips a level.

We've run into problems where we have components that need to write out
headers in other content. As there's no way to guarantee if the component
will be placed under a h1 or a h2, etc. we had to just guess and default it
to something like h4 just to ensure it was a child of its parent...even if
it meant it may on occasion skip a header when the complete page is
rendered.

So...it's one of those things that isn't perfect.

-Darrel

From: Stephanie Sullivan
Date: Tue, Oct 19 2004 11:00AM
Subject: Re: HTML heading styles
← Previous message | Next message →

On 10/19/04 9:19 AM, "julian.rickards" simply typed the following:

> I have always felt that documents must be structured like a tree with
> branches: if the trunk is h1, then the branches off the trunk are h2, etc.
> You cannot skip from the trunk to a distant branch (h5) without passing
> through h2, h3, and h4 branches. As Jukka wrote, if h4 is too large, use
> styles to resize it or de-emphasize it.

I have had the opposite thought and would be interested in your thoughts on
it here....

I think of it as an outline structure... Thus, the document starts with and
H1... And subheadings are an H2, but after that, I may want to put two h3's
under an H2... And then I may want another H2 with H3... And subs of the H3
are H4... I don't know if this is making sense but visually, the structure
would be like this:

H1 - Page Header
H2 - Sub head subject
H3 - sub-sub head
H3 - second sub-sub head
H2 - Next Sub head subject
H3 - sub-sub of this one
H4 - sub-sub-sub relating to the above
H3 - second sub-sub head

You get the picture, right? In other words, if I were writing a paper, I
would do it that way, only I would have different types of headings to
indicate child status... I would structure like:

I. Page Header
A. Sub head subject
i. Sub-sub head
ii. Second sub-sub head
B. Next Sub head subject
i. Sub-sub of this one
a. sub-sub-sub relating to the above
ii. Second sub-sub head

However, we don't have the ability to do this in HTML... Thus, my reasoning
for wanting to show the structure using the H2 AFTER the H3 at times (for
the second time)... In my first example, it would be silly to make the "Next
Sub head subject" be an H4... It is NOT a child of the H3 above it.

I find this frustrating. Anyone else? Thoughts?

Stephanie Sullivan
Community MX Partner :: http://www.communitymx.com/author.cfm?cid=1008
Team Macromedia for Dreamweaver :: http://tinyurl.com/6huw3
Co-Author .: "Macromedia Dreamweaver MX 2004 Magic" :. New Riders

"It is not enough to have a good mind. The main thing is to use it well." --
Rene Descartes

From: Sailesh Panchang
Date: Tue, Oct 19 2004 11:22AM
Subject: Re: HTML heading styles
← Previous message | Next message →

On this&nbsp; topic I have&nbsp; seen two other
questionable practices:
1. An image that has some text in it that is made
to look like a header. The alt has the text of the image in it. The whole img
tag is placed in an h1 or h2 tag.&nbsp; As I use the screen reader to jump from
heading to heading, this img does get focus. And it is properly&nbsp; sequenced
in terms of h1...h6. What do you think?
2. What do you think about a hyperlink&nbsp; (an
anchor element) in an h tag? Like a news item isa link and in an h tag followed
by a 1 or two line short description about the news item. And then the link to
the next news item and so on.
Sailesh
&nbsp;

From: julian.rickards
Date: Tue, Oct 19 2004 11:26AM
Subject: Re: HTML heading styles
← Previous message | Next message →

OK, maybe my tree example was flawed. After I clicked send, I thought of the
lilac outside my front window where there are many, many main branches
coming out of the root which some would say means that multiple h1's are
fine.

I find that Stephanie's example to be a much better explanation of what I
was trying to get across but I disagree with her final statement "However,
we don't have the ability to do this in HTML..." because she has shown that
in fact, you can do this with HTML.

I think that the person who started this thread was trying to, using
Stephanie's example, jump from H2 - Next Sub head subject to H4 -
sub-sub-sub relating to the above without the H3 between them.

-----------------------------------------------
Julian Rickards
A/Digital Publications Distribution Coordinator
Publication Services Section,
Ministry of Northern Development and Mines,
Vox: 705-670-5608 / Fax: 705-670-5960

From: Glenda
Date: Tue, Oct 19 2004 11:29AM
Subject: Re: HTML heading styles
← Previous message | Next message →

Stephanie,

Your approach makes perfect sense to me. Actually that is how I thought
headings were supposed to be used. If its not that way, then I'm confused.

Glenda

From: julian.rickards
Date: Tue, Oct 19 2004 11:35AM
Subject: Re: HTML heading styles
← Previous message | Next message →

I
don't see that there is a problem with #1 as long as the alt text is the same as
the text in the graphic and that the heading level is properly
selected.

I
don't like headings used as a link but, as you say, it does appear to be fairly
common practice. It does have the (minor) benefit of increasing the clickable
area. I prefer to have all of the precis of the news article (assuming the
precis is not too long) as a link or a "More on this story" link after the
precis.

Jules
-----------------------------------------------
Julian Rickards A/Digital Publications Distribution
Coordinator Publication Services
Section, Ministry of Northern
Development and Mines, Vox:
705-670-5608 / Fax: 705-670-5960

From: Andrew Kirkpatrick
Date: Tue, Oct 19 2004 11:35AM
Subject: Re: HTML heading styles
← Previous message | Next message →

> H1 is the page heading
> H2 is a sub-heading
> H3 is a sub-sub-heading
> H4 reads "Related content" and precedes a list of links to related pages on
> the website
>
> It's very possible that there may not be any content suitable for inclusion
> at the H3 level but there are related content links. It strikes me that it
> would be stranger to suddenly move "Related content" up to H3 than to simply
> skip H3.

It seems like in this case that the related content is a child of the
subheading. When there is an h3 are the related content links specific to
the sub-sub heading or are so related to the subheading and not directly to
the sub-sub heading?

The question you're asking can't really be answered without knowing more
about the taxonomy of the site in question. You could conceivably have
related content links for more than one level of the page structure, and it
is desirable to have a structure that complements this. This would mean
having related content as an h3 or an h4, or both, but we can't tell without
seeing the content.

AWK

--
Andrew Kirkpatrick
Project Manager, WGBH National Center for Accessible Media
125 Western Ave.
Boston, MA 02134

617-300-4420 (direct voice/FAX)
617-300-3400 (main NCAM)
617-300-2489 (TTY)

From: Mike Moore
Date: Tue, Oct 19 2004 1:08PM
Subject: Re: HTML heading styles
← Previous message | Next message →

Jules,

I would have to disagree with your link suggestion
below. The problem is that the link does not make sense out of
context. Think of bringing up a link list in Jaws. It is
particularly frustratiing if there are many story leads on a single page all
with the same link text "More on this story" after each lead. This
practice is very widespread and creates accessibility and usability
issues. My suggestion is to follow the example of the print
newspapers. When a print news article continues on another page at the end
of the current block we are given some guidance of what to look for. "See
Accessibility B12" We can do the same with a link to the remainder of the
article on a web site "More on Accessibility" instead of "More on this
story" This approach has two advantages to someone using a link list for
navigation. First it tells them what to expect when they activate the
link, second it tells them that there is something important prior to this link
that they may want to read first.


Mike

 "... as a
link or a "More on this story" link after the precis. "

From: julian.rickards
Date: Tue, Oct 19 2004 1:25PM
Subject: Re: HTML heading styles
← Previous message | Next message →

Congratulations! You were the first to peg me on this!! In fact, I know
all that but for the sake of brevity, I just used the "More on this story"
text.

Jules
-----------------------------------------------
Julian Rickards A/Digital Publications Distribution
Coordinator Publication Services
Section, Ministry of Northern
Development and Mines, Vox:
705-670-5608 / Fax: 705-670-5960

From: Stephanie Sullivan
Date: Tue, Oct 19 2004 4:48PM
Subject: Re: HTML heading styles
← Previous message | Next message →

On 10/19/04 1:23 PM, "julian.rickards" simply typed the following:

> I find that Stephanie's example to be a much better explanation of what I
> was trying to get across but I disagree with her final statement "However,
> we don't have the ability to do this in HTML..." because she has shown that
> in fact, you can do this with HTML.

Well, it's this statement (and the WAI guidelines) that has me confused:
"A strict reading of WAI guidelines is that heading styles must be used in
strict sequence ie. H1, H2, H3, H4, H5."

Others have told me that once I move to H3, I should not be moving back up
to H2 again... Obviously, you guys don't agree and my information/criticism
is flawed. ;)

Stephanie Sullivan
Community MX Partner :: http://www.communitymx.com/author.cfm?cid=1008
Team Macromedia for Dreamweaver :: http://tinyurl.com/6huw3
Co-Author .: "Macromedia Dreamweaver MX 2004 Magic" :. New Riders

"Your assumptions are your windows on the world. Scrub them off every once
in a while, or the light won't come in." - Isaac Asimov

From: Jukka K. Korpela
Date: Tue, Oct 19 2004 11:00PM
Subject: Re: HTML heading styles
← Previous message | Next message →

On Tue, 19 Oct 2004, design wrote:

> Others have told me that once I move to H3, I should not be moving back up
> to H2 again... Obviously, you guys don't agree and my information/criticism
> is flawed. ;)

Someone has misunderstood things, then. It makes no sense to set such
requirement, since it would mean that once you have started a subsection,
you can have no more new sections.

--
Jukka "Yucca" Korpela, http://www.cs.tut.fi/~jkorpela/

From: Andrew Arch
Date: Tue, Oct 19 2004 11:22PM
Subject: Re: HTML heading styles
← Previous message | Next message →

A good way to think of web page headings is like a small table of contents
for an article or a book. You can lots of chapters with sections which
contain sub-sections which may contain sub-sub-section, but you would not
generally have a chapter with only sub-sub-sections and no sections. So, you
can have many of each heading level as long as you get the relative
hierarchy right.

Andrew
_________________________________
Dr Andrew Arch
Manager Web Accessibility Consulting
Accessible Information Solutions, NILS
Ph +613 9864 9282; Fax +613 9864 9370

National Information and Library Service
A subsidiary of RBS.RVIB.VAF Ltd.
http://www.nils.org.au/ais/

From: julian.rickards
Date: Wed, Oct 20 2004 6:48AM
Subject: Re: HTML heading styles
← Previous message | No next message

Yes, I see the confusion but I think that the WAI sentence does not explain
properly what they meant to say. In a sense, that would be like saying, once
you have marked up a chapter title, you can't have any more chapter titles
in a book. In other words, only one chapter per book.

The other interpretation is that you can have a maximum of 6 headings per
page because there is no . Well, that makes bloody sense!!! :-)

Given that the intent of the WAI is not to reinvent editorial conventions,
just make certain that good editorial conventions are followed, I believe
that they are saying to use them in order and always start with .

I can't remember what the "Web Style Guide" says on this but I do remember a
quote (pardon me if my memory does not serve me perfectly), "Don't throw out
good editorial conventions just because you are writing for the world wide
web.".

-----------------------------------------------
Julian Rickards
A/Digital Publications Distribution Coordinator
Publication Services Section,
Ministry of Northern Development and Mines,
Vox: 705-670-5608 / Fax: 705-670-5960