The HEAD Lines You can't see the first lines of HTML on this page, but they are very important. Here they are made visible:
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
- This line informs webpage analyzing tools (like those in some search engines) that your page is indeed public, and which generation of HTML standards it follows. For more about this line, see Search Engine Watch.
- <HTML>
- This line informs the browsers that this is an HTML file. Some browsers can figure that out for themselves, but itis best to be on the safe side. (This is also why you add ".html" at the end of a file name.)
- <HEAD>
- This starts the HEAD portion of the file.
- <TITLE>StreetWrites Webpage Writing Workshop</TITLE>
- This puts a title in the title bar of the web browser. It is not only good style and rather fun, but the words in the title are the ones weighted most heavily by most search engines. In some search engines and link lists the title is ALL that a surfer is going to see. So it is important to make this as informative as possible.
Weak: "John's Home Page"
Strong: "John Marchand's Books, Cats & Trains: Music by John Coltrane"
Or: "Gerbil Breeding, Care & Training: Dealerships Available"
- <META name="description" content="Replace this by a description of your webpage. Use about 50-60 words, and be as specific as possible about why someone would want to visit your page. This is the description that will be listed by most search engines.">
- <META name="keywords" content="Replace this by about 50-60 keywords that someone searching for the information on your page might enter into a search engine.">
- For more information about META tags, see Search Engine Watch.
- </HEAD>
- This is the end of the HEAD portion of the file.
- <BODY BGCOLOR="#FFFFFF" BACKGROUND="images/orcabgb.gif" TEXT="#000033" link="#000099" vlink="#990099">
- This begins the BODY portion of the file: the description of the items that will display on your page. This includes specifying the background color, a background graphic (if any), and the text and link colors. You may choose to go with the defaults on some of these, but even if you are using a background graphic it's a good idea to specify the background color. Some viewers browse with images turned off. Others have older browsers that will not respond to some commands, like specifying the border color of tables: so the border color of your tables will be the page background color, on those older browsers.
- Next comes a line that forces the rest of the page to be slightly indented, to leave that pretty left-hand margin clear.
- <DL><DD>
- Some HTML validators will yell at you for this: -- you aren't supposed to use <DL> except to set off a definition list ( <DT> and <DD> lines ). But tables or invisible graphics, the other methods of indenting a page, slow down loading. So until the HTMl validators come up with an indent command that I can use validly ... phbbbttt.
Exercise:
If you choose to do this as a workshop, write the first portion of your webpage, up to the BODY tag, and post it to webwriter@yahoogroups.com
Webpage Workshop Main Page
Anitra's Design Page
Anitra's Home Page