Por qué debe evitar el uso de tablas anidadas

Por qué debe evitar el uso de tablas anidadas

Por qué debe evitar el uso de tablas anidadas

VALORACIÓN DEL ARTÍCULO:
5/5

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.

TAMBIÉN TE INTERESA

uso de la IA en BTOB

Impacto de la IA en un negocio (real y cuantificado): el caso de BTOB

Las principales noticias sobre la inteligencia artificial giran en torno a las numerosas aplicaciones que han salido al mercado para una amplia variedad de sectores. Sin embargo, pocas hablan del verdadero impacto de la IA en un negocio. El ejemplo de BTOB puede aclarar muchas dudas sobre la influencia que tiene la nueva tecnología en

Suite VIsual de Canva

Suite Visual 2.0 de Canva: el mayor lanzamiento en la historia de la plataforma

Canva ha dejado de ser solo una plataforma de diseño gráfico accesible. En su última edición del evento Canva Create, celebrado en Los Ángeles, la compañía australiana ha anunciado el lanzamiento de su mayor revolución tecnológica hasta la fecha: la Suite Visual 2.0 de Canva, un paquete de herramientas que promete transformar la manera en

IA de WordPress

Con la IA de WordPress nunca fue tan sencillo crear una página web

WordPress, quizás la plataforma más popular para crear webs de forma profesional, acaba de dar un paso muy importante: la IA de WordPress ha sido presentada con el objetivo de generar páginas de una forma muy sencilla. Si ya era fácil construir una página web en este ecosistema, ahora lo será mucho más. Todo se

Kings League Clash of Captains

La fructífera relación entre la Kings League Spain y el mundo del gaming

Lo que comenzó como una liga de fútbol 7 reinventada por streamers y exfutbolistas, se ha convertido en un fenómeno de entretenimiento que trasciende el césped. La Kings League Spain, conocida por romper moldes y conectar con las nuevas generaciones a través del deporte y el contenido digital, ha estrechado lazos muy fuertes con el