HTML Rules!

Now you should understand the basics of what a web page is. It is a text file with markup language which can be rendered by a browser to show media with advanced layout and design. A web page can be found in a web site, which is just a folder on a computer (called a "web server") at a web host. The web host's computer is connected to the Internet using an external IP Address which is connected to a domain name that you own. If someone types the domain name, it is translated into the IP Address, they find the web server, connect to the web site in your domain, and download the web page and associated files to view on their browser.

If the above paragraph does not make sense to you, then I suggest that you go back and re-read the previous four chapters in this unit.

No, No… I Understand. Keep Going.

Good! Okay, you should also know that a web page, being a text file, can be created using any simple text editing program. As it happens, I can give you something even better: below this paragraph is a Live HTML Editing Panel--I'll call them "Live HTML Exercise" areas. In the panel, you'll see two areas" on top, a light blue area which has HTML code. Below, a blank area which shows the HTML as rendered by a browser. When you type something, it immediately appears in the rendering area! Go ahead, type something into the light blue are on top, and see what happens below:

Note that if you refresh this web page (by hitting the "F5" key in Windows, or "Command-R" in Mac OS X), the live exercise window goes back to the original text, and the changes you made disappear.

We will be using the Live HTML Exercise throughout the rest of this unit.

Commands, Tags

The first thing you should learn is the HTML command, also called an HTML tag. It's what I was talking about earlier when I mentioned "markup" language. An HTML tag is essentially a command to the browser, telling it to do something, like make text bold or insert an image into the page.

Command = Tag

HTML tags are easy to make. Just put any HTML tag inside angle brackets, such as: <strong>

Tags are always in angled brackets < >

When the browser sees the brackets, it knows that what is inside is a command.

Any text in angled brackets < > is a command (tag);
Any text not in brackets will appear as text on the web page.

HTML commands are "case insensitive," meaning that they will work if they are in UPPERCASE or in lowercase. However, lowercase is considered good style.

What Do HTML Tags Do?

HTML tags tell the browser what to do. The <title> tag tells the browser what name to put into the title bar. The <br> tag tells the browser to go down one line. The <blockquote> tag tells the browser to indent by 1/2 inch. The <img> tag tells the browser to find a picture file and put it on the web page in a certain location. The <a> tag tells the browser to make a link to another page.

There are many, many HTML tags, but you only need to remember a few dozen to make a good web page.

How Do I Type an HTML Tag?

There are two kinds of tags:

  • most tags have two parts: a beginning and an ending; everything between the two tags is affected by the command.
  • a few tags have only one part. These commands do things in one specific location; they do not 'start' or 'end.'

For example, let's say that you want to make some bold text. The command is simple: <b>

However, bold text always begins at one point and ends at another point. So there must be an ending tag, which is the same as the beginning tag, except it has a back-slash before the command--for example: </b> If you forget the ending tag, then the change you made will continue until the end of the web page, and could cause other problems.

Therefore, in a web page, if you type:

You should <b>have fun</b> with computers.

It will appear like this in a browser:

You should have fun with computers.

Here, you can try it yourself, in another...

One More Thing

Remember I said above that some HTML commands have no ending tag. When you write a tag with no ending command, the tag should include a space and then a slash ( / ) at the and of the command. For example, the <br> tag, which creates a line break (like hitting the "Enter" key) has no ending tag; therefore, one should write it like this: <br />

This follows the rules of something called XHTML, which can be considered a cleaner and more strict version of HTML. HTML is fairly forgiving of shortcuts, abbreviations, and mistakes; XHTML is not, requiring the markup to be well-formed.

While most browsers (or possibly all of them) will not show an error if you don't follow the more strict XHTML rules, it's a good idea to do so anyway.



Video Review