Introduction to HTML
HTML, or HyperText Markup Language, is the standard set of codes used on the Internet to design and view World Wide Web pages. HTML documents are basically text documents (also known as ASCII documents) which can be typed up on a word processor, or plugged in automatically using an HTML editor such as BBEdit or Pagemill. What makes HTML documents functional, however, are the codes that are inserted throughout the text, which in turn tell a computer's web browsing software how the document should appear and behave on the screen.
Here is a basic example of HTML:
<HTML><HEAD>
<TITLE>GWMS Home Page</TITLE>
<H1>The George Washington Middle School Home Page</H1>
</HEAD>
<body>
Welcome to George Washington Middle School!
This site is still under construction, but if you'd like,
you can look at the <A HREF="paper.html">school newspaper</A>,
see the weekly <A HREF="lunch.html">lunch menu</A> or browse through the
<A HREF="project.html">Civil War Project</A>, written and designed by
<A HREF="putnam.html">Mrs. Putnam's American History Class</a>.
<P></body> </html>
This mess of coded text looks like the following when viewed with a web browser:
The George Washington Middle School Home Page
Welcome to George Washington Middle School! This site is still under construction, but if you'd like, you can look at the school newspaper, see the weekly lunch menu or browse through the Civil War Project, written and designed by Mrs. Putnam's American History Class.
HTML uses what are known as markup tags (also just referred to as tags) to let a Web browser like Netscape know how to display the document. Tags are always surrounded by brackets (< and >). For example, the
<TITLE>tag specifies the title of a document. (Note: HTML is not case sensitive, so you could also use<title>instead of<TITLE>.) You can see a title tag in action at the very top of this web page's window, where it says Crash Course - Introduction.In order for your web browser to recognize the end of a given title, it needs a corresponding close tag - which in this case is
</TITLE>- directly following the actual title of your web page. Notice how this</TITLE>tag includes a slash (/) before the word TITLE. In HTML, slashes are always used to connote the end of a command. So, if you look through the George Washington Middle School example, you'll see that nearly every type of tag has a corresponding close tag which includes the slash. Without these corresponding tags, your browser would never known when a given HTML command is complete. The only kind of tag you'll see in our example that does not have a corresponding close tag is the paragraph tag, which appears as<P>. The<P>tag is used to signify the end of a paragraph, so only one tag is needed, directly following a paragrah of text.
Essential HTML Tags
At the top of any HTML document, you're bound to find three tags,
<HTML>,<HEAD>and<BODY>. The purpose of the HTML tag is to tell the web browsing software that the document it's looking at is indeed an HTML page. Be sure to place<HTML>at the top of every HTML page you create. And don't forget to place a</HTML>tag at the bottom of every document.Similarly, the head tag and the body tag help out the web browser in interpreting the HTML.
<HEAD>is used to tell the browser what part of the document is the top section, or the head. The rest of the document is known as the body, and therefore, it gets designated with a<BODY>tag. So, the head of our above example would be
<HTML><HEAD>
<TITLE>GWMS Home Page</TITLE>
<H1>The George Washington Middle School Home Page</H1>
</HEAD>
while the body of the document is
<body>Welcome to George Washington Middle School!
This site is still under construction, but if you'd like,
you can look at the <A HREF="paper.html">school newspaper</A>,
see the weekly <A HREF="lunch.html">lunch menu</A> or browse through the
<A HREF="project.html">Civil War Project</A>, written and designed by
<A HREF="putnam.html">Mrs. Putnam's American History Class</a>.
<P></body> </html>
In both cases,
</HEAD>and</BODY>tags are used at the end of their sections to explain to the web browser when each particular section is complete.The use of
<HTML>,<HEAD>, and<BODY>tags may seem like a waste of your time, but many web browsers will have a hard time interpreting the HTML code without them. So, be sure to get into the habit of using them.As for the other tags used within our example here, they'll all be explained throughout the rest of the Crash Course.
Or, Return to the Crash Course Index
