Blogia
Webconfort

Winners don´t use tables

Tengo la sensación de que la idea del "tableless", como tantas otras modas del diseño Web, aún no se ha desarrollado lo suficiente como para aplicarse a sitios donde la función estética es vital. Sin embargo creo que es un gran aporte para otros grupos de sitios donde los criterios de importancia se rigen por la usabilidad antes que por la apariencia.

Algunas ventajas del "tableless" o del "full CSS", como suele llamarse al diseño sin tablas:

- Facilita el acceso de las arañas de los buscadores y por ende el posicionamiento de nuestros sitios (Siempre y cuando exista un buen uso de la metainformación).
- Independiza la presentación entregando una mayor "universalidad" a los sitios, independiente del dispositivo a través del cual se accese.
- Facilita el camino al diseño accesible, siempre y cuando se cumplan "otra" serie de pautas.
- Facilita un "control centralizado" del lay out del sitio.
- Reduce el peso de las páginas casi en un 50%, según alardean por ahí.

Hacking and Hacking

Creo que la contra principal del "tableless" es que, para llegar a un diseño complejo, "al pixel", como le gusta decir a los diseñadores, es necesario recurrir a muchos trucos (o hacks). Por otra parte, lejos de los estándares, el tableless también padece la incompatibilidad de softwares y versiones, haciendo del uso de "hacks" una verdadera ciencia.

Pero claro, estos problemas ya estaban presentes en el diseño con tablas. De modo que si nos facilita un poco la vida, pues como decía una vieja propaganda (aviso, jingle, reclame) en la Argentina, hace algunos, "(muchos) años, "dígale sí al tableless".

Algunos de los que ya le dijeron "SI" al tableless:

Wired: fue una de la spioneras, para variar.
ESPN.com: sorprende por ser un diseño más complejo de lo que puede verse en la Web sin tablas.
Alzado.org: fieles a la investigación y las novedades con sentido, la gente de Alzado prescindió de las tablas en su actual diseño. Y publicó un artículo sobre el tema.

"Winner don´t use tables" Dixit Geekonline, de Javier Cabrera.

5 comentarios

Pablo -

Revisa en Alzado.org y en CSS garden. Cualquier búsqueda en google también te llevará a un buen listado de recursos de este tipo. Por cierto, este weblog se ha mudado a webconfort.com.

matias -

Algun tutorial de como hacerlo?? es que me he torturado tratando de hacer algo parcialmente bueno usando solo css nada de tablas, y la verdad es que no me sale absolutamente nada... Por eso pregunto si saben de algun manual, tutorial, how to, comos sea que se llame que muestra alguna manera de hacerlo bien?

Gracias!

Pablo -

Creo que lo interesante de esos ejemplos es que minimizan el uso de tablas (Tableless), pero estoy de acuerdo con Lucas en que los códigos reflejan el uso de tablas.
Tal cual aporta Mini-d arriba, algunos ejemplos más sólidos pueden encontrarse en Mezzoblue.com, en cssgarden.com (valida las "AAA" de la WAI), ambos sitios orientados al conocimiento en el uso del CSS.

lucas -

En los 3 ejemplos citados podrás encontrar el tag "table" dentro del código.

mini-d -

Te faltan ver más ejemplos, CSS Garden, hay bastantes empresas que ya se han mudado a CSS + XHTML, en mezzoblue puedes ver las si revisas los archivos.