WCAG 1.0 Double A Checkpoint 3.6

Skip Quick Links

“Mark up lists and list items properly.”

The HTML list elements DL, UL, and OL should be used only to create lists, not for formatting effects such as indentation.

Ordered lists help non-visual users navigate. Non-visual users may "get lost" in lists, especially in nested lists and those that do not indicate the specific nest level for each list item. Until user agents provide a means to identify list context clearly (e.g., by supporting the ':before' pseudo-element in CSS2), content developers should include contextual clues in their lists.

For numbered lists, compound numbers are more informative than simple numbers. Thus, a list numbered "1, 1.1, 1.2, 1.2.1, 1.3, 2, 2.1," provides more context than the same list without compound numbers, which might be formatted as above, and would be spoken as "1, 1, 2, 1, 2, 3, 2, 1", conveying no information about list depth.


The following CSS2 style sheet shows how to specify compound numbers for nested lists created with either UL or OL elements. Items are numbered as "1", "1.1", "1.1.1", etc.

ul, ol {
	counter-reset: item;

li {
	display: block;

li:before {
	content: counters(item, ".");
	counter-increment: item;