Use of Header and Footer Tag in HTML 5 Document.
There are lots of confusion among the beginner that where to use header footer section and so on.Stay with me by the end of this lesson you have a firm idea about the usages of this tags.
Header and footer
Header is the heading section of a document.It would be use anywhere where a heading section is needed.
Every page have a header.So we use header at the top after the body tag.This tell the browser that is the header of entire document.At the bottom of the document we need to put a footer tag for the entire document.
Example:
Article also have header.So in a article we can use header tag.Some article use more than one heading tag like h1-h6. and other information.But the should be the article header all together.
Lets code and prove this
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Header and footer</title>
</head>
<body>
<h1>Checking</h1>
<article>
<header>
<hgroup>
<h2>Discover the world's Nature</h2>
<h2>Join Our Club</h2>
</hgroup>
<span>Official announcement Date:12-01-2013</span>
</header>
<p>
Here is the Description of the Tours Destination
</p>
<footer>
<p>Posted by Admin</p>
</footer>
</article>
</body>
</html>
Check Outline Now
This is the outline of the document
1.Checking
1.Discover the world's Nature
This is what we expected.
Header
In the above example We use header and footer tag in a article tag.Article have a header,normally we just give a h1-h6 level heading to make a header of the current article.But if we need more than one heading tag and add some other information on header of the article then how browser realize that all of the information togetherly a header of current article.TO make understood to browser we need keep all of the heading information into a header tag.So now browser realize that in header tag all of the information is the heading of the article.But also use hgroup tag if you want to make a single heading with two or more heading tag like h1,h3 so on.
In the above article i use two heading tag and put them in a hgroup tag that's tell the browser do not make sub-section and both of the heading tag is surved as one heading.
In above code if you erase the hgroup tag the outline would be like following.
1.Checking
1.Discover the world's Nature
2.Join Our Club
Footer
In a footer of a document document creation , author name, creation time and some other inforamtion may have.if you do not wrapp this information in a footer tag then browser or user agent assume this information is the part of article content.But in reality it is not.
HTML 5 syllabus
