XHTML Class Guide and Reference
Make your own web pages

Basic Web Page Requirements

Say it's HTML or XHTML

First a webpage has to tell the browser that it is a web page. It does this with the <html> tag. For backwards compatibility XHTML also uses the <html> tag, but puts a Document Type Definition (DTD) tag before it for the use of those browsers that can understand them.

The page ends with a </html> tag. Everything else, except the DTD if one is used, is placed between the <html> and </html> tags.

A webpage has one head followed by one body just like you.

Head

The head starts with a <head> tag and ends with a </head> tag.

The head contains information about the page that does not show up in the main browser window. Although you don't see this information in the main window it is important. It helps people find and return to your site.

The <title> is the only piece of information in the head that this page deals with. You will meet the others later.

By now you probably have guessed that the title begins with <title> and ends with </title>.

The text between the <title> and </title> tags is:

  • What it says on the top title bar of the browser.
  • What is listed on the "Back" button's dropdown menu.
  • What shows up on the bookmark list of anyone who bookmarks this page.
  • The title of your page in a search engine listing.
  • Search engines look at your page titles when deciding what your page is about.

Don't try to add any extra formatting tags to the title. They won't work there.

This title will NOT show up in the body of your page. For those titles see the information on heading (<h#>) tags.

Body

The body starts with a <body> tag and ends with a </body> tag.

Every web page needs one and only one body. Never put more than one <body> tag in a page.

All of the text and pictures that you want people to see in the browser window go in between the <body> tag and the </body> tag.

The browser will condense all "whitespace" characters - blanks, line breaks, skipped lines down to one space. It will automatically wrap text when it reaches the edge of the window. You can tell it to make new lines and paragraphs where you want it to, or to insert other spaces. The tags that do these things are covered in other sections of this site.