Técnica HTML WCAG 2.2

H40Usar listas de descripción

En resumen

Esta técnica indica cómo marcar glosarios y pares término-descripción con los elementos dl, dt y dd, de modo que la relación entre cada término y su descripción quede definida en el código y no solo en la apariencia visual. Beneficia a quienes usan lectores de pantalla u hojas de estilo propias, porque la agrupación se conserva aunque cambie la presentación. Úsela en glosarios y listas de términos.

Aplicabilidad

HTML

Descripción

El objetivo de esta técnica es proporcionar la descripción de nombres o términos presentándolos en una lista de descripción. La lista se marca con el elemento dl. Dentro de la lista, cada término se coloca en un elemento dt independiente y su descripción va en el elemento dd que le sigue inmediatamente. Se pueden asociar varios términos a una sola descripción, así como un solo término a varias descripciones, siempre que se mantenga la secuencia semántica. El atributo title puede usarse para proporcionar información adicional sobre la lista de descripción. El uso de listas de descripción garantiza que los términos y sus descripciones estén relacionados semánticamente aunque cambie el formato de presentación, además de garantizar que dichos términos y descripciones queden agrupados semánticamente como una unidad.

Las listas de descripción son más fáciles de usar cuando las descripciones están ordenadas alfabéticamente. Un uso habitual de las listas de descripción es el glosario de términos.

Ejemplos

Una lista de descripciones de términos náuticos usados en un sitio web sobre navegación a vela.

<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>

Pruebas

Procedimiento

Para cualquier conjunto de términos y sus descripciones asociadas:

Comprobar que la lista está contenida en un elemento dl.
Comprobar que cada término descrito en la lista está contenido en un elemento dt.
Comprobar que, cuando hay más de un término que comparte la misma descripción, los elementos dt se suceden inmediatamente unos a otros.
Comprobar que la descripción de cada término está contenida en uno o más elementos dd.
Comprobar que el elemento o elementos dd siguen inmediatamente al elemento o elementos dt que contienen el término descrito.

Resultados esperados

Todas las comprobaciones anteriores son verdaderas.

Recursos

HTML: el elemento dl.

Cómo lo comprobamos en ADDAW

En las auditorías de accesibilidad de ADDAW revisamos cada criterio de conformidad siguiendo este catálogo de técnicas: comprobamos si la web aplica una técnica suficiente y documentamos cada fallo común con capturas y el código afectado, para que el equipo de desarrollo sepa exactamente qué corregir. Los informes siguen la metodología del Observatorio de Accesibilidad y la norma UNE-EN 301 549.

Solicitar una auditoría

Fuente y licencia

Traducción al español, no oficial, realizada por ADDAW a partir de la técnica H40 del documento «Techniques for WCAG 2.2» del W3C (versión del repositorio público del W3C a 22/10/2026). Copyright © W3C® (MIT, ERCIM, Keio, Beihang). Se publica conforme a la licencia de documentos del W3C. El texto normativo de referencia es el original en inglés; si detecta un error en la traducción, escríbanos.