HTML
Your website cannot appear on the web without the use of the html. Html stands for
Hypertext Markup Language. A web browser uses html to construct a web page. Your
web page won't look the same on all computers and with all browsers. Html uses tags to
describe how a page should be structured. There is usually an opening and closing tag.
Let's take a look at some tags to see how they work. An opening tag is enclosed between
a less than and greater than symbol. A closing tag is the same except there is a
backslash after the less than symbol. Each tag has a specific job to do. The <html> tag is
used at the very beginning of your page. It defines your page as an html page that can
appear on the web. The closing tag </html> is placed at the very end of your page. The
letters in the tag can be capital or lower case. A page has two main parts. The Head and
the Body. The Head tags are <head> and </head>, at the beginning and end of the
Head section. The Body tags are<body> and </body> at the beginning and end of the
Body section. The Head is where you can put your page title using <title> and </title> as
your opening and closing tags. This title does not appear on your web page. It must be
very descriptive of your page because search engines use it to categorize your page.
We will discuss other things that go in the head later but nothing in the head appears on
your web page. Every thing that appears on your web page is enclosed between the
opening and closing body tags <body> and </body>. Let's look at the HTML for a simple
web page.
A Simple Web Page
<html>
<head>
<title>A Simple Web Page</title>
</head>
<body>
<p>This is my first web page.</p>
</body>
</html>

The only thing that will appear on the web from the above HTML is:

This is my first web page.

This is the only thing that is enclosed by the Body tags. Notice the paragraph tag <p>.
This is the tag that tells the web that this is a paragraph. I've used a closing tag </p> but
this is one of the few tags that doesn't need one, but it is allowed. Every tag in the above
example is a
container tag. Notice how the title does not appear on your web page but
the search engine will use it to catalog your page so it must be relevant  Notice how the
whole page is enclosed by the HTML tags with <html> at the top and </html> at the
bottom of your page. By the way, I could put the all the HTML on a single line and it
would still work. I gave each part it's own line to make it easier to look at an understand.
Let's look at some Head and Body tags.
Head Html Tags
We will tackle the head first because it has fewer tags. We learned how nothing in the
head actually appears on you web page. The only tag that has to be in the head is the
Title tag. You need to use the opening <title> tag before your title and the closing </title>
tag after your title. Your title needs to describe what is on the page because it is what
search engines use to catalog your page. When your title is descriptive, someone
searching for the type of information that is on your page is more likely to find your page.
If a visitor adds your page to their favorites, it is your page title that will be in their
favorites list. A descriptive title will jog their memory as to what your page is about so
they are more likely to go back to it. Another important  Head tag is the Meta tag. Unlike
the title tag, the Meta tag only uses an opening tag. Notice how everything is contained
within that tag. Notice how we use quotation marks, equal signs and commas in the Meta
tag. The Meta tag must have a content label. It can be used to hold different kinds of
content. The Meta tag helps search engines to catalog your page. The most important
Meta tag is a key word list describing what is on your page. Another Meta tag can name
the author of the page. Below is the Head for this page with a Title tag and both these
Meta tags. The Meta tag has a lot in it but it is still considered an
empty tag, as it has no
closing tag. Any tag that does not have a closing tag to make it a
container tag is an
empty tag.

<head>
<title>Building Your Own Web Site</title>
<meta name="keywords" content="html, learning html, website construction, website
editors, publishing websites ">
<meta name="author" content="Tony Moschetti">
</head>
Body Html Tags
The body can contain many different types of html tags. Here are a few types. There a
html tags for inserting pictures. There are html tags for inserting music. There are html
tags for inserting lines. There are html tags for adding color. There are html tags for
making tables. One of the most important kinds of html tags are the ones for creating
links. We will look at those below.  We will also look at one of the other most important
type of html tags, text tags. Both types of tags will be container tags. The body can also
contain empty tags. One example is the tag for drawing a horizontal line. It is simply <hr>
with no closing tag. I can't cover them all in this limited space. You need a good book on
HTML. We will try to cover a few of the main ones.
Text Html Tags
When you write text with a text editor, you can format your text. You can indent, use
tabs, spaces, returns and so on and that formatting will stay. But with HTML none of
that formating means anything. A web browser will format your text based on the HTML
tags alone. None of the text formating you use will show up on your web site. We saw
the first text tag <p>, that tells the web browser that what you wrote is a paragraph.
Where the line wrap occurs, that is where the next line begins, depends on the size of
your window. You can get more control over formatting but it takes additional html tags
to do it. Now lets look at some other text tags. From now on I'll only show the opening
tag in discussion as the closing tag is the same except for the backslash. On this web
page I have a heading for each paragraph. The tag for a heading is <h1>, <h2>, <h3>
and so on. The bigger the number the smaller the heading. You would probably use
<h1> for your page title and <h2> for your paragraph subtitles. The default alignment
for a heading is on the left. If you want to center your title or for some reason align it to
the right, you need to add to your heading tag. Use <h1 align=center> to center your
main page title or <h2 align=right> to align it to the right. If you want it on the left <h2>
is the default. There are all kinds of additional text tags which would take a chapter or
more to cover. I may get to some of them eventually but I recommend that you buy a
good book on the subject to learn everything you can.  To see a pages resulting from
the html I've discussed so far go to my
htlml web page example 1.  I give you hyper text
link to get back to this page and the "Your Own Website" home page. Below I have a
discussion of the hyperlink, with a the link again to view the Simple Web page, and also
all the html for the Simple Web Page in a readable format.
Hyperlinks
The thing that makes web pages a unique form of communicating knowledge are
hyperlinks. Using these links, the page author can give you the opportunity to jump to a
different place on the page, a different page on their website or any other website
available on the web. The form for a link in html is <a href="url">the link text</a>. If you
are going to a different website then you need the complete URL or web address. A
link to come to my website and the "Your Own Website" page from another would look
like this in html:

<a href="www.tonyknows.com/websites.html">Your Own Website</a>

What would appear on the web page would be the text "Your own Website" in whatever
the link color was. If I was simply linking back to the "your Own Website" page from
another page on my site, I would just use:

<href="websites.html">Your Own Website</a>

Since the page file is on my  website I don't need the whole address. Now you can go
to my
html web page example1 to check all this out. I've given examples for every thing
I've discussed so far.
©2006 - 2009
Essential HTML