About usContact usSite help
Quick links
Search this site

Webpage Creation - Step 1

The Basics

Great!. Now we are going to create our first page.

First we need to enter the neccassary page headers and footers.

Open up a text editor, Notepad (Windows), TextEdit / SimpleText (Macintosh) or vi / pico (Unix) will do for now.
For the first line enter <html> and hit [Return] to start a new line.
Then <head> and hit [Return]
Then <title>My Title</title> and hit [Return] - Note: My Title is the title of your page.
Then </head> and hit [Return]
Then <body> and hit [Return]

Hit [Return] a couple of more times to create a blank page to work with.

Then enter </body> hit [Return]
Then </html> hit [Return]

Your editor window should look like this now.

<html>
<head>
<title>My Title</title>
</head>
<body>

Blank space for your content

</body>
</html>

Within your editor, save this as blank.html, then you can always use this as a template to start you off on your next webpage.

That's the basic layout of the page done. Of course if you looked at this in a browser, you wouldn't actually see anything except a blank page. Let's put something in it to look at.

The Paragraph Tag

First we'll look at the Paragraph (<p> and </p>) tag.
Within the area we've marked Blank space for your content enter:
<p>Hello World</p> ( Well everyone else uses it ).

Congratulations!! you've just created your first webpage.....
Save this webpage as myfirstpage.html, or any name that your happy with ( it must have .html at the end though ). As you can see, we started the paragraph with <p> and finished it off, or closed the paragraph with </p>

To see the results of all your hard work, open your prefered browser, navigate to the directory where you saved your myfirstpage.html file and open it. Each time we add some code you can then just right-click on a blank part of the page and select Refresh/Reload. This will then refresh the page so you can see the changes.

Or you can click here to see the results. Close the window when your finished.

Lets move on to Step 2

Seven easy steps - start from the begining or skip to the section you want:

Step 1



More Help





*