Simon Willison’s Weblog

Zeldman and definition lists

5th February 2003

I’m really liking Jeffrey Zeldman’s latest redesign. Aside from a pretty face, the markup holds some interesting ideas as well. For example, I’ve never seen a definition list used for a blogroll style list before:

<dl id="outside2" style="display:none;">
<dt>Relevant Externals:</dt>
<dd><a href="http://www.20things.org/" target="eljefe" 
  title="20 people make 20 things in 20 days.">20 things</a></dd>
<dd><a href="http://www.alistapart.com/stories/indexAccessibility.html" target="eljefe" 
  title="Accessibility articles and tutorials at A List Apart.">Access @ ALA</a></dd>
<dd><a href="http://www.gregstorey.com/airbag/" target="eljefe" 
  title="Greg Storey&#8217;s beautiful personal periodical.">Airbag</a></dd>
...

It makes sense in that “Relevant Externals” is a definition of the following list of defined terms. The official specification for definition lists is notoriously vague in any case:

Definition lists vary only slightly from other types of lists in that list items consist of two parts: a term and a description. The term is given by the DT element and is restricted to inline content. The description is given with a DD element that contains block-level content.

[...]

Another application of DL, for example, is for marking up dialogues, with each DT naming a speaker, and each DD containing his or her words.