HTML and CSS Reference
In-Depth Information
Headers and footers
it will likely contain the heading element for the section as well as other introductory
content (a table of contents, relevant logos, and so on). A
footer
contains content re-
lated to the section or page as a whole, such as who the author is, copyright information,
contact address, and other (generally) small snippets of information. Sometimes related
links or duplicate links to the page's main navigational menu may be found in the footer,
but in general they do not need to be put into a
nav
element if they are extraneous or
redundant links and are not critical to the main navigation of the site.
Note
It's important to note that the whole page can have a header and a footer as well
as sections on the page, so a single page could easily have multiple headers and footers.
Should we add a
header
to the existing code? Sure, but it actually isn't necessary
at the moment. A
header
is for grouping introductory content together. Currently we
have a single heading element for each section, so there is nothing to group together.
Or is there? The main navigation is a navigational aid, so that could be grouped under
the header for the page. Also, let's add a subtitle under “Site Title” named “Site Slo-
gan!”—now we have three introductory elements to group! Wrapping these in a
head-
er
gives us the following:
__________
4
Not to be confused with “heading,” which refers to the h1 through h6 elements. The header ele-
ment is not even a part of the heading content category!
5
A navigational aid could be, for example, a main menu or a search field, as often can be found
in the upper-right of many websites.
…
<body>
<header>
<h1>Site Title</h1>
<p>Site Slogan!</p>
<nav><h1>Main Navigation</h1></nav>
</header>
<section><h1>Featured Content</h1>
…
Notice that the “Site Slogan” is in a paragraph element. If a heading element had been
used, the title and slogan would be implicitly broken into two sections, which doesn't
Search WWH ::
Custom Search