Ahora vamos a ver una situación donde una tabla resuelve un problema muy común. Imagínate que has tenido esta gran idea para un gif animdo. Pero la imagen a utilizar es enorme. Dado que sabes que un gif animado es básicamente una serie de imágenes gif mostradas una detrás de otra, te haces a la idea de que el archivo final va a ser monstruosamente grande. Y tus visitantes no van a sentirse muy felices si tienen que esperar a que se descargue una imagen de 700K. No sólo eso, sino que además, es muy posible que el navegador se cuelgue intentando ejecutar el gif de los demonios. ¿Hay alguna solución?. Claro, corta la imagen y muestrála como una tabla.

Aquí hay un ejemplo:

¿Netscape vs. Microsoft?

Ilustración de Boris Vallejo

 

La misma tabla con CELLSPACING fijado a 3.

¿Netscape vs. Microsoft?

La única parte de la imagen que está animada son los ojos.

Bien, aquí tienes el código html para la tabla. (La sentencia caption se ha añadido sólo por divertimento. No se requiere ni tiene un gran impacto en el resto de la tabla)

<TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0>
<CAPTION ALIGN="top"><FONT SIZE=6><B><I>¿Netscape vs. Microsoft?</I></B></FONT></CAPTION>

<TR>
<TD ROWSPAN=3><IMG SRC="dragon/dragon4.gif" WIDTH=250 HEIGHT=406></TD>
<TD><IMG SRC="dragon/dragon3.gif" WIDTH=122 HEIGHT=109></TD>
<TD ROWSPAN=3><IMG SRC="dragon/dragon5.gif" WIDTH=219 HEIGHT=406></TD>
</TR>

<TR>
<TD><IMG SRC="dragon/anidrag.gif" WIDTH=122 HEIGHT=50></TD>
</TR>

<TR>
<TD><IMG SRC="dragon/dragon2.gif" WIDTH=122 HEIGHT=247></TD>
</TR>

</TABLE>

Este es el esquema:

dragon_layout

 

PREGUNTA: ¿Por qué hay espacios en mis tablas (o entre mis imágenes) ¿Cómo puedo hacer que la imagen A esté perfectamente unida a la imagen B?

R: Este es un problema común. Y lo peor es que a veces se produce sólo en ciertos navegadores. Hay ciertas causas y ciertas soluciones, las cuales están detalladas aquí.

Bueno, esto es todo en cuanto a tablas. Ni que decir tiene que esto es el final del tutorial, pero como quiero hacer hincapié en la importancia de las tablas para poder conseguir páginas de calidad, he añadido algunos ejemplos más. Intenta reproducirlos tú también.