Russ Weakley
01-Dec-04, revised 06-Dec-04

I received an interesting anonymous comment via Listamatic the other day:

A little sceptical about the list as menu argument. Especially the part where you argue that it doesnt limit the designer. Of course it does. If you have anything different than a "list" it simply wont do. Say you have a TV Remote control that you want to make it your navigation bar. Do THAT with CSS. In some cases you just can't go without Flash or Javascript.

Anonymous comment via Listamatic feedback form

It is entirely possible to create a basic TV Remote Control or a slightly more advanced TV Remote Control using lists and CSS, but more on that later...

"A little sceptical about the list as menu..."

Are lists the best option for site menus? The finer details of semantic markup come down to personal opinion. While there are no absolute answers, there are definitely options that are more semantically correct than others.

If you strip a menu of all presentation, it is simply a list of links that point to other pages within or outside the site.

A list of links is best marked up using list elements. Lists have meaning in a wide variety of devices including screen readers, text-browsers, browser that do not support CSS, browsers with CSS switched off and browsers that support CSS.

"In some cases you just can't go without Flash or Javascript"

Generally speaking, Javscript or flash-based menus will not work as well across a variety of devices. What happens if a user has a modern browser but no Flash player installed, or they sit behind a fire wall that blocks Flash? Is it acceptable that an entire site menu fails for these users?

There are also accessibility problems with Flash and Javascript options. Can you guarantee that the Flash component will scale for users with vision impairment, or work for screen readers?

"You argue that it doesnt limit the designer. Of course it does. If you have anything different than a "list" it simply wont do..."

Are there any limitations? Theoretically, a list is just a series of elements. From a CSS point of view, each of these elements is just a box that can be styled to suit your needs.

For example, you can style lists to look quite different from the average list:

ProjectSeven's Uberlist
ZDnet Emulation
Folder images
An amazing round cornered construction
A tabbed interface
Having said that, they all still look like lists. But there are some more diverse examples available:

A touchpad

A double rollover photo gallery
Thirty Two (the "Focus on the fit" section)
A completely pointless list-based page layout
Day of the Image List
And finally, of course, the previously mentioned TV Remote Control.

If you take off the presentation layer in each of these cases, you will see that all of them are based on a humble list.

What do you think?
Can web designers and developers "go without Flash or Javascript" and use styled lists to create interesting or attractive menus?