HTML Tutorial

HTML and Style Guides

Graphics and Creating Graphics

HTML Assistants

Web Browsers

Tips and Fun Stuff

HTML Tutorial

Putting text on your page

Web pages are excellent ways to provide information to thousands of people. The first question you need to ask yourself is "What information do I want to provide?" Your answer to this question will determine the layout of your page. If your answer is "just textual information on a certain topic" then your quest will be fairly simple. Other text may require a little more work.

Plain Text
Bold, italics, and underline
Center
Tables
Lists


Plain Text

A good deal of your page will be information just as you see this - plain text. Netscape and other browsers will automatically wrap text to fit in its window. For example, if you have your window sized to about half the screen, you are probably seeing ten or so lines of text. On the other hand, someone who has maximized this window to full screen may only see five lines of text in this paragraph.

For this reason, you don't have to worry about putting breaks at the end of your straight text. When you type your text in Notepad, you will have to press ENTER at the end of each line. Netscape will ignore these breaks and size the text accordingly.

Bring up your Notepad file and type in some text you want on your page. For example, you might want to write a paragraph or so about yourself, your classes, or programs your department offers.


<BR> and <P>, Them's the Breaks!

This automatic wrapping of text does have its drawbacks. If you were to type your text into Notepad as

Information Item 1
Information Item 2
Information Item 3

because you wanted each item to appear on a separate line, it wouldn't work. Netscape would display the information as

Information Item 1Information Item 2Information Item 3

This brings us to the codes for plain text, <BR> and <P>. Neither of these codes need a closing code.


<BR>

Use this code for single space breaks. For example, if you wanted the above example to look like

Information Item 1
Information Item 2
Information Item 3

you would put a <BR> at the end of each line. Thus a sample Notepad file would look like the following:

<HTML>

<HEAD>
<TITLE>Academic Computer Lab</TITLE>
</HEAD>

<BODY>
<H1>
The Academic Computer Lab
</H1>

The Academic Computer Lab is open longer than any lab on campus. We stay open late so students can have the time to get their homework done. We even open on weekends. Here are our hours:<BR><BR>

Monday through Thursday: 7:30am - 11:00pm<BR>
Friday: 7:30am - 6:00pm<BR>
Saturday: 9:00am - 5:00pm<BR>
Sunday: 12:00pm - 10:00pm<BR><BR>

We hope you will drop by soon and check out all of our wonderful software and resources.

</BODY>

</HTML>

To see how it would display in Netscape, click here.


<P>

In the above example, <BR> was used twice in a row in two cases. We did that to create a double space. If you remember, I said <BR> was for single spacing lines. To avoid using a bunch of <BR>'s for double spacing, you can use <P> instead. The HTML code <P> will automatically place a return at the end of a line and add a blank line. In effect, <P> will double space your lines for you. We could have used <P> instead of <BR><BR> after the Sunday hours to obtain the same effect.

Try inserting <BR>'s and <P>'s into your own Notepad file.

Return to Menu


Bold, Italics, and Underline

The codes for bold, italics, and underline work almost exactly like you would see them in reveal codes in WordPerfect and are extremely simple to learn.

<B>some text</B> where "some text" would be bold on your page.

<I>some text</I> where "some text" would be in italics on your page.

<U>some text</U> where "some text" would be underlined on your page.

Simple right? You might add some to your own Notepad file.

A word about underlining text. In typography this has been discouraged because the underline goes through descenders such as g, j, p, and q. It has been more acceptable to use italics in place of underlining. However, in graphic based browsers underlining regular text is even more discouraged. If you have noticed, most browsers underline links. If you underline regular text, there is a chance that someone may confuse that text as a link. In general, stay away from underlining and stick with italics and bold.

Return to Menu


Centering Text

This is another simple code similar to Reveal Codes in WordPerfect.

<CENTER>some text</CENTER> where "some text" would appear centered on the page.

You can center more than just one line however. If you wanted your entire document centered for some reason, you could put <CENTER> right after your <BODY> code and </CENTER> right before your </BODY> code. Many people like to center their first header. To do this, you would simply have

<CENTER><H1>My Title</H1></CENTER>

Don't forget the end center code or strange things sometimes happen to your document. Another note. Be sure to include the ending bracket on every ending code. Without these brackets, the browser gets confused and again, strange things sometimes happen.

Return to Menu


Creation Web Page
Page maintained by Julie A. Duncan, ITS
Cameron University, Lawton Oklahoma