Las páginas web necesitan descargarse rápidamente, pero las tablas anidadas pueden ralentizar el proceso. No dejes que nadie te diga que más gente usa banda ancha o Internet de alta velocidad, así que no tienes que preocuparte por la velocidad con la que se cargan tus páginas. Con la cantidad de contenido en la Web, una página o sitio que se carga lentamente va a tener menos visitantes que uno que se carga rápidamente. La velocidad es muy importante.
Índice de contenidos
¿Qué es una tabla anidada?
Una tabla anidada es una tabla HTML que tiene otra tabla dentro. Por ejemplo:
#fefefe»>#fefefe»>#fefefe #fefefe»>#fefefe»>#fefefe Columna 1. Columna 2. Columna 3. / i> #fefefe»>#fefefe Columna 1
â?ª â?ª â?ª
#fefefe»>#fefefe»>#fefefe nested table column 1
nested table column 2 / i> / i> / i> #fefefe»>#fefefe Columna 1
DIFUNDE LA PALABRA- Columna 3 / i> Las tablas anidadas hacen que las páginas se descarguen más lentamente
Una sola tabla en una página Web no hará que la página se descargue más lentamente (dentro de lo razonable). Pero en el momento en que pones una tabla dentro de otra, se hace más complicado que el navegador la renderice, por lo que la página se carga más lentamente. Y cuantas más tablas haya anidado una dentro de la otra, más lenta será la carga de la página.
Al crear una página con tablas, tenga en cuenta que cuantas más tablas haya dentro de las tablas, más lenta será la carga de la página. Normalmente, cuando se carga una página, el navegador comienza en la parte superior del HTML y lo carga secuencialmente en la página. Sin embargo, con las tablas anidadas, tiene que encontrar el final de la tabla antes de poder mostrarlo todo.
Tablas para el diseño
No debería utilizar tablas para el diseño de sus páginas Web. Casi siempre requieren que use tablas anidadas, por lo que una página Web de diseño de tablas se cargará más lentamente que el mismo diseño renderizado en CSS.
Además, si está intentando escribir XHTML válido, las tablas no deberían utilizarse para el diseño en absoluto. Las tablas son para datos tabulares (como hojas de cálculo), no para la presentación. En su lugar, debería utilizar CSS para los diseños de maquetación-CSS que se renderizan más rápidamente y le ayudan a mantener un XHTML válido.
Diseño de tablas de carga más rápidas
Si diseña una tabla con varias filas, a menudo se puede cargar más rápidamente si escribe cada fila como una tabla separada. Por ejemplo, podría escribir una tabla como ésta:
#fefefe»>#fefefe»>#fefefe top row / i> #fefefe»>#fefefe DIFUNDE LA PALABRA- Columna derecha #fefefe»>#fefefe»>/»font color=»#fefefe «#fefefe»>/»font color=»#fefefe «#fefefe»> / i> Pero si escribiera la misma tabla que dos tablas, parecería que se carga más rápidamente, porque el navegador renderizaría la primera y luego la segunda, en lugar de renderizar toda la tabla de una sola vez. El truco es asegurarse de que cada mesa tenga el mismo ancho y otros estilos (como acolchado, márgenes y bordes).
#fefefe»>#fefefe»>#fefefe top row / i> #fefefe»>#fefefe»>#fefefe DIFUNDE LA PALABRA- Columna derecha #fefefe»>#fefefe»>/»font color=»#fefefe «#fefefe»>/»font color=»#fefefe «#fefefe»> / i> Convertir tablas anidadas en una tabla
Puedes sentir que todo esto es buena información, pero tienes una tabla que debe tener otra tabla anidada en ella. Si bien esto puede ser cierto, a menudo puede convertir tablas anidadas en tablas individuales ligeramente más complejas utilizando los atributos y de las celdas de su tabla. Por ejemplo, en la tabla anidada en la parte superior, puedo convertirla en una sola tabla con sólo el atributo colspan :
#fefefe»>#fefefe»>#fefefe #fefefe»>#fefefe»>#fefefe Columna 1. colspan=»2″>Columna 2
Columna 3. / i> #fefefe»>#fefefe Columna 1
nested table column 1
nested table column 2
Columna 3 / i> #fefefe»>#fefefe Columna 1
colspan=»2″>Columna 2
Columna 3 / i> Esta tabla también tiene la ventaja de utilizar menos caracteres que la tabla anidada, por lo que también se descargará más rápido.