HTML and CSS Reference
In-Depth Information
<h1>Heading Level 1</h1>
<h2>Heading Level 2</h2>
<h3>Heading Level 3</h3>
<h4>Heading Level 4</h4>
<h5>Heading Level 5</h5>
<h6>Heading Level 6</h6>
Save the file as heading.html. Launch a browser such as Internet Explorer or Firefox to
test your page. It should look similar to the page shown in Figure 2.5. You can compare
your work with the solution found in the student files (Chapter2/heading.html).
Notice that each heading in Figure 2.5 is on its own line and that there is a blank line
between headings. The heading tag is a container tag. Notice how there are always cor-
responding opening <h#> and closing </h#> tags. It's a good idea to use headings to
emphasize important topics or sections on a Web page.
Figure 2.5
Accessibility and Headings
Heading tags can help to make your pages more accessible and usable. To indicate areas
within a page hierarchically, code heading tags numerically as appropriate (h1, h2, h3,
and so on) and include page content in block-level elements such as paragraphs and
lists. Visually challenged visitors who are using a screen reader can configure the soft-
ware to display a list of the headings used on a page to focus on the topics that interest
them. Your well-organized page will be more usable for every visitor to your site,
including those who are visually challenged.
Focus on Accessibility
The Paragraph Element
Paragraph elements are block-level elements used to group sentences and sections of
text together. Text that is contained by <p> and </p> tags will have a blank line above
and below it.
Search WWH ::

Custom Search