Learning HTML Website Creation for Beginners: Part 1

So you would like to make a web page but you don't know the first thing about how to program a computer and you don't have any of the pre-made programs that would help you build a page from scratch.

This article is going to take you from the very beginning of how to build a web page all the way into the more advanced commands until you have a finished web page that you can put up on any hosting domain.

The first thing you need to know is that it isn't very hard at all to program in HTML to create your own web page. You don't need a fancy program to do it for you. All you really need to make a web page you already have on your computer. What you need to created a web page is "notepad" that comes just about with any operating system.

Also the commands that HTML uses to create a web page are very simple as well. Their not even called commands. They are called "tags". If you want to see what a web page looks like in the HTML code just go to any web site and right click somewhere on a blank area of the page and in the box that comes up click on "view source" notepad with open up and you will be able to see how the page was written.

This is really how I started out. I looked at the HTML of different web sites and started learning what each tag in the code did. The first time you look at a web page like this it might look very complex but really it is not. Some times the tags just get packed together on a page and this can make it hard to read.

There are some basic tags that every web page on every web site has. They have to be in there or the web page just won't work. Theses tags are: , , , , , , , & .

These tags are the frame work of every web page. You may see HTML tags capitalized but the computer does not need them in caps to know what they are. Most people put them in caps so they are easier to see on the page. And from here on out I will be doing the same.

a tag consists of both left & right arrows "" and the command in between as in There can also be other variables in between the arrows of some tags but we will get into that a little while later.

The first tag tells the computer that this is not just an ordinary text file. But that this is a HTML file The next tag is where special instructions go that have the web pages do special things. This is also where "META TAGS" go. meta tags are special instruction that tell search engines different things about your web page so they can be posted on search engine sites like Google.com. You don't have to know anything about these meta tags. There are sites on the Internet that have meta tag generators that will create these tags for you.

The next tag is the title tag. . Anything you put after this tag will show up in the title bar of a web page. The next tag is . If you look closely at the two tags they look almost the same with one important difference and that is the back slash "/". Look at them side by side. The first tag is the opening tag and the tag is the closing tag and anything in between these two tags will be displayed as the title of your web page in the browser window. The next tag is the tag. This is the closing tag to the head section. Notice the backslash "/".

Next is the tag this is where words and images that you put on your web page go so that they will show up on your web page. The next tag is . This ends the body of the web page and the final tag is to close the web page. Here is how all the tags should look on your notepad.

This is my first web page.

Now in notepad click on "File" and then "Save as" and give the file the name "myfirstwebpage.htm" and save it to your desktop. Now go to your desktop and double click the file and a blank web page should come up with the only thing being on it is the title in the title bar of the page.

I want to take just a minute here to talk about another tag called the comment tag. If you looked at the code of some web sites you will see that sometimes they are all pushed together and hard to read. A way to avoid this by the use of comment tags. A comment tag looks like this: . This comment will not show up on your web page. You will only see this comment when you look at the code.

This tag has no closing tag. This tag is closed after you put the right arrow ">" on the end. This tag is good to use to keep the different parts of your web page separated so that you can work on it more easily. This tag is not essential to a web page but it will make things a little easier for you. Here is how you might use it.

This is my first web page.

This is the basic frame work of any web page. In the next article we will start filling in the body of your new web page.