Cómo utilizar etiquetas semánticas para la programación html5 y css3

A medida que los desarrolladores web comenzaron a utilizar técnicas de diseño flotante, ellos divs casi siempre creados llamados NAV, encabezamiento, y pie de página. Los desarrolladores de HTML5 decidieron crear nuevos elementos con estos nombres. Echar un vistazo al siguiente código para ver las etiquetas semánticas en acción.

Video: Cursos HTML + CSS3 | Responsive Design

semántico

Este es mi cabecera

Sección 1

Sección del cuerpo ...

Sección 2

Sección del cuerpo ...

Artículo

Cuerpo del artículo ...

Como se puede ver, hay una serie de nuevas etiquetas de marcado semántico en HTML5:

Video: HTML5 y CSS3 - 3 - ¿Nuevos divs? ¡Nuevas etiquetas!

encabezamiento: Esto no es lo mismo que las etiquetas h1-h6. Denota una parte de la página que contendrá un encabezado de la página. A menudo, la cabecera se llenará el ancho de la página, y tendrá algún tipo de imagen de la bandera. Contiene frecuencia h1 contenido.

  • NAV: Esta etiqueta indica algún tipo de sección de navegación. No tiene un estilo particular de su propia, pero se usa con frecuencia, ya sea como un menú horizontal o vertical de navegación del sitio.

    Video: Curso de HTML5 esencial - HTML5 y CSS3 (Hojas de estilo, etiquetas link y style)

  • sección: Una sección se utiliza para especificar una parte genérica de la página. Puede tener varias secciones en la misma página.

  • artículo: Un artículo es como una sección, pero está diseñado para ser utilizado con recursos externos. Muchas páginas se construyen automáticamente por el software, y cuando estas páginas integrar contenido de otras fuentes, es la intención de utilizar el artículo etiqueta para integrar este contenido.

  • pie de página: Un pie de página tiene la intención de mostrar el contenido de pie de página en la parte inferior de una página. Normalmente, un pie de página cubre la parte inferior de una página, aunque este no es el comportamiento por defecto.

  • Tenga en cuenta que ninguno de estos elementos tiene ningún formato específico. Todo depende de usted para proporcionar el formato a través de código CSS. Cada uno de los elementos pueden formatearse directamente como un elemento HTML (porque eso es lo que es). Todos los navegadores de última versión soportan las etiquetas de marcado semántico, pero si quieres apoyar a los navegadores antiguos (especialmente decir, antes de la versión 8), todavía tendrá que utilizar divs.

    Artículos Relacionados