Mayo 7, 2007

Definition List < dl >: El tag olvidado

Tema: Diseño Web
» Se lee en 61 segs

Para salir un poco de la rutina, disculpar los que no les interesa nada el código fuente, me gustaría conversar sobre una etiqueta de HTML que personalmente me gusta utilizar y está un poco olvidada o quizá nunca se han visto las posibilidad de este tag. Para quien no la conozca, Señoras y señores os presento la etiqueta de Definition List 

<dl>Definition List</dl>

<dt>¿qué es y para qué funciona?</dt>

<dd>Sive para crear listas de definiciones</dd>

</dl>

Esta etiqueta funciona a manera de diccionario/directorio, primero se define la lista (definition list, dl), luego el término (definition term dt) y finalmente la descripción (definition description dd). Para que esta parrafada valide se debe respetar el orden dl - dl -dd. Esta etiqueta tiene un comportamiento similar a del las listas desordenadas <ul> (unordered list) y se puede customizar mucho con CSS.

Dentro de los diferentes usos que he hecho y he visto hacer de ella destacan:

  1. Listas desordenadas donde ya no quieras utilizar <li>. Ejemplo: Tienes dos listas con formatos distintos dentro del mismo div id y no quieres formatear todo de nuevo.
  2. Pie de foto (Image Caption) no es la manaera más elegante, pero con CSS y creatividad se resuelve.
  3. Para colocar elementos que no tengas priodidad semántica.
  4. Para hacer un menú
  5. Evidentemente para hacer un diccionario o lista de definiciones

Lo importante de todo esto es considerar y/o descubrir nuevas etiquetas HTML para no caer en la monotinía de <div> y el <span>, estamos saliendo de las tablas y se aproxima una nueva versión del HTML. A la hora de diseñar prestemos un poco más de atención a los tags, no todo es <h1…6> ni <p> ni <ul> <li> y mucho menos tablas

Tags:, ,

Compártelo

Comentarios

¿Quieres Comentar?

Nombre

Email

Sitio Web

Comentarios

Usándolo.com es el blog personal de Jorge Márquez, dedicado a conversar sobre usabilidad, diseño web y tecnología.
RSS¡ Sindica el contenido de usandolo.com usando RSS !

Temas


Últimamente


Archivos


Cerrar
Enviar por Correo