introduction

This document is intended to give an introduction to simple HTML as might be used in a blog, bulletin board comment, or other such web form-based posting system.

background

HTML is the language of the World Wide Web. Whenever you visit a web site, the web server responds to your request with some sort of HTML document. It sends the document to your computer and the document is interpreted by your web browser.

HTML stands for Hyper Text Markup Language. Hyper Text refers to documents with text information that contains links to other documents. A Markup Language is a simple computer language that uses "tags" to represent information.

This document will give you an introduction to writing simple HTML that can be included in web message boards, web logs/journals, and other existing form-based web posting systems. This document is not intended to be a comprehensive guide to HTML or tell you how to write a web page from scratch. It is simply a quick reference to common tags.

text formatting

Similar to a word processor, HTML has several different types of text formatting, such as bold, italics, underline, and strikethrough. To make your text appear in these styles, use the following HTML:

<b>this text will appear bold.</b>
<i>this text will appear italic.</i>
<u>this text will appear underlined.</u>

The HTML above will look this way when rendered by a browser:

links

To create a hyperlink, use the following format:

<a href="Address">Link Text</a>

Where Address is either a URL, such as "http://www.clemson.edu/", or a directory or file on the server, such as "/gallery/albums.php". Link Text is the text that will appear as a hyperlink in your document. Examples:

<a href="http://www.clemson.edu/">Clemson University</a>
<a href="/gallery/albums.php">This site's gallery</a>

Produces:

images

To insert an image in an HTML document, use the following format:

<img src="Address">

Where Address is either a URL, such as "http://www.clemson.edu/homepage/wordmark.jpg", or a directory or file on the server, such as "/layout/CSCC-orangewhite/images/cscc_logo.png". Examples:

<img src="http://www.clemson.edu/homepage/wordmark.jpg">
<img src="/layout/CSCC-orangewhite/images/cscc_logo.png">

Produces:

line breaks and paragraphs

HTML ignores carriage returns. This means that even if you press enter it doesn't go to the next line. To force a line break, use the br tag:

this is the first line<br>
this is the second line<br><br>
this is the fourth line

This produces:

Paragraphs are a bit different. This code:

<p>paragraph 1</p>
<p>paragraph 2</p>
<p>paragraph 3</p>

produces:

paragraph 1

paragraph 2

paragraph 3

headings and fonts

Headings are different preset font sizes. They are handy for making a quick title without having to mess with the font tag.

<h1>heading 1</h1>
<h2>heading 2</h2>
<h3>heading 3</h3>
<h4>heading 4</h4>

The HTML above will look this way when rendered by a browser:

heading 1

heading 2

heading 3

heading 4

Last Updated Saturday, September 25 2004 @ 01:36 PM EDT