[HTML5] Nuevos elementos semánticos en HTML5

En el anterior post sobre HTML5 se hizo una pequeña introducción a qué es HTML5, además mención algunas herramientas que uso generalmente (ver post), en este artículo quiero mostrar algunos de los nuevos elementos semánticos disponibles en HTML5.

Y los elementos son:

· section: Se utiliza para una sección genérica de una página, sirve para agrupar contenido de un mismo tema.

· header: Utilizado para servir de contenedor para la información de cabecera de la página, generalmente esa información es el logo, nombre, lema y vínculos de navegación.

· hgroup: Utilizado para agrupar un grupo de elementos de encabezado (h1 – h6), actúa como un subheader.

· footer: Utilizado como contenedor para la sección de información de la parte inferior de la página, generalmente datos de contacto.

· nav: Utilizado para servir de contenedor para links de navegación, un ejemplo puede ser el menú de navegación del sitio.

· article: Utilizado para servir como contenedor para el contenido, un ejemplo puede ser un post en un blog.

· aside: Utilizado como contenedor para el contenido relacionado, es decir se puede manejar como un sidebar.

Un ejemplo (y aclaro es solo una posible distribución) de cómo sería la estructura de una página en HTML5 es:

Espero les sea de utilidad, en el próximo post hablaré sobre los nuevos tipos de input.