Uninstallme

Desarrollo front-end, estándares web, accesibilidad y más

Si queremos (deberíamos) hacer una tabla accesible, podemos hacer uso del atributo abbr de los encabezados de tabla (<TH>). Este atributo puede servir a dos propósitos complétamente distintos.

Abreviar contenidos largos en celdas

Muchas veces, se piensa que el uso de este atributo cumple la misma función que la etiqueta <abbr> de HTML para mostrar la forma extendidida de una abreviatura o abreviación, sin embargo, su uso en encabezados de tabla, aunque también puede cumplir este objetivo, está concebido justamente para el contrario. En la traducción de la especificación de HTML 4.01 de html.conclase.net, podemos encontrar el siguiente fragmento:

Este atributo debería usarse para proporcionar una forma abreviada del contenido de la celda; los agentes de usuario pueden representar esta forma abreviada en lugar del contenido de la celda cuando sea apropiado. Los nombres abreviados deberían ser cortos, ya que los agentes de usuario pueden representarlos repetidas veces. Por ejemplo, los sintetizadores de voz pueden representar los encabezados abreviados relacionados con una celda en particular antes de representar el contenido de esa celda.

En este ejemplo de código extraído de 456 Berea Street, podemos ver cómo se ha usado el atributo abbr para proporcionar una forma abreviada de cada encabezado:


<table summary="The number of employees and the foundation year of some imaginary companies.">
    <caption>Table 1: Company data</caption>
        <tr>
            <th abbr="Company">Company Name</th>
            <th abbr="Employees">Number of Employees</th>
            <th abbr="Founded">Foundation Year</th>
    </tr>

Expandir formas abreviadas en celdas

Otro caso en el que necesitaremos usarlo, es cuando el encabezado de tabla ya está abreviado. Un ejemplo podría ser el de los días de la semana abreviados mediate sus iniciales (L, M, X, J, V, S, D), en el que el uso del atributo abbr serviría para mostrar la forma extendida (Lunes, Martes, etc.)

En este ejemplo extraído de Dive Into Accessibility, podemos ver este otro uso del atributo abbr:


<tr>
    <th abbr="Sunday" align="center"><span class="calendar">Sun</span></th>
    <th abbr="Monday" align="center"><span class="calendar">Mon</span></th>
    <th abbr="Tuesday" align="center"><span class="calendar">Tue</span></th>
    <th abbr="Wednesday" align="center"><span class="calendar">Wed</span></th>
    [...]
</tr>

En mi opinión, raras veces necesitaremos usar este atributo, a no ser que tengamos un encabezado de tabla muy largo y su repetición continua pueda resultar una molestia.

Cuando lo usemos con el propósito contrario (mostrar una forma extendida), deberemos asegurarnos de que es realmente necesario y no estamos causando una molestia proporcionando una forma larga para un encabezado abreviado, si este ya resulta suficiéntemente claro por sí mismo.

Sin comentarios

Acabo de encontrar un interesante hilo en la lista de correo de Ovillo sobre el uso de los términos “marcado semántico” frente a “marcado estructural”.

Sincéramente es un tema que me revienta, ya que se está hablando de cosas distintas y mezclando la velocidad con el tocino por la tendencia de sacar a relucir Web Semántica a la mínima oportunidad.

Sigue leyendo esta entrada »

1 Comentario

El lenguaje html no dispone de todas las etiquetas que desearíamos. Esto nos suele hacer darle unas cuantas vueltas de cabeza a la forma de marcar ciertos elementos que no disponen de una etiqueta específica, como pueden ser los poemas.

Sigue leyendo esta entrada »

Sin comentarios