Lessons

So far, you have learned the essentials of setting up a web page. But it is all source code that will not display on your page. Our next step is to look at adding text to your web page and the ways in which you can format the text.

Headings

Use of Headings is the way to increase or lessen the importance or the prominence of certain portions of text within your document. There are six levels of headings, from Heading 1 through Heading 6. Heading 1 (H1) is the most prominent (large and bold) and Heading 6 (H6) is least prominent. By default, browsers will display the six heading levels in the same font, with the point size decreasing as the importance of the heading decreases. Here are all six HTML pairs, in descending order of size and prominence:

<H1>Heading 1</H1>

<H2>Heading 2</H2>

<H3>Heading 3</H3>

<H4>Heading 4</H4>

<H5>Heading 5</H5>

<H6>Heading 6</H6>

Paragraphs

Most Web pages with any substance, use paragraphs - at least to some extent. The key point to remember is that multiple spaces and hard-returns in your code mean nothing in terms of what will be displayed. By this I mean that if you add any more than one character space between words, you will still only get one space. Hard returns do not show up at all. In other words:
<P>Text
that

is written

like
this.</P>

Will simply appear as:
Text that is written like this.

However, there are ways to include these elements (such as line breaks) in the display of your paragraph.

Line Break

If you want to end a line after a certain word, but don't want to start a new paragraph, you need a line break, which is created by using the <BR> tag. This forces a line break wherever you place it in the content (that is, whatever is after the <BR> tag will start from the left margin of the next line on the screen.)

<P>Text that is written
<BR>like this.
</P>

Will appear as:
Text that is written
like this.

Although the coding is much harder for us to read and understand, the example above would display the same if it were written all on one line as:

<P>Text that is written <BR>like this. </P>

Inserting Spaces

Remember, normal text includes no more than one space between words, regardless of how many spaces, tabs, etc., you include. Should you have the need to insert additional spaces in between words, there is a special code you can use. It is  and does not need to be housed in its own tag brackets.

This is my      special bit of text.

Will display as:
This is my special bit of text.

Although you will not need to use them all of the time (only when the browser has difficulty reading the characters) some other special codes that you may find useful are:
      non-breaking space
<        < less-than symbol
>       > greater-than symbol
&    & ampersand
"    " quotation mark
      - soft hyphen
While you’re at it, check out this page on www.pagetutor.com of other codes you will almost never use: http://www.pagetutor.com/pagetutor/makapage/special.html.

Blockquote

Blockquotes are for those long pieces of text which are quoted material and therefore need to be set apart and indented. That is exactly what blockquote does. For example:

<blockquote> Here is an example of text that would need to be contained in a blockquote. If you have a direct quote that exceeds three lines, or merely want to set a certain bit of text apart from the rest, you may use the blockquote. It will indent the text from each side. </blockquote>

This section of text is surrounded by the blockquote tags. A blockquote can exist inside of a paragraph, and always lives on its own line (which is to say, there is an automatic line break that is put in before and after the blockquote, just as with headings or paragraphs).

Aligning Text

Just like with the Headings, one can set the alignment of single lines. But it is also quite convenient to set the alignment of entire blocks of text by using Paragraph tags.
<BODY>
<P ALIGN="left">This is my special bit of text</P>
<P ALIGN="center">that takes up a second</P>
<P ALIGN="right">and third line.</P>

<P ALIGN="left">
This is my special bit of text
<BR> that takes up a second
<BR> and third line.
</P>

<P ALIGN="center">
This is my special bit of text
<BR> that takes up a second
<BR> and third line.
</P>

<P ALIGN="right">
This is my special bit of text
<BR> that takes up a second
<BR> and third line
</P>
</BODY>

This would display as:
This is my special bit of text

that takes up a second

and third line

This is my special bit of text
that takes up a second
and third line

Click HERE to proceed to the Text Appearance Tutorial.

Notes

Superfluous Spaces:
No matter how much space you put between words, whether returns or spacebar hits, the words will be separated by one space in a Web browser.

Placing tags at end or beginning:
It is best to organize your coding in a way that will be easy to understand when you look over it. In this lesson, I have begun each line with a tag and even placed the end-paragraph tag on its own line. When it comes time

for you to go in and alter text or find out why something is not appearing as it should, you will be thankful that you used effective organizational techniques.

Ending a <BR> tag
As the <BR> tag is a command to control paragraph formatting (there is no actual content that would placed within it), there is no ending </BR> tag. The line break tag is an empty tag. This actually makes sense; the concept of a line break beginning and ending doesn't really work, since a line break is a one-time event.

T.H. Barrow