Your First Web Page



The first thing you need to do is open a program called Note Pad. You do this by first clicking on the [Start] button that is on the Windows task bar. Then go to Programs then to Accessories. Then under the Accessories you will find Note Pad.

The first thing you want to do now is type <HTML> at the top of the page. Then type <head> </head> directly beneath the <HTML> tag. So you will have something that looks like this when you are finished.

<HTML>
<head>
</head>










Now you want to give your page a title. To do this first type in the open title tag, <title> then type the title of your page. Let's use My first web page as a title for now. You can always change it later if you want. Next type the closing title tag which is </title>. So now you should have the following code on your Note Pad page.

<HTML>
<head>
</head>
<title>My first web page</title>









Doing good so far. Okay now we need to open our <body> tag and tell the computer what color we want our background. To do this first decide on a background color. For this example we will use a light blue. The code for the color we want is #CCFFFF. So we type in <body bgcolor="#CCFFFF">. So now your page should look like this.

<HTML>
<head>
</head>
<title>My first web page</title>
<body bgcolor="#CCFFFF">









Okay, great! Now remember everything we have done so far will not be seen on the web page but is information that the computer needs to display our page on the web. So, now let's write our first line that people will see on our page when they view it on the web.

Type in <P align="left"> This is my first web page.</P> So, now the page on your Note Pad will look like this.

<HTML>
<head>
</head>
<title>My first web page</title>
<body bgcolor="#CCFFFF">
<P align="left">This is my first web page.</P>










The tag <P align="left"> means that when you look at your page in Netscape the words "This is my first web page." will be all the way to the left of the page. remember to use the </P> tag or you may experience some problems with the way the rest of your page looks.

If you want it centered all you have to do is change <P align="left"> to <center>This is my first web page </center> and that line will show up as being centered on the page. So then your page on Note Pad would look like this.

<HTML>
<head>
</head>
<title>My first web page</title>
<body bgcolor="#CCFFFF">
<P align="left">This is my first web page.</P>










Now let's add the </body> and the </HTML> tags and you will have created your first web page.

<HTML>
<head>
</head>
<title>My first web page</title>
<body bgcolor="#CCFFFF">
<P align="left">This is my first web page.</P>
</body> </HTML>








The next thing that you must do is save your page. To do this go to "File" then "save as" (see the picture below).


When you click on "save as" a box will open. From here you must choose where to save your page.




You can name your webpage anything you want as long as you save it as something.html or something.htm. Without the .html you don't have a webpage. If this is going to be the first page that opens when someone visits your site you should name it index.html, or index.htm

Now that you have saved your work, open Netsacpe or MSInternet Explorer. Go to "File," "Open Page."




Once you have clicked on "Open page" a box like the one below will open. Click on Choose file. Then find and double click on your webpage. The location of your page will then appear in the box. Click on "Open" and your webpage will load into the browser.




Using the HTML code from our example, your page will look like this when you see it in your browser.



You have just made our first webpage. Of course you will want to add more "stuff" to your page. When you have your webpage looking the way you want log into your account and use the file manager to upload it to your account. If you haven't done so, now would be a good time to read the tutorial on HTML Tags.