WEB DESIGN GARAGE [Electronic resources] نسخه متنی

Working with Header Tags

HTML provides six levels of headersh1 through h6in descending order of structural and visual importance, as Figure 40.1 shows. First-level headings are bold and large, like the main headline on the front page of a newspaper. Second-level headings are not quite as large, like the supplemental or section headlines in the paper. On it goes, until you get to sixth-level headings, which are like the bold text at the beginning of a classified ad: not much of a headline, but a headline nonetheless.

Your well-coded HTML document should use the header tags to denote the logical structure of your page. That is, the main headline of your page should use the h1 tag. A subsection under this heading gets the h2 tag; a sub-subsection gets the h3 tag, and so on. Ideally, if you remove all the running text from your page, a properly structured set of header tags gives you a complete and accurate outline of the information on your page, like this:

Welcome to my home site (h1)

What you will find on my site (h2)

About the games page (h3)

About the news page (h3)

About my online gift store (h3)

Information about me (h2)

My résumé (h3)

Current employment (h4)

Previous employment (h4)

Education (h4)

Graduate studies (h5)

College (h5)

My hobbies (h3)

Shoelace art (h4)

Favorite techniques (h5)

Links to shoelace sites (h5)

Basket-weaving (h4)

Favorite techniques (h5)

Links to basket-weaving sites (h5)

My contact information (h3)

Street address (h4)

Telephone/fax (h4)

Email (h4)

Remember, it doesn't matter so much what effect these tags have on the appearance of your text, since you can use CSS to make the tags generate whatever typography you want. The important thing is to make sure you use the tags consistently and as HTML designed them to be used.