Div ID=”Header” Different SEO Tactics

It is quite natural a header div is one of the most important on-page elements and thus it is in constant focus of SEOs’ attention:

  • it is a sitewide element – it “interlinks” / unites all site subpages (and thus is one of the most important components of your site internal architecture);
  • it is the most prominent part of the site – it is usually located at the top of the page source code (and hence is a good place for your keywords).

Nonetheless not everything is that easy – while having a great SEO potential, a header may cause some serious problems as well:

  • an over-optimized header may cause incorrect rankings (e.g. when home page is ranked higher than a more relevant sub page for example);
  • an over-optimized header may lead to penalties (e.g. many of us saw penalties caused by internal anchor text over-optimization).

Most often questions related to header div SEO include:

  • is it wiser to use a text link or a (linked) image banner?
  • what’s preferable: to use keywords or a brand name as an image alternative text or link anchor text?
  • should “home” link be “nofollowed”?

Here is how most prominent bloggers handle the header SEO:

SourceHeader div typeDetailsOverall tactic
SEL headLinked bannerImage name: header-logo; alternative text: Search Engine Land!; title: Search Engine LandImage banner (alt text cites exactly what image says)
blogstorm-headLinked bannerImage name: logo; alternative text: Search engine optimization from Blogstorm; title: noneImage banner (with a descriptive alt text) + “home” link using “nofollow”
Linked bannerImage name: logo; alternative text: none; title: noneImage banner with no alt text + “Home” text link
stephanspencer headText linkH3-tagged text link; anchor text: Stephan Spencer’s ScatteringsText link (anchor text citing the blog name)
hamletbatista headerText linkanchor text: Home Text link (anchor text non-descriptive)

So as far as you can see, there is no definitive answers. My own take on the header optimization is as follows:

  • don’t have it linked to itself;
  • don’t use “nofollow” attribute for it (while “first-link-is-the-only-that-counts” theory is still questionable, you better stay on the safe side);
  • it’s best not to over-optimize the header with keywords, instead, use your brand name – it’s even better if your main keyword is included in your brand/ domain name (e.g. SEO book, SEO moz).
  • (this needs more testing) try CSS positioning the entire header div after the main content block – thus you will “show” a search crawler each page unique element first and give each page specific keywords more prominence (avoid keyword cannibalization)
Ann Smarty
Ann Smarty is the blogger and community manager at Internet Marketing Ninjas. Ann's expertise in blogging and tools serve as a base for her writing, tutorials and her guest blogging project, MyBlogGuest.com.
Ann Smarty

Comments are closed.

22 thoughts on “Div ID=”Header” Different SEO Tactics

  1. The confustion on proper use of Div tags contin ues. SEO has too many conflicting sources of confounded information. No wonder the world wide wde is full of junk code. Learn more about algorithms and code synchronization … contact an SEO firms that actually ranks in te natural listings.

  2. Ann, I would like to add my two cents here, and if you think I am somewhere wrong, any improvement tips would be very welcome.

    I use first my logo, which on the homepage is not linked to itself, and the deeper pages logos link to the homepage. I use an alt and title attribute with exactly what the image says. I use the title attributes for browsers that do not understand the alt attribute, i.e the older Firefox versions.

    Next I have a keyword rich tag, then my main navigation, then my main content, then my sub (side) navigation and at the end the footer.

    How about that?

  3. @John, I am pretty sure, your approach works best… Btw, by “keyword rich tag” you mean “Leading Organic Search…”, right? – Very good thinking…

  4. What in the world are you talking about? The best that I can figure out is that you are actually talking about optimizing the website page header logo.

    If so, your post title is a mighty obscure way of making this point.

  5. @John, header logo is only one of the ways it can be represented: text link is another way… that’s why I tried to make it more general, you see?

  6. ‘Div ID=”Header” Different SEO Tactics’ – is an enough bold theme and writing it is possible only on the basis of own experience. On the basis of my experience (> 10 yrs) – all said not right

  7. Ann I had a problem, which after all I solved. When you look at the source of my pages, the very first thing you see in the body are the skip links, then the logo, and then the heading tag.

    If you look at our pages in Google cache, you will see that the logo comes first, then the heading tag and then the skip links.

    I achieved that with server side scripting.

    If you look at the heading I changed recently reads “SEO & Custom Web Design Experts for Better Search Engine Rankings”, so the very first word in my body is “SEO” and that in a heading tag.

    So as you see I am not hiding any text, I am just changing the code positions for users and bots.

    What do you think about that solution?

  8. for optimization can i use div id= header tag for all my web pages or it should only be used for first page itself or should i use div class=inside header for rest pages.

  9. Guys, first I would like to say this is a great site – very useful and helpful. Now, please, take a look at this example:

    text description – bla, bla, bla
    Some name
    Other name
    Created by
    Designed by
    Created by
    Designed by

    var s = new swfIN(“intro.swf”, “site”, “100%”, “100%”);
    s.scrollbarAt(600, 400);
    s.detect( [8,0,0] , “update.html”, true);
    s.addParam(“bgcolor”, “#ffffff”);
    s.addParam(“menu”, “false”);
    Javascript must be enabled to view this site

    This is taken from a index.html file from one site. Please, note, that this “div_seo” is in the body of the page (which is a flash in that case). Anyways, what do you thing about this approach and will be helpful if I include the same “div_seo” in the internal pages of the site?

    Thanks in advance!

    1. ups, so I can`t use html tags – ok, so it should look like this if we remove the parenthesis

      div id=”div_seo”
      text description – bla, bla, bla
      Some name
      Other name
      Created by
      Designed by
      Created by
      Designed by
      script type=”text/javascript”
      var s = new swfIN(”intro.swf”, “site”, “100%”, “100%”);
      s.scrollbarAt(600, 400);
      s.detect( [8,0,0] , “update.html”, true);
      s.addParam(”bgcolor”, “#ffffff”);
      s.addParam(”menu”, “false”);
      Javascript must be enabled to view this site

      Anyway, I`m sure you`ve got the point here :))