SitePoint Sponsor

User Tag List

Results 1 to 10 of 10
  1. #1
    SitePoint Addict
    Join Date
    Aug 2004
    Location
    canada
    Posts
    331
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)

    H1 for title in header or body copy

    I use an H1 tag and gilder-levin image replacement to construct my header.

    But that means I have to put the title of each page into the header if I want to have only one H1 tag per page.

    And then I don't know what H tag I should put in the title in my body copy? H2?

    But that is what the viewer sees as the title.

    So the search engines will see this

    <h1>Interesting new fishing lures</h1>
    <h2>Interesting new fishing lures</h2>
    <p>blah, blah blah ...</p>

    This looks strange.

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,112
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    It's not really clear what you are saying here. Use the H1 for your visitors and the search engines. There is not difference. Are you talking about the <title> element in the head of your document?
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  3. #3
    SitePoint Addict
    Join Date
    Aug 2004
    Location
    canada
    Posts
    331
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    I am referring to the header of the web page (within <body></body>) not the the title tag within <head></head>

    I use an H1 with image replacement to show the logo of the company etc. in the header.

    But in the body copy where I also put the title visible to the reader I surround that with H2 tags.


    <h1>Interesting new fishing lures</h1> <---- This is the graphic header
    <h2>Interesting new fishing lures</h2> <---- This is a text in the body copy
    <p>blah, blah blah ...</p>

    Is this right?


    I was looking at my wordpress sites and they use H2 tags for page and post titles. So I suppose I use the same title with H1 tags and they h2 tags just so there is only one H1 tag per page.

  4. #4
    Non-Member
    Join Date
    Sep 2007
    Posts
    148
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Are they both within the same div? You can set the H1 to work differently with different divs by parenting the CSS. Such as:

    #div1 h1 {
    blah;
    }

    and

    #div2 h1 {
    blah;
    }

    Etc. If this isn't what you're talking about, please try to give us a bit more info

  5. #5
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,112
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    O, I see. You are using the H1 in the wrong place. Use it for the overall title of the page content. The logo is just decoration, so just wrap it in a div, or perhaps a paragraph (though that's not really the role of a paragraph either). Search engines look at the content of a page to decide what it's about, and the main header is a very important factor in this. Wasting your H1 on every page for a decorative logo is losing you a lot of ground.

    Remember that the H1 signals to the reader (and Google) what the page is about.
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  6. #6
    SitePoint Addict
    Join Date
    Aug 2004
    Location
    canada
    Posts
    331
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Attached is the document structure for css-tricks and they are using a second H1 tag instead of a H2 tag for the title.



    css-tricks heading structure.png

  7. #7
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,112
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    Doesn't men it's a good idea, though. That site is using HTML5, which has a slightly different document structure (where multiple H1s make more sense) but the full meaning of that document structre is not properly recognized in the 'wild' yet. There is no point in using a heading element for decoration.
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  8. #8
    Chopped Liver bronze trophy imaginekitty's Avatar
    Join Date
    Aug 2007
    Location
    Pennsyltucky
    Posts
    1,494
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    Is css-tricks some sort of authority on the subject?

  9. #9
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,112
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by imaginekitty View Post
    Is css-tricks some sort of authority on the subject?
    Not an authority; just a popular site that demonstrate some cool things you can do on the web. But plenty of what's there can be argued about.

    Off Topic:

    I've moved this to the HTML forum, as this is really a discussion about that.
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  10. #10
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    It is extremely rare a page ever needs more than one H1 and if you find you are using one per page the odds are you have done something wrong. Also is you are duplicating the logo text with the another main first copy heading then the odds are you also might want to reconsider what you are doing with the page contents and think more deeply.


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
  •