HTML is an abbreviation or anacronym for
Hyper Text Markup Language.
Let's say you are an interpreter who speaks several languages. You'll
need to know which language your client speaks in order to be able to
greet them and translate what they have to say.
Beginning
your document with the HTML "tag" like
this: <HTML> tells
the browser how to interpret it.
It's the first step to building a web page.
So.. lets build something
Open your Notepad
Start/Programs/Accessories/Notepad
Type in:
<HTML>See the / in the second <HTML> tag? That tells the browser we are finished. It's called closing the tag. Almost every tag in HTML has a corresponding close tag. There are exceptions, but we'll go into those
Woohoo! My first web page
</HTML>
later. For now, if you open a door, assume it's 40
below outside, and close it again!
Then File,
Save As type - all files, name wp1.html
SCREEN SHOT
Open your browser.
On the tool bar, go to File, Open & click "Browse"
to find your wp1.html file
Double click to open it in your browser
Congratulations!!
You just made your first web page! Woohoo!
Of course there is. Now that your web page is alive, you'll become Doctor
Frankenstein and create a MONSTER! It will need a head, and a body.
From here on in, everything goes inside the <HTML>
</HTML> tags.
The
HEAD section
This is the part that says Hello. Seriously!
It's the part of your page that greets the browser, tells it what to do,
who you are, the name of your page, what to look for, and much more.
So far we have
<HTML>
Woohoo! My First Web Page!
</HTML>
Now we're going to insert the <HEAD></HEAD> tags
So we will have something that looks like this:
<HTML>
<HEAD>
</HEAD>
Woohoo! My First Web Page!
</HTML>
All monsters
need names. So we're going to give
the page a title in it's very own tag.
<HTML>
<HEAD>
<title>Welcome to my first web page</title>
</HEAD>
Woohoo! My First Web Page!
</HTML>
This title
will appear at the very top of your
browser window to let your visitors know they're
in the right place.
SCREEN SHOT
The <HEAD></HEAD> section is also where your
META TAGS will go, so that search engines can find your page.
It's where you can tell the browser to use javascript
for certain elements, or cascading style sheets. More about all that stuff
later. We don't need it right now.
Sheesh. OK,
Now for the body, and then we'll play dress-ups :)
The Story So Far :
<HTML>
<HEAD>
<title>Welcome to my first web page</title>
</HEAD>
Woohoo! My First Web Page!
</HTML>
The
BODY section
The <HEAD> is finished for now, and closed.
</HEAD>
So now, lets add the body, and put the important
stuff in there, because this is what your visitors are going to see.
<HTML>
<HEAD>
<title>Welcome to my first web page</title>
</HEAD>
<BODY>
Woohoo! My First Web Page!
</BODY>
</HTML>
Now none of this is going to make a blind bit of difference to your page.
But, it IS the right way to
make one - don't you feel good? No? You're bored?
Your PAGE is boring? You're right. It is.
So, let's dress it up a little.
