Aligning paragraphs.
We've seen how the paragraph break tag can be used to create a carriage return followed by a blank line. But this isn't the only way to use the paragraph tag. This tag can also be used to align document elements by using the tag in a two part fashion, with the align parameter added in. For example: <p align=center> This is a paragraph which I would like to center. </p> The values which the paragraph tag will take in this way are: left, right, and center. This same syntax can be used with the HEADER tag.

Dividing documents into sections.
The DIV tag can be used to identify different sections of a document, and to align all of the items contained in the section in a uniform way. It works like this:

<div align=right> Here is a paragraph. <p> Here is a second paragraph. </div> In simple documents the DIV tag isn't often necessary. But it's a good thing to get into the hang of using because it will be very useful once we get into style sheets.

The PRE tag - pretty basic formatting.
The original method for arranging text on a page is to use the PRE tag. PRE stands for "pre-formatted text" and it is the only basic HTML tag which allows you to preserve common word processing elements such as tabs. Here's an example of the pre tag in action:

   I think that I shall never see
       a thing as lovely
          as
     a tree.

And here is the HTML which yields that amazing layout:
<pre> I think that I shall never see a thing as lovely as a tree. </pre> The bummer about the PRE tag is that everything which appears inside it displays in a fixed width font (typewriter font) unless you explicitly tell it otherwise using the FONT tag. Also, you are not supposed to include any non-text HTML tags inside of PRE. But go ahead and try it anyway. PRE is a good way to get whitespace into a document without repeating a break tag over and over. Meaning, some people will use sets of PRE tags with nothing but a few carriage returns inside of them in order to add whitespace to a page.

Is it worth the wait?
Back in the day web designers had to grapple with primitive page layout techniques such as those described on this page. Since these techniques are so limiting, designers quickly turned to images to achieve more complex layouts. But this comes at a cost - images take many times longer to load than plain text - so there are always decisions to be made about whether a beautiful image is worth the download time.

This might not seem like a big difference, but when you consider that many pages will have many images you can see how this technique will add up to a significant difference in file size. Techniques like these are pretty much archaic now, but in these simple techniques are the seeds of more complex technologies to come.

Building Web Sites - ITP Fall 2000 - Mike Cosaboom, Instructor
mc39@acf2.nyu.edu