Para o layout de uma página criativa este recurso é essencial, pois permite alinhar gráficos, textos, listas e até mesmo outras tabelas com itens distintos. Nestes casos é bom definir a borda como zero. O mais interessante de páginas desenhadas desta maneira é que os visitantes não percebam o que há por trás do design. A página do Radix é um exemplo dessa organização. A página central da UFPel e a Webstation também utilizam tabelas para a diagramação.
Uma outra maneira interessante de se usar tabelas é criar uma página com layout semelhante a uma página de revista. O site em homenagem a Vanessa Paradis foi criado desta maneira.
Tabelas também podem ser usadas como faixas ou banners textuais. Todas estas páginas foram criadas com a utilização de tabelas. Veja um banner feito com este recurso:
<CENTER>
<TABLE WIDTH=90% BORDER=0>
<TR>
<TD ALIGN=center VALIGN=middle WIDTH=30% BGCOLOR="#000000">
<FONT SIZE=+2 COLOR="#FFFFFF" FACE="ARIAL"> <B>Para quem</B></FONT>
</TD>
<TD ALIGN=center VALIGN=middle WIDTH=40% BGCOLOR="#FFFFFF">
<FONT SIZE=+2 COLOR="#000000" FACE="ARIAL"> <B>não quer perder</B></FONT>
</TD>
<TD ALIGN=center VALIGN=middle WIDTH=30% BGCOLOR="#000000">
<FONT SIZE=+2 COLOR="#FFFFFF" FACE="ARIAL"><B>tempo.</B></FONT>
</TD>
</TR>
</TABLE>
</CENTER>
| Para quem | não quer perder | tempo. |
Tabelas coloridas também chamam atenção e podem ser mais agradáveis que as tabelas convencionais.
<CENTER>
<TABLE BORDER=0 WIDTH=75%> <TR>
<TH BGCOLOR=#0080C0> Artista </TH>
<TH BGCOLOR=#008080> Título </TH>
<TH BGCOLOR=#8080C0> Nacionalidade </TH>
<TR><TD ALIGN=center BGCOLOR=#0080C0>
<FONT SIZE=-1 COLOR=#FFFFFF> Enya </TD>
<TD ALIGN=center BGCOLOR=#008080>
<FONT SIZE=-1 COLOR=#FFFFFF>Shepherd Moons </TD>
<TD ALIGN=center BGCOLOR=#8080C0>
<FONT SIZE=-1 COLOR=#FFFFFF>Irlanda </TD>
<TR><TD ALIGN=center BGCOLOR=#0080C0>
<FONT SIZE=-1 COLOR=#FFFFFF>Loreena McKennitt </TD>
<TD ALIGN=center BGCOLOR=#008080>
<FONT SIZE=-1 COLOR=#FFFFFF>The Visit </TD>
<TD ALIGN=center BGCOLOR=#8080C0>
<FONT SIZE=-1 COLOR=#FFFFFF>Canadá </TD>
<TR><TD ALIGN=center BGCOLOR=#0080C0>
<FONT SIZE=-1 COLOR=#FFFFFF>Deep Forest </TD>
<TD ALIGN=center BGCOLOR=#008080>
<FONT SIZE=-1 COLOR=#FFFFFF>Boheme </TD>
<TD ALIGN=center BGCOLOR=#8080C0>
<FONT SIZE=-1 COLOR=#FFFFFF>França </TD>
<TR><TD ALIGN=center BGCOLOR=#0080C0>
<FONT SIZE=-1 COLOR=#FFFFFF>Dadawa </TD>
<TD ALIGN=center BGCOLOR=#008080>
<FONT SIZE=-1 COLOR=#FFFFFF>Sister Drum </TD>
<TD ALIGN=center BGCOLOR=#8080C0>
<FONT SIZE=-1 COLOR=#FFFFFF>China </TD>
</TABLE>
</CENTER>
| Artista | Título | Nacionalidade |
|---|---|---|
| Enya | Shepherd Moons | Irlanda |
| Loreena McKennitt | The Visit | Canadá |
| Deep Forest | Boheme | França |
| Dadawa | Sister Drum | China |
O uso de tabelas, bem como outros recursos de HTML podem ser muito melhor explorados se você tiver um pouco de paciência e "brincar" bastante com as tags. Use da criatividade e veja quantas coisas interessantes podem ser feitas com as tabelas.
