E-mail List Archives
Thread: Heading order/nesting - was RE: H1 header in iframe
Number of posts in this thread: 11 (In chronological order)
From: Langum, Michael J
Date: Thu, Aug 26 2010 7:21AM
Subject: Heading order/nesting - was RE: H1 header in iframe
No previous message | Next message →
I have a related, but broader question.
I agree that "The purpose of <H1> is to convey Main content of the page." But what does that say about headings that might appear BEFORE this. For example, our general site structure goes something like this:
I. Domain Level Banner
I.A. Sub-site Banner (with a set of horizontal tabs for each "sub-section" within the Sub-site)
I.A.1. Sub-Section Title (with a left navigation section for navigation within the sub-Section.
I.A.1.a Title for THIS unique page (within the larger sub-section, within the larger sub-site, within the full domain.)
I currently code this as:
<h2 id="DomainTitle">Domain Title</h2>
<h2 id="Sub-siteTitle">Sub-site Title</h2>
<div id="sub-site-horizontal-nav"> unordered list for sub-site tabs</div>
<h2 id="Sub-sectionTitle">Sub-section Title</h2>
<div id="leftNav"> unordered list for left nav</div>
<div id="MainContent">
<h1 id="PageTitle">Page Title</h1>
... Rest of page ...
</div>
What is your best thinking about these headings BEFORE the <h1 id="PageTitle">Page Title</h1>?
-- Mike
From: Jared Smith
Date: Thu, Aug 26 2010 8:24AM
Subject: Re: Heading order/nesting - was RE: H1 header in iframe
← Previous message | Next message →
On Thu, Aug 26, 2010 at 7:19 AM, Langum, Michael J wrote:
> What is your best thinking about these headings BEFORE the <h1 id="PageTitle">Page Title</h1>?
Some will say that because you are not supposed to skip heading levels
that this is somehow inappropriate. I've yet to see anything in
accessibility or coding standards that indicates you can't do this.
The WebAIM site and many others have a similar structure with no
apparent issues. This allows direct access to the main content. In
most screen readers, just hit the 1 key and you're at the main
content. The logo/site name should probably be the <h1> on the home
page
Interestingly, the new w3.org site uses two <h1>s on content page -
one for the logo and one for the document heading. If users generally
expect one <h1> to be at the beginning of the main content, there's a
possibility this could result in some confusion.
Jared Smith
From: Susan Grossman
Date: Thu, Aug 26 2010 8:30AM
Subject: Re: Heading order/nesting - was RE: H1 header in iframe
← Previous message | Next message →
> ...Interestingly, the new w3.org site uses two <h1>s on content page -
one for the logo and one for the document heading.
I was taught that you never use more than one H1 on a page, and have
followed this, without question on all sites.
And since I was taught there can't be an H2 without an H1, I use the H1 for
usually what's a combo Domain Level/ Site Level (Name of Company /
Application Name) In most corporate contracts, they combine domain/site so
I don't have to worry about breaking it up into headings.
Now you have me questioning my understanding of Web Semantics (different
from traditional Word Doc).
So is there an H1 rule or not? Is anything cut and dry?
Susan
On Thu, Aug 26, 2010 at 7:22 AM, Jared Smith < = EMAIL ADDRESS REMOVED = > wrote:
> On Thu, Aug 26, 2010 at 7:19 AM, Langum, Michael J wrote:
>
> > What is your best thinking about these headings BEFORE the <h1
> id="PageTitle">Page Title</h1>?
>
> Some will say that because you are not supposed to skip heading levels
> that this is somehow inappropriate. I've yet to see anything in
> accessibility or coding standards that indicates you can't do this.
> The WebAIM site and many others have a similar structure with no
> apparent issues. This allows direct access to the main content. In
> most screen readers, just hit the 1 key and you're at the main
> content. The logo/site name should probably be the <h1> on the home
> page
>
> Interestingly, the new w3.org site uses two <h1>s on content page -
> one for the logo and one for the document heading. If users generally
> expect one <h1> to be at the beginning of the main content, there's a
> possibility this could result in some confusion.
>
> Jared Smith
>
From: Jared Smith
Date: Thu, Aug 26 2010 9:24AM
Subject: Re: Heading order/nesting - was RE: H1 header in iframe
← Previous message | Next message →
On Thu, Aug 26, 2010 at 8:30 AM, Susan Grossman wrote:
>> ...Interestingly, the new w3.org site uses two <h1>s on content page -
> one for the logo and one for the document heading.
>
> I was taught that you never use more than one H1 on a page, and have
> followed this, without question on all sites.
Well, the H1 is a first level, main document heading. The HTML spec
indicates that a heading "describes the topic of the section it
introduces" (http://www.w3.org/TR/html401/struct/global.html#h-7.5.5).
As such, making the site name the <h1> is perfectly valid. But if you
then use more than one <h2> (one being for the document title), you
are saying that the document title and the entirety of the main
content of that page are equal in importance to any other <h2>s (and
their content) on that page. Is the main subject of the page really
equal to the sidebar or footer or main navigation?
On the other hand, I think most web pages are about or described best
by the document title. With the exception of the home page, few
documents are really about or best described by "site name".
By using two <h1>s, you are essentially saying that the web page is
comprised of two distinct pieces or two distinct documents, perhaps.
Considering the structure of the W3.org site, the first part of the
page including the main navigation is described by the site name
("W3C"). But the second <h1> indicates that the main content and
beyond (including the footer navigation) is described by the document
title, but it is NOT described by or within "W3C" at all. This makes
no sense at all to me.
Now if your document truly is comprised of two distinct 'documents'
(an English version and a Spanish version, for example), then two
<h1>'s might be very appropriate.
> And since I was taught there can't be an H2 without an H1
I hear this being taught, but don't see any strong reason why it must
be this way. The spec certainly does not require it. Maybe I'm missing
something.
> So is there an H1 rule or not? Is anything cut and dry?
As with most things in HTML, the rules are made to be broken. The spec
does not clarify either way. There is and always will be debate about
this. http://h1debate.com/ gives much insight. It is worth noting that
70% of voters there believe the document title should be the <h1> as
opposed to the site name/logo. From an accessibility standpoint, I
think this practice provides great utility for keyboard users, is
structurally and semantically sound, and makes the most sense. It is
thus what I use and recommend.
Jared Smith
From: Susan Grossman
Date: Thu, Aug 26 2010 9:54AM
Subject: Re: Heading order/nesting - was RE: H1 header in iframe
← Previous message | Next message →
>>As with most things in HTML, the rules are made to be broken. The spec
does not clarify either way. There is and always will be debate about
this. http://h1debate.com/ gives much insight. It is worth noting that
70% of voters there believe the document title should be the <h1> as
opposed to the site name/logo. From an accessibility standpoint, I
think this practice provides great utility for keyboard users, is
structurally and semantically sound, and makes the most sense. It is
thus what I use and recommend.
A lot of good points and a link I hadn't been to! Really appreciate the
thought-through reply.
Thanks - Susan
On Thu, Aug 26, 2010 at 8:23 AM, Jared Smith < = EMAIL ADDRESS REMOVED = > wrote:
> On Thu, Aug 26, 2010 at 8:30 AM, Susan Grossman wrote:
> >> ...Interestingly, the new w3.org site uses two <h1>s on content page -
> > one for the logo and one for the document heading.
> >
> > I was taught that you never use more than one H1 on a page, and have
> > followed this, without question on all sites.
>
> Well, the H1 is a first level, main document heading. The HTML spec
> indicates that a heading "describes the topic of the section it
> introduces" (http://www.w3.org/TR/html401/struct/global.html#h-7.5.5).
> As such, making the site name the <h1> is perfectly valid. But if you
> then use more than one <h2> (one being for the document title), you
> are saying that the document title and the entirety of the main
> content of that page are equal in importance to any other <h2>s (and
> their content) on that page. Is the main subject of the page really
> equal to the sidebar or footer or main navigation?
>
> On the other hand, I think most web pages are about or described best
> by the document title. With the exception of the home page, few
> documents are really about or best described by "site name".
>
> By using two <h1>s, you are essentially saying that the web page is
> comprised of two distinct pieces or two distinct documents, perhaps.
> Considering the structure of the W3.org site, the first part of the
> page including the main navigation is described by the site name
> ("W3C"). But the second <h1> indicates that the main content and
> beyond (including the footer navigation) is described by the document
> title, but it is NOT described by or within "W3C" at all. This makes
> no sense at all to me.
>
> Now if your document truly is comprised of two distinct 'documents'
> (an English version and a Spanish version, for example), then two
> <h1>'s might be very appropriate.
>
> > And since I was taught there can't be an H2 without an H1
>
> I hear this being taught, but don't see any strong reason why it must
> be this way. The spec certainly does not require it. Maybe I'm missing
> something.
>
> > So is there an H1 rule or not? Is anything cut and dry?
>
> As with most things in HTML, the rules are made to be broken. The spec
> does not clarify either way. There is and always will be debate about
> this. http://h1debate.com/ gives much insight. It is worth noting that
> 70% of voters there believe the document title should be the <h1> as
> opposed to the site name/logo. From an accessibility standpoint, I
> think this practice provides great utility for keyboard users, is
> structurally and semantically sound, and makes the most sense. It is
> thus what I use and recommend.
>
> Jared Smith
>
From: Tim Harshbarger
Date: Thu, Aug 26 2010 10:33AM
Subject: Re: Heading order/nesting - was RE: H1 header in iframe
← Previous message | Next message →
Frankly, headings make great semantic sense when we are talking about
things like documents or books, they make little sense when we are
discussing user interfaces.
Is the title element like a book title and h1 like a chapter heading?
In that case, there should be as many h1 elements as there are chapters.
If the h1 is like a book title, then there is only likely to be one book
on the "page."
But the book and document metaphor don't really work for most web pages.
Most of the time, I think we use heading elements to mark sections of a
page. In that context, I think the purpose of the heading element is
far less certain. Does h1 mark the main focus of the page? Possibly
what the page developer thinks is the main focus, but not necessarily
where the user will focus. Should the h1 element mark the beginning of
a major section? Or do h2s mark up major sections like the navigation.
I think I could intellectually justify about any approach. I think that
is part of the reason why this tends to be an area that draws some
disagreement.
I think ARIA landmarks provide a much more semantically unambiguous
method for allowing the user to identify sections of the user interface.
Better yet, use both landmarks and heading elements together--that will
provide users with a bit of the familiar as well as expose them to
something that might be new to them that will be more advantageous.
In that situation, I would probably integrate my heading structure into
the landmark structure. That might even mean I would end up with more
than one h1 or possibly even no h1 elements. I suppose as long as the
users find the approach effective, I'll manage to survive the guilt of
misusing document-based markup correctly. I prefer to write valid and
semantically correct mark-up, but I am quite willing to abandon the
practice if it looks like it will benefit the users.
Thanks!
Tim
From: Jukka K. Korpela
Date: Thu, Aug 26 2010 10:42AM
Subject: Re: Heading order/nesting - was RE: H1 header in iframe
← Previous message | Next message →
Jared Smith wrote:
> Well, the H1 is a first level, main document heading. The HTML spec
> indicates that a heading "describes the topic of the section it
> introduces" (http://www.w3.org/TR/html401/struct/global.html#h-7.5.5).
> As such, making the site name the <h1> is perfectly valid.
You just contradicted yourself, provided that "perfectly valid" means
"perfectly correct", as I presume. ("Valid" is really a technical term in
HTML context and should not be used as general appraisal.) The _site_ name
does not describe the topic of the _document_ (and normally the entire
document is the section corresponding to <h1>), except possibly on the
_main_ page.
> With the exception of the home page, few
> documents are really about or best described by "site name".
Well, I knew you would ultimately agree. :-)
People say that multiple <h1> elements cause trouble in "search engine
optimization". There might be some truth in this, since if you are a poor
lonesome search engine, how could you decide which of the two <h1> elements
is really the document's heading (which should normally be very important in
searches)? This in turn affects accessibility because search engines are
more and more becoming everyone's user interface to the web. It's easier to
type "foobar" in a Google search box and find a foobar page and also "the"
foobar page (assuming "foobar" is a real proper name, e.g. of a product or a
person or a company or a city) than to scan through your bookmarks or try to
guess whether to try foobar.org or foobar.com or foobar.tv. If you disturb
search engines, you disturb people who try to find your page and have e.g.
forgotten its URL.
(I'm not saying that multiple <h1> elements is a big issue here. My point is
that using <h1> for site name most probably wins nothing and probably loses
something.)
>> And since I was taught there can't be an H2 without an H1
>
> I hear this being taught, but don't see any strong reason why it must
> be this way. The spec certainly does not require it. Maybe I'm missing
> something.
The HTML standard requires it, but I don't think many people take the
standard seriously or even know about, or would have a reason to. People
have read so much about W3C recommendations as "standards" that they would
hardly recognize a real standard...
But it's always been good practice not to skip heading levels, and starting
with <h2> surely skips the first level. Skipping heading levels is typically
a symptom of using heading markup just to create large font sizes, something
that was common in early 1990 before style sheets or even <font> tags became
available. In fact, <h1>W3C</h1> across all pages of the site almost looks
like a parody of that, but I'm afraid it isn't.
--
Yucca, http://www.cs.tut.fi/~jkorpela/
From: Susan Grossman
Date: Thu, Aug 26 2010 10:51AM
Subject: Re: Heading order/nesting - was RE: H1 header in iframe
← Previous message | Next message →
>> With the exception of the home page, few
>> documents are really about or best described by "site name".
>Well, I knew you would ultimately agree. :-)
Then wouldn't the corporate example (portal applications) be another
exception?
You may be on the big corporate site - but you're within a specific portal
application. Similar L&F, different web application. So H1 is
"Corporation Application" H2 is "Page Title" and H3 starts the
sub-headings?
Susan
On Thu, Aug 26, 2010 at 9:38 AM, Jukka K. Korpela < = EMAIL ADDRESS REMOVED = >wrote:
> Jared Smith wrote:
>
> > Well, the H1 is a first level, main document heading. The HTML spec
> > indicates that a heading "describes the topic of the section it
> > introduces" (http://www.w3.org/TR/html401/struct/global.html#h-7.5.5).
> > As such, making the site name the <h1> is perfectly valid.
>
> You just contradicted yourself, provided that "perfectly valid" means
> "perfectly correct", as I presume. ("Valid" is really a technical term in
> HTML context and should not be used as general appraisal.) The _site_ name
> does not describe the topic of the _document_ (and normally the entire
> document is the section corresponding to <h1>), except possibly on the
> _main_ page.
>
> > With the exception of the home page, few
> > documents are really about or best described by "site name".
>
> Well, I knew you would ultimately agree. :-)
>
> People say that multiple <h1> elements cause trouble in "search engine
> optimization". There might be some truth in this, since if you are a poor
> lonesome search engine, how could you decide which of the two <h1> elements
> is really the document's heading (which should normally be very important
> in
> searches)? This in turn affects accessibility because search engines are
> more and more becoming everyone's user interface to the web. It's easier to
> type "foobar" in a Google search box and find a foobar page and also "the"
> foobar page (assuming "foobar" is a real proper name, e.g. of a product or
> a
> person or a company or a city) than to scan through your bookmarks or try
> to
> guess whether to try foobar.org or foobar.com or foobar.tv. If you disturb
> search engines, you disturb people who try to find your page and have e.g.
> forgotten its URL.
>
> (I'm not saying that multiple <h1> elements is a big issue here. My point
> is
> that using <h1> for site name most probably wins nothing and probably loses
> something.)
>
> >> And since I was taught there can't be an H2 without an H1
> >
> > I hear this being taught, but don't see any strong reason why it must
> > be this way. The spec certainly does not require it. Maybe I'm missing
> > something.
>
> The HTML standard requires it, but I don't think many people take the
> standard seriously or even know about, or would have a reason to. People
> have read so much about W3C recommendations as "standards" that they would
> hardly recognize a real standard...
>
> But it's always been good practice not to skip heading levels, and starting
> with <h2> surely skips the first level. Skipping heading levels is
> typically
> a symptom of using heading markup just to create large font sizes,
> something
> that was common in early 1990 before style sheets or even <font> tags
> became
> available. In fact, <h1>W3C</h1> across all pages of the site almost looks
> like a parody of that, but I'm afraid it isn't.
>
> --
> Yucca, http://www.cs.tut.fi/~jkorpela/ <http://www.cs.tut.fi/%7Ejkorpela/>;
>
>
From: Jared Smith
Date: Thu, Aug 26 2010 11:18AM
Subject: Re: Heading order/nesting - was RE: H1 header in iframe
← Previous message | Next message →
On Thu, Aug 26, 2010 at 10:38 AM, Jukka K. Korpela wrote:
>>> And since I was taught there can't be an H2 without an H1
>>
>> I hear this being taught, but don't see any strong reason why it must
>> be this way. The spec certainly does not require it. Maybe I'm missing
>> something.
>
> The HTML standard requires it
Does it? Like I said, I may be missing something, but I do not see
anything in any HTML standard that requires an <h1> before any <h2>.
The HTML 4.01 spec itself even directly suggests that skipping heading
levels is acceptable, though (and I quote the spec) "Some people
consider skipping heading levels to be bad practice." This certainly
doesn't sound like a requirement to me.
Jared
From: Jukka K. Korpela
Date: Thu, Aug 26 2010 12:03PM
Subject: Re: Heading order/nesting - was RE: H1 header in iframe
← Previous message | Next message →
Jared Smith wrote:
> On Thu, Aug 26, 2010 at 10:38 AM, Jukka K. Korpela wrote:
>
>>>> And since I was taught there can't be an H2 without an H1
>>>
>>> I hear this being taught, but don't see any strong reason why it
>>> must be this way. The spec certainly does not require it. Maybe I'm
>>> missing something.
>>
>> The HTML standard requires it
>
> Does it?
Yes it does:
"An <H2> element shall be preceded by an <H1> element."
http://www.scss.tcd.ie/misc/15445/15445.html
That's technically just a comment in the DTD, but it is effectively
normative, since the DTD otherwise contains (complicated) rules that impose
this restriction. This is explained in the "User's Guide" to the standard:
http://www.scss.tcd.ie/misc/15445/UG.HTML#H1
(it's just very tough reading, not virtually incomprehensible like the
standard texts themselves :-)).
> Like I said, I may be missing something, but I do not see
> anything in any HTML standard that requires an <h1> before any <h2>.
There is only one HTML standard, and as I wrote, most people don't know
about and need not know about it. But it's the standard, whereas HTML 4.01
specification is just "W3C recommendation" - issued by an industry
consortium, not a standards body, and written as a fairly loose technical
spec, not with the exactness and style of standards.
--
Yucca, http://www.cs.tut.fi/~jkorpela/
From: Bo Nilsson
Date: Thu, Aug 26 2010 1:24PM
Subject: Re: Heading order/nesting - was RE: H1 header in iframe
← Previous message | No next message
Hello!
I see a web page as consisting of two structures: the navigation and the
content structures. The user alternates between them, not thinking much of
which is the higher or lower, but aware of that one is the navigation, the
other the content. In this respect there can be one h1 for the navigation
and one h1 for the content. But for other reasons, such as search engines
and screen readers , the h1 should appear only in the content structure. The
dilemma can be solved by other mark upp than h1 in the navigation part, such
as style and logo for the site title. And than sparcely use of h2, if a
complex navigation structure.
Best regards
Bo Nilsson
----- Original Message -----
From: "Jukka K. Korpela" < = EMAIL ADDRESS REMOVED = >
To: "WebAIM Discussion List" < = EMAIL ADDRESS REMOVED = >
Sent: Thursday, August 26, 2010 8:00 PM
Subject: Re: [WebAIM] Heading order/nesting - was RE: H1 header in iframe
> Jared Smith wrote:
>
>> On Thu, Aug 26, 2010 at 10:38 AM, Jukka K. Korpela wrote:
>>
>>>>> And since I was taught there can't be an H2 without an H1
>>>>
>>>> I hear this being taught, but don't see any strong reason why it
>>>> must be this way. The spec certainly does not require it. Maybe I'm
>>>> missing something.
>>>
>>> The HTML standard requires it
>>
>> Does it?
>
> Yes it does:
> "An <H2> element shall be preceded by an <H1> element."
> http://www.scss.tcd.ie/misc/15445/15445.html
> That's technically just a comment in the DTD, but it is effectively
> normative, since the DTD otherwise contains (complicated) rules that
> impose
> this restriction. This is explained in the "User's Guide" to the standard:
> http://www.scss.tcd.ie/misc/15445/UG.HTML#H1
> (it's just very tough reading, not virtually incomprehensible like the
> standard texts themselves :-)).
>
>> Like I said, I may be missing something, but I do not see
>> anything in any HTML standard that requires an <h1> before any <h2>.
>
> There is only one HTML standard, and as I wrote, most people don't know
> about and need not know about it. But it's the standard, whereas HTML 4.01
> specification is just "W3C recommendation" - issued by an industry
> consortium, not a standards body, and written as a fairly loose technical
> spec, not with the exactness and style of standards.
>
> --
> Yucca, http://www.cs.tut.fi/~jkorpela/
>
>