Siendo un poco justo con

, se ha diezmado bastante su personalidad en estos años de incesante impulso semántico. Esta fiel etiqueta ha sido degradado a no más poder por mucho tiempo, y vengo a su rescate.

Como he escrito muchas veces ya a lo largo de este sitio, las tablas son para contener datos tabulados. Sólo para eso, esa información desagradable que suelen acompañar a los gráficos, esos nombres y números que a nadie le gusta. Para eso está

, para ordenar esos datos y nada más. Y bueno, ahora que ya tiene su función, aprendamos a utilizarlo bien.


     
          
          
     
     
          
          
     
     
          
          
     
NombreEdad
Tulio36
Patana15

Ver ejemplo 1{.verejemplo}

Una simple tabla que contiene valores cualesquiera. Ahora, le daremos sentido a sus etiquetas.

Table Header Cell, una celda de título de una tabla. La utilizamos cuando tenemos el título de una fila o columna, y tiene propiedades por defecto, por ejemplo, su contenido se despliega en bold.

Si la aplicamos a nuestra tabla básica de ejemplo, sería de la siguiente manera:


     
          
          
     
     
          
          
     
     
          
          
     
NombreEdad
Tulio36
Patana15

Ver ejemplo 2{.verejemplo}

Esta etiqueta le da un título a la tabla, como un lo es para su

.


     
     
          
          
     
     
          
          
     
     
          
          
     
Tabla de edades
NombreEdad
Tulio36
Patana15

summary

Atributo de la etiqueta

, especial para lectores de pantalla (no-videntes). Aquí, nos explayamos un poco más que en

Filas se pueden agrupar en un encabezado (

), un cuerpo de contenido () y un pie (), pudiendo cada grupo contener una o más filas. Con esto se hace más fácil darle estilos a las secciones de nuestra tabla, así nos ahorramos classes en cada celda. Otra ventaja es en la impresión, si ésta es muy larga en Firefox por ejemplo se imprimirán el encabezado y el pie en cada hoja (independiente si el cuerpo es muy extenso y no cabe en la impresión).

, explicando extensamente de qué se trata nuestra tabla.


     
     
          
          
     
     
          
          
     
     
          
          
     
Tabla de edades
NombreEdad
Tulio36
Patana15

Ver ejemplo 3{.verejemplo}


     

     

          

               

               

          

     

     

          

               

          

     

     

          

               

               

          

          

               

               

          

     

Tabla de edades
NombreEdad
Bajada
Tulio36
Patana15

Ver ejemplo 4{.verejemplo}

Un detalle es que si usan y , deben ir juntas y consecutivas, antes de . Aún así, se mostrará debajo del contenido de . Si no lo necesitan, ocúltenlo con su método favorito.

Está de más escribir que bgcolor, height, width, align y nowrap están obsoletos y no son soportados en HTML 4.01. Además, no se recomienda el uso de background dentro del HTML, para esto se utlizan hojas de estilos CSS.