Using HTML

Headings

Headings are important for several reasons.

  1. They give the reader highlighted areas which aids scanning of the page (this is how most people read web pages)
  2. Blind users of the web have software which can read the content aloud to them. Navigation through the site is aided by the correct use of header tags.
  3. Always have a level 1 header at the top of the page, and move through the header numbers in the correct order.

Heading Tag

Heading tags look like this: <H1>, <H2> etc. Headings are automatically bold and sized. The following exercise will show you how to insert headings using the headings in this page.

Exercise

Type in the following program, save as ‘heading.html’ and view it in a browser:

HTML

<HTML>
<HEAD>
<TITLE>Sample Headings</TITLE>
</HEAD>
<BODY>
<H1>Headings</H1>
<P>Level one headings are always the first heading on a page and are the largest. This heading normally tells the reader what the page is about. On this page the level one header is 'Headings'
<H2>Heading Tag</H2>
<P>Level 2 headers is the next most important header. This is used to identify the major section of the page. On this page the level 2 header is 'Heading Tag'
<H3>Exercise</H3>
<P>Level 3 headers are next after the level 2 headers and identify the paragraph content inside the major sections. All the 'Exercise' headers on these pages are level 3 headers.
</BODY>
</HTML>

XHTML

<html>
<head>
<title>Sample Headings</title>
</head>
<body>
<h1>Headings</h1>
<p>Level one headings are always the first heading on a page and are the largest. This heading normally tells the reader what the page is about. On this page the level one header is 'Headings' </p>
<h2>Heading Tag</h2>
<p>Level 2 headers is the next most important header. This is used to identify the major section of the page. On this page the level 2 header is 'Heading Tag'</p>
<h3>Exercise</h3>
<p>Level 3 headers are next after the level 2 headers and identify the paragraph content inside the major sections. All the 'Exercise' headers on these pages are level 3 headers. </p>
</body>
</html>

Exercise

Headings can go up to <H6>. Try them!

Don't worry about the text size being huge and the colours not the same as this page. Later you will learn how to make style sheets which easily modify the text size and colour tags.

The next thing to learn is how to create links to other pages.