One of the easiest ways to add some organization to your blog posts is to use a list. People like lists and they can help you make your points in a post or on your website clearly and quickly. In HTML there are three types of lists:

• Ordered lists.
• Unordered lists.
• Definition lists.

For this post I will only look at ordered and unordered lists because those are the two most common types of lists. Definiation lists are useful as well and I will talk about them at a latter date.

Ordered Lists

An ordered list shows the list items starting with a number in front. A basic ordered list starts with the <ol> tag and each item in the list starts with the <li> tag. At the end of each list item you should close the <li> tag with a </li> tag and when you are done your ordered list close the list with a closing </ol> tag. A basic ordered list looks like this:
<ol>
<li>Item one.</li>
<li>Item two.</li>
<li>Item three.</li>
</ol>

and it would be rendered like this:

1. Item one.
2. Item two.
3. Item three.

Unordered Lists

An unordered list shows the list items starting with a bullet point in front. A basic unordered list starts with the <ul> tag and each item in the list starts with the <li> tag. At the end of each list item you should close the <li> tag with a </li> tag and when you are done your unordered list close the list with a closing </ul> tag. A basic unordered list looks like this:
<ul>
<li>Item one.</li>
<li>Item two.</li>
<li>Item three.</li>
</ul>

and it would be rendered like this:

• Item one.
• Item two.
• Item three.

That is the basics of ordered and unordered lists in HTML. Lists are very flexible in HTML and can do some amazing things when combined with the correct styles in a cascading style sheet. For example the current main menu at the top of the site is actually an unordered list that is styled to display as a menu. The sidebar items are unordered list items styled without a bullet.

Similar Posts:

• CSS List Menu Resources
• Two More Things Any Web Developer Worth Their Spit Should Know
• Tweet from Google Reader
• Blogger Label List for FTP Published Blogs
• Blog Marketing off the Internet
• Over 10,000 Free Shapes for your Photoshop
• Basic HTML – Links
• Include, Include_once, Require, Require_once
• WYSIWYG WordPress Theme Generator
• DealDotCom – Woot for Webmasters