SitePoint Sponsor

User Tag List

Results 1 to 19 of 19
  1. #1
    Non-Member
    Join Date
    Jun 2006
    Location
    India
    Posts
    63
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    H2 tag for navigation heading?

    I am currently modifying a free template for use on one of my site. In the template the designer has used to h2 tags to define heading on top of navigation links etc. i.e. navigation, advertisement etc. here is the code that I am referring to

    HTML Code:
    <h2>Navigate:</h2>
    <ul>
    <li><a href="#" class="navText">Home</a></li>
    </ul>
    <h2>Advertisement</h2>
    Is this ok or is it bad from SEO and design perspective and should be changed to different tags?

  2. #2
    He's No Good To Me Dead silver trophybronze trophy stymiee's Avatar
    Join Date
    Feb 2003
    Location
    Slave I
    Posts
    23,423
    Mentioned
    2 Post(s)
    Tagged
    1 Thread(s)
    Heading tags should be used for headings. If those are indeed headings then that's fine.

  3. #3
    Non-Member
    Join Date
    Jun 2006
    Location
    India
    Posts
    63
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Those are headings

  4. #4
    He's No Good To Me Dead silver trophybronze trophy stymiee's Avatar
    Join Date
    Feb 2003
    Location
    Slave I
    Posts
    23,423
    Mentioned
    2 Post(s)
    Tagged
    1 Thread(s)
    Then I'd say you're using them properly.

  5. #5
    Non-Member
    Join Date
    Jun 2006
    Location
    India
    Posts
    63
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the prompt reply, these are heading to navigation, advertisement and search sections which will remain the same for each and every page on the site. Should they be treated in the same manner as headings in the content?

  6. #6
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,476
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Personally I consider headings to be used around the main page content, not menus or sidebars (unless the sidebars are contextual in nature), but that's just me.

  7. #7
    Word Painter silver trophy Shyflower's Avatar
    Join Date
    Oct 2003
    Location
    Winona, MN USA
    Posts
    10,053
    Mentioned
    142 Post(s)
    Tagged
    2 Thread(s)
    I agree with Dan. Headings are part of a page outline and a nav bar is certainly not part of an outline. Moreover, if you're putting H2 headings in your nav bar, your H1 heading on your page is misplaced, since H1 should be the first heading used in your page content.
    Linda Jenkinson
    "Say what you mean. Mean what you say. But don't say it mean." ~Unknown

  8. #8
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,476
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I had a feeling you would agree with me, Linda. The copywriter's blood is far too strong to simply ignore something like this (as is the blood of all my English teachers in school all those years ago, from first grade to my senior year in high school).

  9. #9
    SitePoint Wizard bronze trophy bluedreamer's Avatar
    Join Date
    Jul 2005
    Location
    Middle England
    Posts
    3,364
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Hmmm... What if you have a page structure like this when using a screen reader...

    Code:
    <h1>Page title</h1>
    
    <h2>Section title</h2>
    content
    
    <h3>Sub title</h3>
    content
    
    <h3>Sub title</h3>
    content
    
    <h2>Navigation</h2>
    categories list
    This would allow the user to browse by headings, so wouldn't the "Navigation" heading be useful - even if skiplinks are present? Just thinking out aloud here!

  10. #10
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,476
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    No because in your case the navigation is outside the page content, so not only are you not using heaidngs properly, but you're using them out of order as well (at least that's how I see it).

  11. #11
    Floridiot joebert's Avatar
    Join Date
    Mar 2004
    Location
    Kenneth City, FL
    Posts
    823
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If you're going to use <h*> elements to mark navigation, use <h6> elements. This will change with HTML 5 & it's sections.

    Speaking of English teachers, if my 8th grade English teacher saw me today she'd probably have a stroke. I slept in her class 90&#37; of the time & never made better than a D.

  12. #12
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,476
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    HTML 5 is allowing that garbage (when it finally becomes the standard in a couple decades)? Grrr... Another reason to cast that blight upon the earth into the bottomless pit.

    Besides, just because it may be "permitted" in 15-20 years, doesn't mean it should be used now. Adhere to the current rules whenever possible.

  13. #13
    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 Dan Schulz View Post
    but you're using them out of order as well (at least that's how I see it).
    I wouldn't say they were out of order. The <h2>'s markup the sections and then within the first <h2> section there are a couple of <h3> sections. Then another <h2> section is opened which is perfectly semantic.

    The only question is over whether a <h>eading should be used for elements on the page not related to the content.

    I think as long as an <h1> comes first then there would be nothing semantically wrong with using

    <h1>Page title</h1>
    <h2>Navigation</h2>
    <h2>Search</h2>
    <h2>Content title</h2>
    <h3>Subsection</h3>
    <h3>Subsection</h3>
    <h2>Supporting Info</h2>

    In my eyes everything that appears on the page is content so to speak and not just any copy text which makes an article.

    I understand both arguments though and personally don't tend to markup the navigation with a <h>eading but would usually markup extra sections that make up side bars with <h>eadings to clearly define that these are new sections on the page.

  14. #14
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,476
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You obviously never had a copywriter for an English teacher then, Dave.

  15. #15
    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)
    Flick through a book... Now imagine that it was marked up using HTML.

    Code:
    <h1>Book title</h1>
      <h2>About the Author</h2>
      <p>Content</p>
    
      <h2>Contents/Navigation</h2>
        <h3>Sub Content/Navigation</h3>
          <ul><li>Content</li></ul>
        <h3>Sub Content/Navigation</h3>
          <ul><li>Content</li></ul>
        <h3>Sub Content/Navigation</h3>
          <ul><li>Content</li></ul>
    
      <h2>Foreword</h2>
      <p>Content</p>
    
      <h2>Introduction</h2>
      <p>Content</p>
    
      <h2>Section</h2>
        <h3>Sub Section</h3>
        <p>Content</p>
    
      <h2>Section</h2>
        <h3>Sub Section</h3>
        <p>Content</p>
    
      <h2>Index</h2>
      <ul><li>Content</li></ul>
    Is that wrong?

    I'm sure my English teacher would have been perfectly happy with that so should this be any different for the web when marking up headings for specific sections on a page?

    Maybe the article/copy itself is the only thing that we should be marking up with headings but just because things like navigation, logo's, footers etc are consistent across a site shouldn't mean that they aren't considered to be content.

  16. #16
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,476
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    My English teachers would have ripped you asunder like a xenomorph in the "Alien(s)" franchise for that markup.

    Here's how I see it.

    Book title - header image (use the IMG element)
    Table of contents - list of links (menu)
    Each Chapter (including the forward) would be a "Web page" - and this is where I'd use my headings.

    Though bear in mind a book really isn't the best comparison one can make for Web pages - personally I think a newspaper does much better in this role than anything.

  17. #17
    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)
    I do tend to agree with you Dan, and I would also treat "About the Author", "Foreword", "Introduction", "Chapters" and "Index (sitemap)" as separate pages within a web site and usually mark these up as the <h>eadings for a page but I don't think there is anything wrong with marking a page up as above as it would clearly define where each section of the page started and ended instead of the navigation (and other sections of a page) just running into other bits of content.

  18. #18
    Word Painter silver trophy Shyflower's Avatar
    Join Date
    Oct 2003
    Location
    Winona, MN USA
    Posts
    10,053
    Mentioned
    142 Post(s)
    Tagged
    2 Thread(s)
    Most navigation bars are actually lists, whether you use the list format or not. Lists are not headings, but may be under a heading.

    According to the Merriam Webster Manual for Writers & Editors (c) 1998, "headings are words or phrases used to identify text passages".

    H1 and H2 are set flush left with space left above and below. This is not the case with list elements.

    Sidebars, frequently colored to set them off, are used for ancillary information, i.e. information that does not pertain to the main text block of the page.

    Now, here, from the same reference, is a point that may be viewed as contradictory by some. In a Table of Contents, the same headings as appear throughout a book are used... so that they are as visually close as possible to the chapter and the sub-chapter headings they depict. However, one indespensible part of the the TOC is the page number.

    I've yet to see a web site with page numbers. When there are no page numbers, you revert back to sidebar and list rules for navigation lists.

    Someone mentioned that if you title your page using the H1 element, that takes care of it. No... it doesn't. In fact, IMO this is one of the flaws in Word Press, that it highjacks the H1 element for the blog title, when actually bloggers should have that available for their blog post headings.
    Linda Jenkinson
    "Say what you mean. Mean what you say. But don't say it mean." ~Unknown

  19. #19
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,476
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It's not WordPress that does it Linda, it's the themes that are written, including the default Kubrick theme. Thankfully I have something under development that will take care of that once and for all.


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
  •