Home > Tutorials > HTML > The BIG Ones

The BIG Ones

Okay, so you want to learn how to make a webpage? Let's start with the basics - the elements (also known as "tags").

A webpage holds information, all held within HTML tags. Tags let the browser know how to display all of this information. Tags are of the form <tag name>, closed in the form </tag name>, and each one has a specific function. Here are the really important ones which you will be using on just about every page:

Document Type Definition
As the standard for web pages is now XHTML, our pages need to be able to be parsed by not just browsers, but XML parsers, as well. The DTD is the first thing in an HTML file, and essentially tells whoever is reading the file what they're looking at. There are 3 DTDs which can be used for web pages:
  • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    With this definition, we are saying that we are using purely semantic HTML tags, and no presentational tags. Presentational tags are deprecated, so they are not guaranteed to be supported on every browser. This tutorial does not teach any of the presentational tags.
  • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    With this definition, we are telling the browser that there will be some presentational tags - but since you will be learning CSS as well, you won't ever need to use this, will you? :)
  • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    This definition says we will be using frames. Frames are deprecated as well, so once again - you don't have to worry about this one.
<html>
This signifies the start of a bunch of html code. Without it, you don't have a webpage. The html tag is placed immediately after the DTD. For your XHTML page to validate correctly, you will need to set the xmlns, or XML Namespace, attribute. This is similar to the DOCTYPE declaration, but much simpler. Just set it to "http://w3.org/1999/xhtml".
<head>
This contains information about the webpage - things such as the type of information on the page, a summary of the page, links to other files which will help display the page, the title of the page, and some other fun stuff as well. We'll get to this part later on in the tutorial.
<body>
Everything that the user sees (as well as some tags to let the browser know what is being displayed) is contained here.

The above three are the most important tags a webpage can have. With these, we can create a web page of our own...so why don't we?!

Excercise: Open up Dreamweaver (or, if you don't have it, notepad will do), and make a new file titled "MyFirstPage.html". Using what you now know, create a webpage that displays the phrase "Hello, World!". Be sure to include a DTD, as well as the html, head, and body tags. Remember, each tag needs to be closed!

If your code looks like mine, you've succeeded, and can go on to another lesson.

Next>>

Comment on this page:

Your information Name:
Email:
Hide Email?
Enter the 5 characters shown.
Request another image.
Prove your human:
Comments Overall page rating:

Comments

No one has commented on this lesson yet. You can be the first!