Table of Contents
2. Basic Concepts
The tools you need
Fortunately, HTML is written in plain text. That means you dont need any fancy
software programs like a word processor to create your HTML files. All you need is a
simple text-editor thats already on your system. For MACs, that would be SimpleText and for Windows, Notepad.
As with most things in life, there are rules. In HTML, the rules are fairly simple. For
starters, HTML tags are always surrounded by what are called angle brackets <
and >. Youll find these brackets on your keyboard just above the comma and
The words/letters between these two angle brackets are called elements. These are the coded commands within HTML.
Elements tell the browser how to display the web page. For example: <hr> tells the
browser to display a horizontal rule; <br> tells the browser to skip a line.
Container and empty tags
There are two kinds of tags: container and empty.
The container tag always wraps around text or
graphics and comes in
a set with an opening and a closing:
<html> opening tag
</html> closing tag
Notice the forward slash
(/) on the closing tag. This tells the browser that the tag has ended.
On the other hand, the empty tag stands alone. The tag <br> is one that adds a line break. Empty tags do not have to be wrapped around copy
and do not require a closing.
HTML is also not case sensitive. That means, you can
use either lowercase or uppercase. <HTML> is the same as <html>.
For consistency, use either one or the other. It's best not to mix and
match. For our purposes, I have written our code in lowercase.
All HTML documents are divided into two main parts: the head and the body. It goes
something like this:
must have the <html>, <head> and <body> container tags in every HTML
The <html> tag tells the browser
that this is an HTML document.
You must begin and end your files with this tag. The <head>
tag contains general information like the title of your document. The <body>
tag holds all your content: words, pictures, artwork and
Part of the web page structure is called nesting. Notice how the tag <title> is
nested inside the <head> tag, while <head> and <body> are nested inside
Each new set of tags are
nested inside other tags, just like those Russian dolls, Matryoshka. Think of it another
way, like smaller boxes inside larger boxes.
to Chapter 3: Primary Tags