Html and Web Site Construction

Chapter 1

Planning

When you plan your web page you start by writing everything down on paper. Write what you want your web page to say, show, and do. To make a map of the links you will be using, write a circle in the center of a new sheet of paper and write HOME in it. Then draw lines to other circles that say the names of your sub pages. Later you will learn how to link your home page to your sub pages.

Chapter 2

Starting your front page

First we want to have a simple text program to use. Go to START programs Accessories NOTEPAD. Notepad is the only program I found to work for html. After you are in notepad type the following.

- this will start an html document

- starts the header

- title that you see at top left corner on screen

- ends title

- ends header

- starts the body ( the guts )

- ends the body

- ends html document ( IMPORTANT )

After the 1st tag, type the name you want to appear in the upper left corner of your screen. This will put whatever you typed ( between the two title tags ) up in the upper left corner of your screen. Note: Make sure that you type in between the two title tags. If you don't you won't see the title on the screen.

TIME TO SAVE! After you finish typing your title click on the file option menu at the top of the screen. Once there, click "save as". Save the document to a new 3 Ð..." floppy as home.htm. You must save it .htm or your internet browser will not open. If you are done saving it go to "my computer" on the desktop and click on 3 Ð... floppy ( A: ) Then click on home.htm. When the file opens up look at the upper left hand corner of your screen. There you should see your title. To edit the web page and add more stuff, click on view ( at top of screen ) then click source. Notepad should open up with the codes you typed earlier. After you are done editing go to file save. Then go back to your web page and click REFRESH. This should refresh the screen to what you just typed.

Chapter 3

Text, centering, coloring, and font

To enter text into your web page, all you need to do is type what you want any where in between the two tags. Save and refresh. And you can see what you typed.

To center text ( and pictures ) all you need to do is type before the text you want centered and after.

To change the size of the letters type before and after text you want bigger or smaller. Note: 4 can be changed to 1, 2, 3, 4, 5, or 6. Only 1-6 will work.

Effect BEFORE text AFTER text

BOLD

ITALIC

SLASH

To color text just type before the text you want a different color and after. Note: green can be replaced by the color you want the text to be.

Chapter 4

Pictures

To enter a picture into a web page you need to have the picture you want to use saved in the same folder as the web page it will be in. The only way you can store the picture anywhere else besides the same folder, is if you put in the full file path. Then in the code type

A: is the file path where the picture is stored. If picture is in another file named pic you would type A:pic then the picture name.

Frog.gif is the picture name

.gif is what the picture is saved