Saltar la navegación

Elementos estructurales

El elemento de encabezado contiene información de introducción a una sección o página.

<header>

NAV contiene la navegación principal (no todos los grupos de enlaces deben estar contenidos dentro del elemento NAV).

<nav>

El elemento sección sirve para englobar información relacionada. No debemos usarlo siempre en sustitución de DIV, porque SECTION indica que contiene información vinculada. Si queremos agrupar elementos sólo para controlar su presentación usaremos DIV, como hacíamos en HTML4 o XHTML1.

<section>

Un artículo es una porción independiente en una página: una entrada de blog, de un foro, una noticia...

<article>

Usamos la etiqueta ASIDE para incluir contenido relacionado con el área principal del documento. Puede contener elementos como artículos relacionados, nubes de etiquetas, etc.:

<aside>

FOOTER sirve para marcar el pie de página, aunque también podremos utilizarlo como pie de una sección. En ese caso nos encontraríamos más de una etiqueta FOOTER en una misma página.

<footer>

Lo que antes hacíamos con una capa, ahora podemos hacerlo con esos elementos:

Estructura HTML4 o XHTML
Estructura HTML4 o XHTML
Estructura HTML5
Estructura HTML5

¿Dónde podemos encontrarlos?

Debemos tener en cuenta que algunos de estos elementos pueden estar más de una vez en una misma página. La página puede tener una cabecera, pero una sección de mi página podrá tener su propia cabecera. Estructurando bien el código aportamos mucha información semántica.

Un ejemplo

Veamos un mismo documento XHTML y su versión HTML5 (utilizando las nuevas etiquetas estructurales):

Pero además, la API (Application Programming Interface o Interfaz de Programación de Aplicaciones) de HTML5 ofrece otras interesantes novedades que iremos conociendo en las próximas páginas.

La API proporciona un conjunto de funciones de uso general que los desarrolladores pueden usar sin necesidad de programar todo desde el principio.