Análisis de la columna izquierda

Tabla de imágenes

En la web inicial “portafolio 1” hay un problema de accesibilidad, provocado por la maquetación de imágenes en una tabla. Recordemos una vez más que el W3C desaconseja en uso de tablas para cualquier cosa que no sean datos tabulares. Este elemento no fue creado para maquetar imágenes de modo que buscaremos una solución accesible sin tablas.

Alternativa accesible a la tabla de imágenes

Aquí debemos pensar si resulta importante mantener la estructura de la tabla para distintas resoluciones o anchos de ventana. Si debemos mantener la estructura de 3 x 3 para cualquier ancho, o si este aspecto puede o debe modificarse adaptándose a la ventana.

Si pensamos en la accesibilidad de dispositivos no resulta favorable una estructura rígida de 3 x 3, y en esta tabla tampoco se requiere una relación entre celdas y encabezados de fila y columna, por lo tanto nos podemos beneficiar de la accesibilidad de dispositivo que siempre proporciona un contenido líquido adaptable a otras resoluciones o anchos de ventana.

En este sentido aprovecharemos la propia naturaleza de los elementos “img”. Se trata de elementos de línea, y por lo tanto su flujo dentro del documento es posicionarse unos al lado de otros hasta completar una línea y continuar en la siguiente.

Aquí tenemos un ejemplo de solución que no consiste en añadir nada nuevo, simplemente en quitar cosas, en realidad transformar un documento en accesible suele consistir en ir quitando cosas (elementos de presentación) del código del documento.

Tan solo debemos quitar la tabla y dejar que las imágenes se comporten de acuerdo a la naturaleza del elemento “img”.

Si necesitamos acotar un poco su recorrido podemos ponerlas dentro de un párrafo de clase.

Documento conforme W3C XHTML 1.0|CSS 2.0|WAI AA