SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    SitePoint Guru redhillccwebmas's Avatar
    Join Date
    Jun 2005
    Posts
    989
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Multiple H1's on a single page?

    Here at work we've recently had a heated debate over whether it's an acceptable practice to use multiple H1's on a page.

    My argument is that, whilst not being ideal, it's perfectly acceptable in the same way that you can use multiple H2's etc. I am not asking this question from an HTML validation point of view, but from more of an accessibility perspective. Our accessibility guy argues that there should only be one H1 per page.

    We have trawled the web looking for articles on this - even the W3C don't specify this in their guidlines.

    Can anyone point me to any definitive articles to prove me either right or wrong?

    James

  2. #2
    Function Curry'er JimmyP's Avatar
    Join Date
    Aug 2007
    Location
    Brighton, UK
    Posts
    2,006
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I cannot find any offical articles on it but I ran into this thread which seems informative LINKY

    I think the issue is about being semantically correct. From an accesability point of view I don't think it has a massive effect, but when you have to consider SEO etc. you have to think about the hierarchical structure of the content and label it relevantly. If you have a reason to put more than one H1 tag on a single page then maybe you should be splitting your content into more than one page.

    Personally, I use only H1 tag - honestly I don't really see the reasoning and I am only doing it because when I asked the question here before, the responses I got were all against multiple H1 tags...
    James Padolsey
    末末末末末末末末末末末末末末末末末末末
    Awesome JavaScript Zoomer (demo here)
    'Ajaxy' - Ajax integration solution (demo here)

  3. #3
    SitePoint Wizard chris_fuel's Avatar
    Join Date
    May 2006
    Location
    Ventura, CA
    Posts
    2,751
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well, I suppose it would depend on your interpretation of:

    http://www.w3.org/TR/html4/struct/global.html#h-7.5.5

    more specifically:

    There are six levels of headings in HTML with H1 as the most important and H6 as the least. Visual browsers usually render more important headings in larger fonts than less important ones.
    So saying that multiple parts of your document are the "most important" seems kind of weird. Also the W3 has another writeup on accessibility on how headers should relate to each other:

    http://www.w3.org/TR/WCAG10-HTML-TECHS/

    Since some users skim through a document by navigating its headings, it is important to use them appropriately to convey document structure. Users should order heading elements properly. For example, in HTML, H2 elements should follow H1 elements, H3 elements should follow H2 elements, etc. Content developers should not "skip" levels (e.g., H1 directly to H3). Do not use headings to create font effects; use style sheets to change font styles for example.
    So even if you thought multiple H1's were okay, you'd have to make sure that their insertion didn't break up the header structure (randomly going from H3 to H1, versus H3 to H2).

    Hope that gives you some idea.

  4. #4
    SitePoint Addict
    Join Date
    Feb 2005
    Location
    Brisbane, Australia
    Posts
    306
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by chris_fuel View Post
    Well, I suppose it would depend on your interpretation of:

    http://www.w3.org/TR/html4/struct/global.html#h-7.5.5

    more specifically:
    There are six levels of headings in HTML with H1 as the most important and H6 as the least. Visual browsers usually render more important headings in larger fonts than less important ones.
    So saying that multiple parts of your document are the "most important" seems kind of weird.
    To be more pedantic in the interpretation of that particular excerpt, H1 would be the most important level of heading, rather than the most important part of a document.

    With that interpretation, and the fact that H1 and H2 et cetera are levels of headings rather than headings themselves, I could only assume that you can have as many H1s as you want, as long as each section (as delimited by a H1 header) is unique and not a part of any other section.

    The WCAG link supplied seems to agree with my interpretation.

  5. #5
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,159
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It's perfectly possible to have multiple H1 headings in a semantically correct document, provided the document contains multiple, separate topics. As long as the 'outline' structure of heading levels is preserved (i.e., no H3 after an H1, etc.) it's not wrong as such.

    I personally believe, however, that such a document should be split into multiple parts (one document per separate topic), in most cases.
    Birnam wood is come to Dunsinane

  6. #6
    SitePoint Wizard bronze trophy DaveWoods's Avatar
    Join Date
    Dec 2004
    Location
    Derbyshire - UK
    Posts
    2,651
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Technically it's allowed but personally I think it's wrong.

    In my opinion, the <h1> tag should be used as an overall heading for the content of the page. If you think you need to use two separate <h1>'s then I'd personally either consider making them both <h2>'s and coming up with a different <h1> which covers both subsections or the better solution is usually to divide the content into two pages and use the relevant <h1> on each.

  7. #7
    whagwan? silver trophybronze trophy akritic's Avatar
    Join Date
    Nov 2006
    Posts
    2,780
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    I'm in the same camp that says aviod it where possible. In fact if you are coding multiple h1's then you really need to be looking at how you can markup your document in a more structurely semantic manner.

  8. #8
    om nom nom nom Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,233
    Mentioned
    47 Post(s)
    Tagged
    1 Thread(s)
    While redoing a certain web page, I considered having two h1's-- the website was kinda two-headed, where there was a Commercial/Business version and an Individual/Personal version. They were considered the same web site, but the menus were a little different and ultimately the products as well. On the old page, there was a sort of splash page where the visitor chose which version to go to: <h1>Zakelijk</h1> or <h1>Particulieren</h1>.

    I decided to kill the splash page and made the name of the company the <h1> and the two versions <h2>s on their respective pages, with interlinking between the two... so on the personal page, it's <h1>Name of Company</h1> <h2>Particulieren</h2>, and on the business page it's <h1>Name of Company</h1> <h2>Zakelijk</h2>. I think this worked better, so long as I made it really really clear that there were two versions of the page. I'm not sure I did that yet : )

    So, it depends what you're using the <h1> for, but you can always shuffle things around to have one <h1> and all the things you were uding <h1> for turned into <h2>s.

  9. #9
    SitePoint Wizard bronze trophy DaveWoods's Avatar
    Join Date
    Dec 2004
    Location
    Derbyshire - UK
    Posts
    2,651
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Stomme poes View Post
    On the old page, there was a sort of splash page where the visitor chose which version to go to: <h1>Zakelijk</h1> or <h1>Particulieren</h1>.
    .
    They don't sound like headings at all though? A list of links may have been a better semantic choice.

    If they're just acting as links to a separate page and don't have any content underneath them then what purpose are they serving as a heading?

    Personally, in that scenario I'd markup them up as list items and then on the resulting page use this same text as the <h1> for the content.

  10. #10
    SitePoint Member
    Join Date
    Feb 2008
    Location
    Scotland, UK
    Posts
    12
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The RNIB advocates only one H1.

    I'd agree - it is there to summarise the entire page's content. This is common practice, and anyone looking at the page structure via the Headings will assume that the first H1 element they come across sums up the whole page.

  11. #11
    om nom nom nom Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,233
    Mentioned
    47 Post(s)
    Tagged
    1 Thread(s)
    They don't sound like headings at all though? A list of links may have been a better semantic choice.
    Semantics never enter the equation. These pages often start with <HEAD> and end with </BODY></HTML><BR><BR> : )


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •