Generally, you divide your document into parts, which may in turn
be divided into parts etc. In HTML, such division is expressed
using headings of different level. The lowest-level
parts in this hierarchy consist of one or more paragraphs.
In addition to normal paragraphs and some special kinds of paragraphs
like (long) quotations,
supports lists and
tables, which can be regarded as paragraph-like.
The internal structure of paragraphs and paragraph-like elements
is expressed using text level tags, to be discussed later.
The tags for expressing major structural features, so-called
block level tags, are the following:
- headings of different levels:
H1, H2, H3, H4, H5, H6
- paragraph level tags:
- normal paragraph: P
- quotation presented as separate paragraph:
- author's address information as separate paragraph:
- preformatted text to be displayed as such, preserving
layout (lines, blanks): PRE
- normal unordered list:
- compact list of one-line items: MENU,
- list of small items: DIR,
- ordered list: OL, LI
- definition list (labelled list):
- tables: TABLE, CAPTION,
TR, TH, TD
- division of document into parts which may have their own
layout properties (such as centering): DIV,
- change of topic: HR
- fill-out forms: FORM,
A recommendable approach,
which may need adjustments to fit your local
recommendations, is the following:
As regards to the paragraph level,
there are quite a few
alternatives. The following list is intended to give some practical
guidelines for selecting a suitable alternative:
- Write a descriptive heading for the entire document and use
with ALIGN=CENTER attribute for it.
- Divide the document into major parts (sections), write suitable
titles for them, using
H1 with ALIGN=LEFT. In this and further
divisions, try to avoid having more than seven parts.
- If necessary, divide each major part into smaller parts with H2
headings, and if needed divide each of these subsections into
subsubsections with H3 headings. Avoid using H4 headings and
especially H5 and H6 headings, both because they are often
rendered with a very small font and because more than three
levels of structure tends to make the document hard to read.
(If you still feel tempted to use H4, consider dividing the entire
document into smaller documents.)
- If you have a section with, say, H2 heading and containing H3
headings, avoid inserting text between the H2 heading and the first
H3 heading. Such "homeless" text
can be acceptable if it only contains
very short notes such
as general orientation, some remarks about the section, or a motto.
Long homeless texts confuse the reader who does not see your good
intentions; therefore, use a subsection with a heading of the
appropriate level and with text like
- Divide the smallest parts of the above-mentioned structure
or paragraph-like blocks (namely lists or tables).
as described below.
Notice that in HTML you must explicitly indicate paragraph division
by HTML elements; leaving just an empty line does not
cause a paragraph break.
- Within paragraphs, use text level markup,
normally phrase markup, to distinguish special text segments
from normal text, e.g. to indicate
quotations of computer output or to emphasize
- Add links and, if applicable,
images or other illustrations.
- For normal text paragraphs, use the
- However, if the text of the entire paragraph
is literally quoted from some source, use the
element or, if it is program code, computer output or
some other text that shall be presented exactly honoring the
division into lines, use the
PRE element. In the latter case,
if monospaced font is not suitable (e.g. the text is a poem),
and append a BR element to each line.
- As a special case, if the paragraph is intended for providing
information about the author (that's you), use the
For itemized information,
which logically consists of
separate cases or items, use various elements as follows:
Notice that in a typical implementation MENU and DIR elements are
rendered similar to UL elements. Moreover, DL element rendering
can be awkward, too. Please browse a separate file
Examples of various list elements in HTML
to see what renderings of lists look like in your implementation.
- The UL, MENU, DIR, OL, and DL elements are "plain lists" with no such
structural feature as the
CAPTION in a TABLE element.
It is usually desirable to have some sort of heading or explanation
before the list, but from the HTML viewpoint it is a separate
- For list of items where the order is not significant,
such as a list of ingredients in a recipe,
UL element, or the
MENU element (for a list of
rather small items), or the
DIR element (for a large list
of small items, suitable for presentation in
However, since most browsers do not present MENU and DIR in the manner
suggested in the specifications but as identical to UL,
you may wish to consider other
possibilities as well, such as
using tables to represent menus.
- Notice that e.g. in an alphabetical list the order is usually not
significant in the relevant sense; if the order is so
explicit, there is hardly any need to make it more
explicit e.g. by using numbering.
- For list of items where the order is significant and
needs to be made explicit,
such as a sequence of instructions to be obeyed in that particular order,
use the OL element.
- For a list of items with short titles or tags,
such as a list of definitions for terms or abbreviations,
use the DL element.
However, you may like to consider
using a TABLE element to present a definition list
as an alternative.
- For tabular information, normally use the
but consider the possibilities provided by PRE and
DL elements, which may be suitable in special cases.
List can be nested in the sense that an item in a list, i.e. an
LI (or DD) element, may in turn
contain a list element.
Notice that the basic paragraph element
P is not nestable, i.e. you
cannot have P elements within a P element to create subparagraphs.
However, the various list elements effectively provide an itemization
structure which essentially corresponds to subparagraph division.
Moreover, the list elements are nestable.
of last update: