Índice

La estructura de la página

1. El encabezado de la página

El encabezado de la página está incluido en el elemento HTML <head>.

Muestre el panel DOM.

Si es preciso, despliegue el elemento <head> haciendo clic en images/icone.png.

images/18C22-004.png

Dreamweaver ha insertado todos elementos HTML necesarios. Tenemos los elementos <meta>, <title> (muestre el modo Código para modificar el título rápidamente), el elemento <link> para vinculaciones a la hoja de estilos y el elemento <script> para disponer de la fuente tipográfica Sous Sans Pro.

2. La estructura general

Veamos ahora la estructura general de la página.

En el panel DOM, haga clic en el símbolo images/icone.png que precede al elemento body.

Haga lo mismo con el elemento div #mainwrapper.

images/18C22-005.png

El primer contenedor de la página es una caja <div> con el identificativo #mainwrapper.

Esta caja <div> contiene tres elementos de estructura adicionales:

  • un elemento <header>,

  • una caja <div #content> y

  • una caja <div #footerbar>.

3. El encabezado del contenido

En el panel DOM, despliegue toda la estructura del elemento <header>.

images/18C22-006.png

En primer lugar tenemos una caja <div #logo> que permite insertar un logo en la página.

Después tenemos un elemento <nav> que contiene vínculos <a> de la barra de navegación.

Con la vista en modo Dividir es posible visualizar las dos estructuras:

images/18C22-007.png

4. La estructura principal del contenido

La estructura principal del contenido se encuentra ...