Las tablas HTML son fáciles de crear una vez que comprende los conceptos básicos de filas y columnas, y también una vez que comprende cuándo está bien usar una tabla y cuándo debe evitarlas.
Una breve historia de tablas y diseño web
Hace muchos años, antes de la aceptación de los estándares CSS y web, los diseñadores web utilizaban el HTML
Elemento para crear un diseño de página para sitios. Los diseños de sitios web se "dividen" en pequeñas piezas como un rompecabezas y luego se combinan con una tabla HTML para representar en el navegador como se pretende. Fue un proceso muy complejo que creó un montón de marcado HTML adicional y que nunca sería utilizable hoy en día en el mundo de pantallas múltiples en el que viven nuestros sitios web. A medida que CSS se convirtió en el método aceptado para los elementos visuales y el diseño de las páginas web, el uso de tablas para esto se convirtió en rechazado y muchos diseñadores web creyeron erróneamente que "las mesas eran malas". Eso fue y es falso. Las tablas para el diseño son malas, pero aún tienen un lugar en el diseño web y HTML, es decir, para mostrar datos tabulares como un calendario o un calendario de trenes. Para ese contenido, usar una tabla sigue siendo un enfoque aceptable y bueno.
Entonces, ¿cómo diseñar una mesa? Empecemos creando una tabla simplemente 2x2. Esto tendrá 2 columnas (estos son los bloques verticales) y 2 filas (los bloques horizontales). Después de crear una tabla de 2x2, puede crear cualquier tabla de tamaño que desee simplemente agregando filas o columnas adicionales.
Así es cómo
-
Primero abre la mesa
-
Abre la primera fila con la etiqueta tr
-
Abre la primera columna con la etiqueta td
|
-
Escribe los contenidos de la celda.
-
Cierra la primera celda y abre la segunda.
|
-
Escribe los contenidos de la segunda celda.
-
Cierra la segunda celda y cierra la fila.
-
Escribe la segunda fila exactamente como la primera
| | |
-
Luego cierra la mesa
-
¡Eso es!
También puede optar por agregar encabezados de tabla a su tabla usando la
elemento. Estos encabezados de tabla reemplazarán las piezas de "datos de tabla" en la primera fila de la tabla, de esta manera:
| Nombre | Papel | | Jeremy | Diseñador | Jennifer | Desarrollador |
Cuando esta página se mostraría en el navegador, esa primera fila con los encabezados de la tabla se mostraría, en forma predeterminada, en negrita y se centraría en la celda de la tabla en la que aparecen.
Entonces, ¿está bien usar tablas en HTML?
Sí, siempre y cuando no los esté utilizando para fines de diseño, está bien usar tablas. Si necesita mostrar información tabular, una tabla es la forma de hacerlo. De hecho, evitar una tabla debido a una pureza equivocada para rechazar este elemento HTML legítimo es tan atrasado como usarlos por motivos de diseño en la actualidad.
Escrito por Jennifer Kyrin. Editado por Jeremy Girard.
|
