Using Headers Properly

Using Headers Properly

Headers in HTML and XHTML are tags used to define the headings within your page. There are six levels of headings, from <h1> . . . </h1> to <h6> . . .</h6>. The <h1> . . . </h1> level header is considered the most significant header, such as a page title, with an <h2> . . .</h2> level header performing as a subhead and so on. Headers at the fifth and sixth levels are rarely used, although you will find them occasionally in very complex documents. Example 2-1 shows a list of headers as they might appear in a document, although there would be text between each header.

Example 2-1. Headers with logical content contained with them

<h1>Welcome to Molly's Home Page!</h1>
<h2>Books</h2>
<h3>As Author</h3>
<h4>Book Title</h4>

Typically, you'll want more than one subheading per sectionit helps your content to be more understandable to readers. As you can see from Figure 2-1, each level header I've used has been visually formatted to be larger at the <h1> level and become progressively smaller.

Headers Are Structural, Not Visual Display is considered discretionary to the browser manufacturer. You will use CSS to style your headers later. Headers should be used in a hierarchical fashion because the tags are describing the text being formatted.