Now we're ready to start coding this up!

You need to familiarize yourself with the concept of tags. Tags send a message to the browser instructing it to display your website the way you want it to. Some tags are behind the scenes, others directly affect what the viewer sees. Additionally, some tags are grouped in pairs, others stand alone. Think if the difference in terms of comparing a push button to a switch. The switch has an "on" and an "off" position while the push button does its task one time. The first tag we are going to learn is of the switch variety and its the <html> tag. This tag identifies the page an an html page.

The first line of your file is <html> and the last line is </html>. Notice the "/" in the tag. This is how we turn the switch off.

html10.JPG

Your page is split into two sections: "head" and "body." The head contains lots of things but for now we are just going to worry about the most obvious of its tasks- displaying a message on the title bar of the viewer's browser.

html11.JPG

Notice how each new layer of tags is indented so that all the "open" tags are either vertically aligned with their respective "close" tag or on the same horizontal line (in the case of the title). This makes editing the page much easier once things get a little more in depth. Now we are going to add the body. This is the part that puts content in the main window of the browser.

html12.JPG

This isn't the most exciting page in the world, but it would load into a browser. All you have to do to make it more interesting is add some basic tags to the body section. You can use the following example and tailor it to suit your site.

html13.JPG

That's it for now! Save your file and open it with your favorite web browser. This is how the page we just built should look:

html14.JPG