How to create Web sites easily

The most complete guide for the Web page builder
All you'll ever need to know about homepages and HTML

Lists

Bulleted lists

I guess one of the first things you'll want to put in a page is a listing, maybe of the links you're interested in, probably of the things you like to eat, stuff like that. Well, there are two ways to make a bulleted list:

Create one with graphical bullets (fancy!)
Use standard HTML tags (all-browsers compatible)

Look, a lot of people prefer to use graphical bullets for lists, but I'll tell you the backdrafts: first, you need to put a graphic on the site, which usually means spending precious space on your account or disk (but not so much, about 1K in size), and second, it will be slower to load on slow connections, and probably slower to display too. But you can use them if you prefer; they really look better.

To create a list with graphical bullets, use the following syntax:

<IMG SRC="document_icon.gif">First element<br>
<IMG SRC="document_icon.gif">Second element<br>
<IMG SRC="document_icon.gif">Third element<br>

where you substitute document_icon.gif for your favorite graphic's URL. This would display as follows:

First element
Second element
Third element

Just begin the line with an IMG SRC tag and end it with a <BR> element to begin a new line without doing the extra spacing of the <P> element. I think these small documents look great as bullets. If you want to increase spacing between the bullets and the text, just insert spaces. They'll do all the job for you.

The other way to create a bulleted list is to use the proper tags for the listing. The HTML standard defined these when it wasn't so popular to include graphics. This is the way:

<UL>
<LI>First element
<LI>Second element
<LI>Third element
</UL>

The <UL> tag starts the bulleted list, the <LI> elements denote the items in the list, and the </UL> tag terminates the listing. This would look as follows:

First element
Second element
Third element

Numbered lists

The only good way to do this is to use the same code as in the bulleted list with tags syntax, but the <UL> and the </UL> tags are replaced by <OL> and </OL> (Ordered Lists) this way:

<OL<
<LI>First element
<LI>Second element
<LI>Third element
</OL>

This will produce the following output in your browser:

First element
Second element
Third element

Definition lists

A definition list is something you'll understand when you see it. Look at this:

Web browser: Program that allows the user to gain access and view the contents of the World Wide Web, one of the most important services in the Internet.
E-mail: E-mail is one of the most popular services in the Internet. It works on the same basis as real, or "snail" mail. A person sends an e-mail to another person, and that other person gets his mail.

This text would look in your editor window as follows:

<dl>
<dt>Web browser
<dd>A program that allows the user to gain
access and view the contents of the World
Wide Web, one of the most important services
in the Internet.
<dt>E-mail
<dd>E-mail is, probably, the most popular
service of the Internet.  It works on the
same basis as real, or "snail" mail. A 
person sends an e-mail to another person,
and that other person gets his mail with 
an e-mail reader program.
</dl>

The <DL> tag starts the list, a <DT> tag specifies a keyword or definition, a <DD> tag specifies the meaning of that definition, and the </DL> tag closes the definition list.

Member of the ILE

Free Home Pages at GeoCities

[Main page] [HTML help] [MIDI page] [Murphy's Laws] [More information]
[Feedback form to email me] [Sign guestbook] [Mail me!]