Listas xhtml
Para que una lista de ítems cumpla su funcionalidad semántica la W3C recomienda usar unos tipos de listas y desaconseja el uso de otras, en seguida vamos a ver como crear listas semánticamente correctas en xhtml strict.
Listas de definiciones:
Muchas veces tenemos que listar elementos compuestos por un título y un párrafo, pero que en realidad no dejan de ser una lista, ejemplo:
- Elemento 1:descripción de la lista descripción de la lista descripción de la lista descripción de la lista descripción de la lista descripción de la lista descripción de la lista
- Elemento 2:descripción de la lista descripción de la lista descripción de la lista descripción de la lista descripción de la lista descripción de la lista descripción de la lista
- para estos casos lo primero que se nos puede ocurrir es usar una lista
- Elemento 1
- descripción de la lista descripción de la lista descripción de la lista descripción de la lista descripción de la lista descripción de la lista descripción de la lista
- Elemento 2
- descripción de la lista descripción de la lista descripción de la lista descripción de la lista descripción de la lista descripción de la lista descripción de la lista
<ol>con <br />
dentro de los <p> </p>
Es decir:
<ol>
<li>Elemento 1:<br />
descripción de la lista</li>
</ol>
pues aunque esto cumpla visualmente el objetivo, semánticamente no se entiende que el primero elemento es un título de lista y el segundo es su descripción, es decir no cumplen la accesibilidad por tanto la W3C propone usar las etiquetas <dl><dt /><dd> :
<dl> introduce una lista de definición (dl = definition list = lista de definición).
<dt> introduce la expresión a definir (dt = definition (list) term = expresión en una lista de definición).
<dd> introduce una definición de una expresión (dd = definition (list) definition = definición en una lista de definición).
</dl> cierra la lista. Las etiquetas de cierre </dt> y </dd> pueden ser omitidas, pero no es aconsejable.
el resultado es parecido al que ya hemos conseguido con los <br> pero esta vez está semánticamente correcto:















No Comment Received
Leave A Reply