Saltar navegación
Contacto: (+34) 670 230 483

Usted está en: Inicio > Blog > Tabla con pijama con CSS y JavaScript: una guía para los ojos

Tabla con pijama con CSS y JavaScript: una guía para los ojos

Escrito por Equipo Usolab el 2 May 2005

Dada la importancia de las tablas en la presentación de la información, es conveniente facilitar su visualización e interpretación.

La forma de mostrar los resultados en las tablas pueden hacer más difícil o fácil su comprensión a los usuarios. En los ejemplos, mostrados a continuación (tomados de Zebra Tables de David F. Miller, se ve cómo diferentes opciones influyen en el esfuerzo exigido para la captación de los datos, cuando el espacio vacío entre dos columnas de una tabla es grande.

En la tabla siguiente, como el ojo no tiene nada que lo guíe en el espacio vacío entre la columna de la izquierda y la de la derecha, vacila en la trayectoria visual, lo que exige más tiempo para relacionar los contenidos.

En la tabla inferior, la línea horizontal ayuda y guía al ojo de una columna a otra. Sin embargo, la estrechez de la línea exige esfuerzo extra al usuario. Tiene que bajar su mirada hasta la línea y luego seguirla con atención hasta la otra columna.

En la tabla siguiente, la anchura de la línea facilita al ojo el desplazamiento de una columna a la otra, lo que ayuda a leer la información contenida en la tabla.

Miller explica en Zebra Tables cómo hacer esto con JavaScript y CSS.





Últimos tweets de Usolab

  • Ups, parece que ahora mismo no podemos mostrar nuestros tweets.

Proyectos propios

Bankimia

Bankimia es un comparador de productos financieros.

Actualmente ofrece información sobre hipotecas, depósitos bancarios, cuentas y préstamos de 42 bancos y cajas.