Standardized Design Solutions - Markup Language and Style Manual
Web Standards Solutions The Markup and Style Handbook
Part 1: Get Down With Markup Start with Markup
Chapter 1 List
Lists can be found on almost every page on the web. Hyperlink lists; Shopping cart items lists; Movies you like... and even navigation lists for the entire website. It may seem to some that lists are built at will, but what we are going to explore is exactly how to build lists and the advantages and disadvantages of several common methods. Later, we will list a few examples of how to beautify a regular list episode.
Let's go shopping
Initially, I planned to use a detailed list (laundry list) as an example for this chapter, but soon I realized that I had no idea what details should be included in this list, so... for the sake of the example, let's use food as an example!
Let's imagine that you need to put a food list on your own website. You may be puzzled about why you want to put a food list on the website. This may be off topic. We just need a reason to start thinking about the list...
On the page, suppose we want the list to look like...well, it looks like a list—that is, a long list of vertical lists, with each item exclusively taking one line:
Apples
Spaghetti
Green Beans
Milk
It looks very simple, doesn't it? Similar to many aspects of page design and development, we can achieve the same (or similar) effect through many different methods. As with all the examples later in this book, I will present all examples with the viewpoint of eXtensilble HyperText Markup Language (XHTML)—and make sure the selected method uses the correct markup syntax, following the various standards set by World Wild Web Consortium (W3C).
We can easily add a <br /> tag to each project and get it done, or we can use various list project tags to complete this work. Now let’s look at 3 completely different methods and the characteristics of each method.