A typical web page will have a structure similar to most real-world documents: a title, heading, body copy (in the form of paragraphs) and several sub-headings dividing the body copy into different sections.
HTML has six heading levels, from
<h6>. It is very important not to think of these headings in terms of “size” or “bigness”, but as levels of importance.
<h1> is the most important heading in the web page, and is often the first element after the opening
<body> tag. In a typical document
<h1> is only used once one the page, and will usually contain content related to the page title, the company name, the name of the website, or a combination of all three. It's possible for HTML5 pages to use the
h1 element multiple times in different contexts, although this may generate issues with some accessibility software.
<h2>, on the other hand, is a sub-heading, of which there may be several in a document.
<h3> is a sub-sub-heading, and so on.
<p> tags mark up paragraph content. A paragraph normally consists of several sentences; if
<p> content consists of a single word or image, you should probably use more appropriate markup.
Bringing Them Together
Using headings and paragraphs on the same page looks something like this:
<h1>About Dudley Storey</h1> <h2>Biography</h2> <p>I remember the days, sittin' on the porch with my family, singin' and dancin' down in Mississippi…</p>
Photograph by Xosé Castro Roig, used under a Creative Commons Attribution-NonCommercial-NoDerivs 2.0 Generic license