Outbook

HTML+CSS+JS, Accesibilidad, PHP y más

Inicio que contiene a Desarrollo web que contiene a Accesibilidad que contiene a XHTML: Nube de etiquetas accesible

Datos de búsqueda

XHTML: Nube de etiquetas accesible

Las nubes de tags suelen estar conformadas por un grupo de palabras que aparecen en distintos tamaños según la importancia que tengan. Pueden ir en un solo párrafo o bien en elementos de lista.

Para darles los tamaños es necesario darles una clase (no vale el atributo style, ya que supone mezclar presentación y contenido) o utilizar etiquetas EM y STRONG anidadas. En el segundo caso, en cuanto haya unas cuantos niveles de importancia habrá un montón de etiquetas anidadas dentro de otras, y el usuario no podrá distinguir adecuadamente cual tiene mayor importancia salvo por su aspecto visual.

Si la etiqueta más grande es la más importante, ¿por que no ponerla la primera?

En conclusión:

  • Da lo mismo utilizar un párrafo o una lista.
  • Se deben utilizar clases para definir los tamaños.
  • Las etiquetas deben ir en orden de mayor a menor importancia

Un ejemplo:

<p>
 <strong>Etiquetas<span class="oculto"> (de mayor a menor importancia)</span>:</strong>
 <a href="#" class="s5">Etiqueta 1</a>,
 <a href="#" class="s4">Etiqueta 2</a>,
 <a href="#" class="s3">Etiqueta 3</a>,
 <a href="#" class="s2">Etiqueta 4</a>,
 <a href="#" class="s1">Etiqueta 5</a>,
 <a href="#">Etiqueta 6</a>,
</p>

Enlace relacionado: Marking Up a Tag Cloud (24 Ways).

Compartir este artículo:

  • Compartir en del.icio.us
  • Compartir en Technorati
  • Añadir a Google Bookmarks
  • Compartir en Google Buzz

Datos del artículo:

Comentarios del artículo

Los comentarios están cerrados.

Si el comentario no guarda relación con el tema del artículo o los comentarios previos, si la redacción del mismo es ilegible (estilo HOYGAN), o si contiene insultos u otros términos ofensivos, será borrado de inmediato. No se garantiza ningún soporte a los ejemplos de desarrollo web presentados en este sitio.

Todavía no hay comentarios.

Los comentarios están cerrados.

Información del sitio