Webbrowsers do not interpret and display text like a word processor, and that, if we want to achieve a readable page, we have to rely heavily on workarounds.

The most essential, versatile and effective of these in html 3.2 is the use of Tables.

Tables pt I:

The Tables used in html are the same sort of tables we're all familiar with from spreadsheets: rectangular containers (cells) arranged in rows and columns. Tables may or may not have a border around them.
Here's an example of a three-row, 2-column table with a 3-pixel border:

(see the code for the above table)

The same table, with no borders, looks like this:

Tables, in html, are coded with the tag <TABLE> </TABLE>. Within the <TABLE> tag, you may place various attributes (some of them will already be familiar to you): ALIGN="LEFT" (or "RIGHT" or "CENTER"); CELLPADDING="x"; CELLSPACING="x"; BORDER="x"; BGCOLOR="#xxxxxx" HEIGHT, WIDTH; and so on. "Cellpadding" refers to the number of pixels that the contents of a data cell are set off from the edge; "Cellspacing" creates a space around each data cell; the effects of "Border" we have seen already. The BGCOLOR attribute means that you can color the background of the table to stand out from the page: for example, this page is constructed with a very narrow cell colored purple, giving the illusion of a stripe running down the side of the page.

Table Rows are next: the tag is <TR> </TR>. While <TR>s may contain alignment attributes, it is preferable to place these within the <TD> or Data tag.

The last item in the table hierarchy is the Table Data Cell: <TD> </TD>. <TD>'s can also hold a number of attributes: ALIGN, VALIGN, BGCOLOR, BACKGROUND, HEIGHT, WIDTH, etc.

This is much simpler than it sounds: the main thing to remember is that tags must be closed in the order they were opened, and that Tables are relentlessly logical!

Tables pt II:

You can achieve all sorts of interesting effects with tables, simply by changing the alignment within table cells, the background colors or the width and height of cells. You can make a sort of grid effect without using table borders by setting the Cellspacing attribute at x pixels. Look at the following example for more ways of coding tables, using different background colors in the main page and in the table itself. (example 1)

Tables, pt III:

Another couple of very useful attributes to a <TD> are the COLSPAN="x" and the ROWSPAN="x" commands. For example, the line above this section entitles "page layout with tables" has been achieved by a COLSPAN="6" attribute: the table this page is laid out is contains 6 <TD>s, and I have spanned them all with the one attribute.
ROWSPAN works similarly: and, in a table with borders turned on, the borders disappear in the spanned columns or rows. (example).
Together with the <TABLE> attributes of CELLPADDING and CELLSPACING, you now have a handy set of tools for laying out a page in an attractive and readable manner. The three tables below contain exactly the same number of columns in each row, i.e., 7:

The attribute COLSPAN="x" (where x is the number of columns to be spanned) is inserted into a <TD> tag to force that tag to span several columns.

The attribute of ROWSPAN="x" (where x is the number of rows to be spanned) works the same way: