seo Question posted in
Some basic information to get you started with this can be found here.

Use header tag in html – SEO

Why would one use <header> tags or <footer> or <address> tags? Is it just for SEO, or another reason?

I ask this question because IE8 and older doesn’t support many of these elements.

Tags:

2

Answers


  1. 0

    These are all tags introduced with HTML5. They are part of an evolution of HTML. They’re not supported in IE8 because they were introduced after support for IE8 ended. They were introduced to provide more logical elements that were commonly used in web page designs.

    If you need to support IE8, you can do so by not using these tags and sticking with <div> tags with classes, such as:

    • <div class="header"></div>
    • <div class="footer"></div>
    • <div class="address"></div>

    accompanied, of course, by CSS styles for each.

    They have nothing to do with SEO.

    Login or Signup to reply.
  2. 0

    The tags you describe, such as a header tag, are what is known as ‘syntactic sugar’. That is, it makes it easier to read and know what the intent of the tag is. This is good for human readers, but it is especially useful for automated systems.

    Compare these examples that all could mean exactly the same thing:

    <header>...</header>
<div class="header">...</div>
<div class="hdr">...</div>

    Note that header is easy to differentiate from the two div tags. Only if you know what the class attribute means will you understand what the div tags are defining. Because the class attribute value is free-form, it means there is no standard definition.

    SEO is one example of an automated system that might need to read the tag directly and understand that it has a semantic meaning. A particularly observant SEO engine might understand that the above three tags all refer to the same semantic definition, but you will agree that writing an engine that would presciently know all three mean ‘header’ would be difficult. In fact, there is nothing to disambiguate the latter two from <div class="zebra">.

    Having automated systems be able to read your code and understand the semantic meaning goes well beyond SEO: it can make automated handling of mobile versions easier, for instance. You no longer have to hand-roll code for your specific implementation. You can use Javascript libraries that might do handy things with your headers, such as allow them to be sortable or auto-link them. Anyone writing those libraries has an easier time doing it.

    You also ask why you would use something not supported by older browsers that are still widely used. That is a question of demographic: what is your app targeting? If you need the 6% of the world that is using an old browser to utilize your application, then you should absolutely use backwards compatible techniques. If, on the other hand, you want to make the UX the best possible for a set of users likely to be using a modern browser, then you should use the new tags. (Note that having bad UX or long development time as you roll your own solutions to things may cost you more than 6% of your application’s userbase…)

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search