Every webpage has three essential parts: the head, the title, and body. You can actually make a functional webpage without the head and title, but you really should never do that. And, so, for all intents and purposes you should consider them as essential parts. In this tutorial, we’re going to learn how to create these three essential parts, and how these parts function in the webpage.
To make these three essential parts, we will need to become familiar with four different HTML tags: the HTML tag, the HEAD tag, the TITLE tag, and the BODY tag.
The most essential tag of them all is the HTML tag itself. Every webpage must be contained within a pair of HTML tags (<html></html>)—no ifs, ands, or buts. So, our first step is going to be to open up or text editor and type in the following code:
<html>
</html>
Everything else that we type is going to be inside the opening and closing HTML tags. The HTML tags define the HTML document.
Every webpage has (or should have) a HEAD section. The head section can contain all sorts of things that relate to the webpage in some way but that should not actually be within the webpage. As you learn more about HTML, you will learn about the various things that can be placed inside of the HEAD section. But, for now, the only thing we’re going to put in the HEAD section is the page’s TITLE, which, of course, is placed inside of the TITLE tags (<title></title>).
Yes, you heard right. The page’s title is not actually in the page itself!
Most browsers will put the page’s title in the title bar of the browser’s window. But, some browsers may handle the title a bit differently. For instance, Google’s browser called Chrome displays the page’s title in the page’s tab. This usually results in only the first five or six letters of the title appearing. To see the whole title, one typically must hover the mouse over the tab, and then a little tool-tip-type window appears showing the full title. At any rate, no browser that I am aware of displays the page’s title in the page itself.
Just as an aside, the page’s title is what Google displays as a clickable link (usually colored blue and underlined) for indexed pages in its search results.
So, let’s go ahead and add the HEAD section and see how it looks so far:
<html>
<head>
<title> Page Title Goes Here </title>
</head>
</html>
All that is left is to define the page’s BODY. Of course, that is done with the BODY tags (<body></body>). As was stated earlier, the page’s BODY contains the stuff that you want to be in the webpage.
Let’s go ahead and add the BODY section to your HTML page and see how looks:
<html>
<head>
<title> Page Title Goes Here </title>
</head>
<body>
Stuff that you want to display within the webpage goes here.
</body>
</html>
Well, there you go. You now have a very basic webpage. It certainly won’t win you any webpage design awards. You could actually save this file with the .html extension (for example, you could call it "basic.html"), and then he could open it with your Internet browser. If you do, all you will see is the words: Stuff that you want to display within the webpage goes here. Go ahead and try it. See what happens.
Well, that concludes this lesson. Be sure to come back for my next lesson (which I haven’t written yet).
