Using Lists in a Web Page
Module 12


Now we will add lists of information.  While HTML is basically limited in how information is presented, two common ways to list information are available.  There are two basic types of lists- ordered and unordered.

Ordered lists, by their name, imply that the items in the list are in some sort of order or sequence. An Ordered List is also called a Numbered List.
 

1.  If it is not already open, open Page2 from your WebProject folder.  Go to FILE>Edit Page.

2.  Click at the end of the information already in the page and type the following (aligned to the left, if necessary)
  

Here is what I've learned
Entering Text
Inserting Images
Linking to a second page
External Links
Mail Links
Since this is a list of the topics we've worked on, and they are the order in which they were presented, this information is appropriate for a numbered list.
 

3.  Now select (highlight) the last 5 lines (from Entering to ...Mail Links)
4.  Now click the Numbered List button in the Toolbar.

5.  SAVE the page and preview it.

Notice that the "#" characters are replaced by appropriate numbers when the page is seen in the Browser.  You do not have much choice of how the numbers are positioned, but for a short, quick numeric list, this approach may be appropriate.

The other type of list is an Unordered List (also called a Bulleted List)
 

6.  Return to Editing mode by FILE>Edit Page.

7.  At the bottom of the page, type the following
  

These are some things I've learned
8.  Now select (highlight) the last four lines.

9.  Click the Numbered List button  and notice the screen.

10.  SAVE your Page2 and Preview your page.

The bullets that are shown are basic bullets and you have little choice of positioning, size, or color, but for a quick list of items without order, the Bulleted List may be appropriate.

Should you later change your mind and want the information to be "normal" again, you can select the list, click the List Item button  in the Toolbar and change the Paragraph Style back to Normal.
 

If you want, you may Quit at this time or continue on to the next module
Composer Module Home  | DSISD Home | Next Module