Las tablas son una herramienta potente para presentar datos e imágenes en páginas HTML. Las tablas proporcionan a los diseñadores Web formas de añadir estructura vertical y horizontal a una página. Utilice las tablas para presentar datos tabulares, diseñar columnas o disponer texto o gráficos en una página Web. Podrá agregar contenido; añadir, eliminar, dividir y combinar filas y columnas; modificar las propiedades de tablas, de filas o de celdas para añadir color y alineaciones, así como copiar y pegar celdas.

Las tablas constan de tres componentes básicos:

Filas: Espacio horizontal.
Columnas: Espacio vertical.
Celdas: Los contenedores que se originan en las intersecciones de las filas y las columnas.

Crear Tablas

Podemos crear una tabla fácilmente, pulsando en el icono Tabla, de la barra común, del panel insertar, tal como vemos en la imagen inferior.

Cuando pulsamos sobre el icono, Dreamweaver abre una ventana de diálogo como la que vemos abajo.

En ella nos pide que definamos la forma y características de la tabla que estamos creando

Simplemente tenemos que introducir un valor en la celda filas y otro en la celda columnas para definir el tamaño de la tabla, por ejemplo si introducimos 4 y 3 respectivamente, nuestra tabla tendrá 12 celdas, distribuidas en un rectángulo de 4 celdas de alto y 3 celdas de ancho.

Si cambiamos el valor columna 3 por un 5, la tabla tendrá ahora 20 celdas, distribuidas en un rectángulo de 4 celdas de alto por 5 de ancho.

Desde aquí podemos cambiar también el ancho de la tabla, nuestra tabla tiene ahora 300 píxeles. ¿Qué significa esto? Pues los píxeles son una unidad de medida de las pantallas de televisión y monitores, un píxel es el punto más minúsculo que luz que una pantalla puede manejar.

Esto está en relación directa con la configuración de pantalla de nuestro monitor, por ejemplo si tenemos una resolución 800x600, este es el límite máximo de tamaño que puede mostrar.

En las primeras lecciones vimos que Dreamweaver nos aconsejaba que configuráramos los parámetros de nuestra página según las necesidades de nuestros potenciales usuarios. Estos parámetros van a marcar el límite de la cantidad máximas de píxeles que nuestra página podrá mostrar de una forma cómoda.

En la imagen superior vemos que Dreamweaver nos permite crear con un sólo clic diferentes tipos de encabezados. Esto es una forma muy sencilla de dar una apariencia más estética a nuestras tablas.

En la parte final del cuadro de diálogo, podemos mejorar la accesibilidad de nuestra tabla, esto significa que podemos escribir un texto que se visualizará en el caso de que la tabla no haya podido ser mostrada en el navegador del usuario, ya sea por problema de la red o por carencias del navegado.

Para que nos sirve una tabla

Las tablas tienen muchísima importancia en lo que se refiere al diseño de páginas Web. Son el esqueleto sobre el que las páginas se construyen y por eso, este tema lo veremos paso a paso.

Crearemos una tabla normal como las que podemos crear en cualquier procesador de textos.

Podemos crear una tabla fácilmente, pulsando en el icono Tabla de la barra Común (Common) del panel Insertar (Insert), tal como vemos en la imagen inferior.

Como se Modifica una tabla

Lo primero que hay que hacer es, estando el cursor en una celda o seleccionando varias, desplegar el menú contextual de la tabla al pulsar con el botón derecho sobre ella, o bien abrir el menú Modificar. En ambos casos aparece la opción Tabla.

Según las celdas seleccionadas, algunas de las opciones de Tabla se podrán utilizar mientras que otras no.

Para insertar una fila o una columna, hay que pulsar sobre las opciones Insertar fila o Insertar columna.

La fila se inserta sobre la celda o el conjunto de celdas seleccionadas, mientras que la columna se inserta a su izquierda.

Elementos Básicos de una Tabla

Las tablas cuentan con tres elementos básicos: filas, columnas y celdas (estas se producen de la intersección de una fila y una columna). Dichos elementos son los que ayudan a organizar y administrar los contenidos de las páginas Web.