HIS 338: Religion in American History
 
Introduction | Adapting Content | Making a Page | Finishing Up
Design Considerations | Common Elements | HTML Reference | Color Table


How to Make Your Web Page

The Easiest Method . . .
Use a Word Processor:

The easiest way to design a web page is to use an HTML-enabled word processor or an HTML editor. These options provide WYSIWYG ("what you see is what you get") editing of web pages:

If you use Word 97 or Corel WordPerfect 8, the "Save as HTML" option should already be available on your word processor. WordPerfect 8 is available for free download over the campus network.

If you use and Microsoft Word 95 or Word 6 (Word 6 is also available over the campus network), there are plug-in programs which allow you to "Save as HTML." These plug-in programs, called "Internet Assistant for Word," are also available as free downloads from the campus network or from the Microsoft Web Site (www.microsoft.com).

There are two warnings about this easy option for making a web page:

A Harder, But More Powerful Method . . .
Use Hand Coding:

An alternative to using a word processor or HTML editor to make your web page is hand code it. Professional web page developers like this method because it gives them precise control over the look of the page.

The disadvantage is that learning HTML code can seem intimidating. If you have never seen HTML code, you should look at some examples. Using your Internet browser, go to any web page. In Netscape, click on View, then Document Source. Or, if you use Microsoft's Internet Explorer, click on View, then Source. A window will then pop up showing the HTML code for that page. You will see some complex code which might discourage you from trying your luck at hand coding.

However, HTML code is not nearly as complicated as it looks. You can make surprisingly good-looking web pages by just learning a few basics of HTML code.

You can create a web page using only a simple text editor. Windows Notepad or WordPad (both in "Accessories" under "Programs" on the Start Menu of Windows 95) are good choices. Open up a new file, fill it with the content you want to place on the web. When saving, chose "Save As," then "Plain Text" for type. Your file name must end with the extension .htm

The nice visual effects you see in your Internet browser are achieved by enclosing the content with HTML tags. Each tag is a simple statement which begins with the "less than" symbol < and ends with the "greater than" symbol >. Here's an example:

<FONT>

Tags usually come in pairs, an opening tag placed at the point in your document where you want a certain visual effect to begin on your web page and a closing tag, placed where you want the visual effect to come to an end. The only difference between the opening and closing tags is that the closing tag includes a slash mark /. Here's an example:

</FONT>

Suppose you wanted to place a header at the top of your page in large letters. Here's what the header would look like in your text editor:

<FONT SIZE=6>THIS IS MY HEADER </FONT>

Here's a few basic tags that will get you going.

The Beginning and The Ending

The very first thing on your web page should be this tag:

<HTML>

The very last thing on your web page should be this tag:

</HTML>

Create a Header

Next, create a header section. The information placed here will not show up in your browser window, but you can put important information here for your browser to use. Begin your header with the <HEAD> tag, placed directly after the <HTML> tag. Close the header with the </HEAD> tag, placed directly before the <BODY> tag (see below).

Add a Title

Next, include a title for your page. This will be displayed not in your browser window, but in the colored bar at the very top of your screen. Enclose your title with the <TITLE> tag. Here is an example:

<TITLE>This is the title of my web page</TITLE>

Place your title right after the opening <HEAD> tag.

Add the Main Body of Material to be Displayed in the Browser

After closing the header with the </HEAD> tag, the next tag should be the <BODY> tag. This defines the region where you are going to place the content of your web page which will be seen in the browser window. Place the closing </BODY> tag just before the closing </HTML> tag. In other words, the closing </BODY> tag is the next to last thing in your web page.

Here is what the HTML tags look like all together:

<HTML>

<HEAD>

<TITLE>Put the title of the page here</TITLE>

</HEAD>

<BODY>

Place here everything you want to be seen in the window of a web browser. You can include text or graphics--anything you want displayed by the browser.

</BODY>

</HTML>

That's all there is to making a simple web page. The code above would yield a simple web page, viewable by any browser. You could hypothetically display your whole report this way and post it on the Internet.

While your new page will be functional, it would also be drab and unattractive. The page would be black text on a gray background, with no formatting, pictures, or hyperlinks to link your pages to others. You can improve the appearance of your page by adding additional tags. You will find a list of additional tags listed at the end of this document:

As you work on your web page, you can look your web page in-progress by viewing it with the browser on your own computer. There are several different ways to do this.


This page was last updated on 2/4/99.
| Return to History 338 Supplements | Return to Top of Page | Site Map |

Dr. Harold D. Tallant, Department of History, Georgetown College
400 East College Street, Georgetown, KY 40324, (502) 863-8075
E-mail: htallant@georgetowncollege.edu.

Dr. Tallant's Classes
The American Studies Major
Georgetown College Home Page
Department of History