My First Web Page - Step 2
Can you see your first page?
If you are not successful on your first page, you need to redo it until you get it right.
What follows will be a continuation of the first page.
On the first page, we learned the open close tags and the <p> paragraph.
Now we're going to learn the headings H1 - H6 and the list.
Heading Elements h1 to h6
Insert this line before your previous code - "This is my first page."
<h1>This is Header 1 </h1> <p>This is my first page. </p>
Repeat the same till H6 after the <p> line:
<h1>This is Header 1 </h1> <p>This is my first page. </p> <h2>This is Header 2 </h2> <h3>This is Header 3 </h3> <h4>This is Header 4 </h4> <h5>This is Header 5 </h5> <h6>This is Header 6 </h6>
Save the file (Ctrl-S) the view it with your browser.
Again, do not proceed unless you got it right.
This is what you should see on your screen.
Use Headings in a logical order...
Make sure you could view all the 5 headings including the first line we code previously.
On your screen, this is what you should see:
This is Header 1
This is my first page.
This is Header 2
This is Header 3
This is Header 4
This is Header 5
This is Header 6
Of course the sizes of the fonts on your screen are not the same as those you saw here.
That is because as we didn't assign a size to each tag, so the browser produces its default sizes.
The usage and importance of Headings
HTML provides 6 different tags for marking up headlines: h1, h2, h3, h4, h5, and h6.
Most pages use only 3 headlines. I usually use up to 4 and at times use h5 for my Wordpress navigation at the sidebar.
Search Engines Optimization specialists recommend using the h1 only once per page.
We just need to follow this for the time being...
Later on, when we move to HTML5, things will be different.
In case you want to know, though it is not important at this stage.
We will be coding in XHTML. When you are ready, we shall upgrade to HTML 5.
11 Dec 2010 - I no longer code in xHTML. Just HTML, and gradually into HTML5 if we need not apply the IE hack. If you do not understand at this stage, ignore it. Everything works fine.
If you are ready, we shall move on to step 3 of my first web page.