[HTML5] Nuevos elementos semánticos en HTML5

Posted on Actualizado enn


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:

Imagen1

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

About these ads

3 comentarios en “[HTML5] Nuevos elementos semánticos en HTML5

    [...] [HTML5] Nuevos elementos semánticos en HTML5 [...]

    Maik escribió:
    10/22/2012 en 17:56

    Howdy! I know this is somewhat off topic but I was wondering if you knew where I could find a captcha
    plugin for my comment form? I’m using the same blog platform as yours and I’m having difficulty finding one?
    Thanks a lot!

    Resumen Post 2012 « Todo en ASP.NET escribió:
    12/19/2012 en 22:04

    [...] [HTML5] Nuevos elementos semánticos en HTML5 [...]

Deja un comentario

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s