Using description lists

ID: H40

Technology: html

Type: Technique

When to Use

HTML

Description

The objective of this technique is to provide the description of names or terms by presenting them in a description list. The list is marked up using the dl element. Within the list, each term is put in a separate dt element, and its description goes in the dd element directly following it. Multiple terms can be associated with a single description, as can a single term with multiple descriptions, provided that semantic sequence is maintained. The title attribute can be used to provide additional information about the description list. Usage of description lists ensures that terms and their descriptions are semantically related even as presentation format changes, as well as ensuring that these terms and descriptions are semantically grouped as a unit.

Description lists are easiest to use when the descriptions are ordered alphabetically. A common use for description lists is a glossary of terms.

Examples

A list of descriptions of nautical terms used on a Website about sailing.

<dl title="Nautical Terms">
  <dt>Knot</dt>
  <dd>
    A <i>knot</i> is a unit of speed equaling 1 
    nautical mile per hour (1.15 miles per hour or 1.852 
    kilometers per hour).
  </dd>
  <dt>Port</dt>
  <dd>
    <i>Port</i> is the nautical term (used on 
    boats and ships) that refers to the left side
    of a ship, as perceived by a person facing towards 
    the bow (the front of the vessel).
  </dd>
  <dt>Starboard</dt>
  <dd>
    <i>Starboard</i> is the nautical term (used 
    on boats and ships) that refers to the right 
    side of a vessel, as perceived by a person 
    facing towards the bow (the front of the vessel).
  </dd>
</dl>

Tests

Procedure

For any set of terms and their associated descriptions:

  1. Check that the list is contained within a dl element.
  2. Check that each term in the list being described is contained within a dt element.
  3. Check that when there is more than one term that shares the same description that the dt elements immediately follow each other.
  4. Check that the description for each term is contained in one or more dd elements.
  5. Check that the one or more dd elements immediately follow the one or more dt elements containing the term being described.

Expected Results

Resources