4. Para ampliar

El diseño de las páginas web habituales se divide en bloques: cabecera, menú, contenidos y pie de página. Visualmente, los bloques se disponen en varias filas y columnas. Por este motivo, hace varios años la estructura de las páginas HTML se definía mediante tablas, sin embargo ahora gracias a los bloques <div> es muy fácil dar estilo y formato a nuestra página de forma rápida y elegante.

Aunque en próximas unidades aprenderemos a desarrollar  nuestra hoja de estilos (CSS), es importante que conozcas estas divisiones incluso  ya HTML5 define  los bloques por defecto.

Veamos un ejemplo de página con cuatro <div> o bloques que se corresponden con la cabecera (header), menú de navegabilidad (nav), sección central (section) y el pie de página (footer). Fíjate como se utiliza el atributo id para identificarlos, estudiaremos cómo asociar este identificador para crear nuestros estilos. Puedes consultar más información al respecto en layout w3schools.

layout
Imagen del autor
layout
Imagen del autor