What's the <dl> tag for?

Question

Is there any logical reason for using the <dl>, <dt> and <dd> tags instead of nested, CSS-styled <ul> and <ol> tags? Or are they just an outdated group of tags waiting to be deprecated?

Answer 1

Citing the W3C spec:

The dl element represents an association list consisting of zero or more name-value groups (a description list). Each group must consist of one or more names (dt elements) followed by one or more values (dd elements). Within a single dl element, there should not be more than one dt element for each name.

So the main reason for the <dl>, <dt> and <dd> tags are to preserve the semantic connection for those name-value pairs, which would get lost, if you just used nested lists.

If you use nested lists, this could be done for various reasons (currently, e.g., many menus are structured into nested lists) and crawlers or any other system, that respects semantic annotations, would not be able to tell the difference.

If you use the above tags, however, a system can see the connection and act accordingly. So a future use maybe to extract all definitions of terms inside a larger document to create some kind of glossary.

Answer 2

DL

A definition list is the container element for DT and DD elements. The DL element should be used when you want incorporate a definition of a term in your document, it is often used in glossaries to define many terms, it is also used in “normal” documents when the author wishes to explain a term in a more detail (Like this definition).

DT

The term currently being defined in the definition list. This element contains inline data.

DD

The definition description element contains data that describes a definition term. This data may be either inline, or it may be block level.