This is a level-1 heading

(Last change: 4 September 2005.)

This document is a more or less self-documenting sample HTML file. It mostly uses just a few tags: h1, h2, p, a, hr, and the standard html, head, and body tags (which you can put in a template and then never modify again).

You won't be able to make much sense out of this page by viewing it in a browser. Instead, save it as a text file (with filename ending in .html) and then look at it in a text editor to see the tags and comments. Then open the saved file in a browser to view it. This document doesn't tell you how to post the page to a website; that's a whole big topic of its own.

A note about file names: you should end your filenames with .html, to make sure browsers will recognize them as HTML files. And it's standard to name your main page index.html.

This is a paragraph of body text. Always put p and /p tags around every paragraph. Without those tags, the browser will just run the paragraphs together, ignoring the blank lines.

This is a level-2 heading

You can have as many headings of each level as you want, but it's good form to structure your document well -- for example, an h3 should be a subhead in a section that starts with an h2.

Note that you can delete anything in this file that's not a tag, and you can delete most of the tags too. Also note that line breaks and blank lines are ignored by browsers, and are thus only present in the file to improve readability for humans who are looking at the HTML code.

You can format your text using tags like emphasis, citation (for book titles and such), strong emphasis, italics, and boldface. (HTML purists like me generally recommend avoiding the i and b tags where possible, but I won't get into that here.)

The next paragraph shows how to use the most powerful thing in HTML: hypertext links. The a and /a tags set off some text (known as "link text" or "anchor text") which will be marked (when displayed by a browser) as a link -- usually blue text and/or underlined. The "href" part tells the browser where to jump to if the visitor clicks there.

This is a link to Jed's home page; change the URL and the link text to create other links.

There are other kinds of links, too, such as "mailto". If you click the following link, you'll send email to me: logos@kith.org.

The hr tag indicates a horizontal rule (a line across the page). You can set its width if you want. Since the tag doesn't enclose any text, you close it by just putting a slash before the closing angle bracket.

You'll probably want images on your page. Here's the basic idea of how to include one:

Use the img tag to specify an image; the "src" part tells it where to find the image. (You should only use images that are on your local disk; it's bad form to include images that are being served from someone else's server without their permission.) "alt" is the text to display if the user has image-loading turned off, or if the user is blind.

• This part of the document is in case you want to include an "unordered" (bulleted) list in your page.
• Each list item should have an opening li tag and a closing /li tag.
• If you don't want your page to contain a bulleted list, delete the ul and the /ul and everything in between.
• There are other kinds of lists as well, such as ordered lists (ol), which automatically number their list-items sequentially. Ordered list items use li tags just like unordered list items.
• Also "descriptive lists" (dl), which use pairs of "descriptive term" (dt) and "descriptive definition" (dd) tags.

Okay, that's all. There's plenty more to know about HTML, but this should do for a start. Good luck!