DIV y CSS vs Tablas. Maquetación web. Razones para utilización de DIVs y CSS

Date

Hace algunos años era normal que la maquetación HTML de todos los sitios estuviera realizada utilizando la etiqueta table para dar forma al diseño, estructura de las diferentes secciones de un sitio web, etc… Desde hace unos años se viene utilizando en vez de esto la etiqueta div y apoyándose en estilos de archivos .css para dar cuerpo a la forma (layout) de un sitio web.

La discusión sobre cuál de las dos formas es mejor es un tema muy tratado ya en Internet, la práctica y la tendencia escogida por los principales proyectos web demuestra que lo mejor es la utilización de DIVs/CSS sobre las tablas.

Ahora bien, muchos webmasters deben dar una explicación a sus clientes sobre por qué escoger una forma u otra, incluso algunos webmasters siguen poniendo en duda las ventajas de una forma sobre otra. Adjuntamos dos enlaces sumamente útiles para hacer esta justificación:

http://css-discuss.incutio.com/?page=WhyCss

http://www.hotdesign.com/seybold/10filesize.html

El primer artículo describe en español básicamente los siguientes puntos, los cuales son contundentes en la justificación:

1. Editando un solo archivo CSS puede hacer cambios drásticos a un diseño completo en segundos.
2. CSS le permite tener un output en múltiples formatos de una forma muy sencilla
3. CSS le permite usar nombres para cada elemento de una página. Usted por ejemplo puede darle a un DIV el nombre de “Encabezado” que describe perfectamente el contenido de su HTML.
4. Los CSS externos se quedan almacenados en el cache de los navegadores por lo que se reduce el tiempo de descarga de un sitio web
5. CSS elimina código innecesario y obsoleto, por ejemplo la etiqueta font, gifs spacer, tablas encadenadas. Todo esto mejora el tiempo de carga y hace la vida del desarrollador más fácil
6. CSS permite hacer cosas más interesantes que el HTML por sí sólo no permite como un mejor control de los tipos de letra, posicionamiento absoluto, borders más elegantes, etc.
7. El buen uso de CSS mejora la accesibilidad y la lectura que tienen los motores de búsqueda sobre un sitio web.
8. El uso de :hover en CSS elimina el uso de Javascript para crear efectos de onmouseover.
9. Si quiere validación XHTML strict no le queda otro camino que usar este método.

Conocer más
noticias

Skip to content