In the first part of this tutorial I showed you how to just get started and be able to view something in a browser such as Firefox or Google Chrome.
In the second part of the tutorial I taught you the basics of formatting body text, using the paragraph, header and div tags.
In this part I am going to explain the basic header tags and explain what the header is for.
Lets start with what we had before and carry on from there:
<html>
<head></head>
<body>
<p>Learning HTML is not that hard. Actually, it is rather fun. It is amazing how easy it is to learn the initial stuff that helps me get web pages up in my web browser.</p>
<p>I will test this in my browser to see what it does shortly. I guess that if I start building lots of websites, the paragraph tag will become important to me</p>
</body>
</html>
<head></head>
<body>
<p>Learning HTML is not that hard. Actually, it is rather fun. It is amazing how easy it is to learn the initial stuff that helps me get web pages up in my web browser.</p>
<p>I will test this in my browser to see what it does shortly. I guess that if I start building lots of websites, the paragraph tag will become important to me</p>
</body>
</html>
If you use Firefox or most modern browsers, you will have the option of tabbed browsing. If you run the above page in your browser, you will see that the tabs don't give you a nice name for your page. How do you change that? With the title tags.
<title>Your Page Title</title>
The title tags are important for many reasons, including telling search engines what your page is all about. Various browsers will display the text of the title tag in different places, but often it shows up on the top left hand side of the browser on your screen.
<html>
<head>
<title>Your Page Title</title>
</head>
<body>
<p>Learning HTML is not that hard. Actually, it is rather fun. It is amazing how easy it is to learn the initial stuff that helps me get web pages up in my web browser.</p>
<p>I will test this in my browser to see what it does shortly. I guess that if I start building lots of websites, the paragraph tag will become important to me</p>
</body>
</html>
<head>
<title>Your Page Title</title>
</head>
<body>
<p>Learning HTML is not that hard. Actually, it is rather fun. It is amazing how easy it is to learn the initial stuff that helps me get web pages up in my web browser.</p>
<p>I will test this in my browser to see what it does shortly. I guess that if I start building lots of websites, the paragraph tag will become important to me</p>
</body>
</html>
There are many things that can also go into your web page between the head tags. These include:
1. DOCTYPE Declaration - where you tell the browser which 'flavor' of html you are using. We will cover that later.
2. Meta tags - or the "about" tags. These tell search engines, browsers and servers information about your page, and can even have simply the name and contact for the webmaster (in this case - you.) We'll get to these.
3. Various scripting tags...We'll talk about these in future tutorials such as when we start with JavaScript.
4. Style tags - These help us keep the styling of our page separate, and let us put it into a separate file, or into the header. We'll cover this in great depth in the CSS tutorial.
5. There are various other things that can go in here. Our next tutorial will be a brief one of these, just for fun...adding a favicon
As you can see, an html head section, i.e. the bit between the head tags, is basically providing information about your page, how you want it styled, displayed, searched and what stuff you want to go on on the page with scripts.
