Explicación de Etiquetas Semánticas HTML5

Header

Sintaxis

<header>...</header>

Ejemplo introductorio

<header>
    <h1>Título de la WEB</h1>
</header>

Nav

Sintaxis

<nav>...</nav>

Ejemplo introductorio

<nav>
    <ul>
        <li><a href="#">Inicio</a></li>
        <li><a href="#">Servicios</a></li>
        <li><a href="#">Contacto</a></li>
    </ul>
</nav>

Section

Sintaxis

<section>...</section>

Ejemplo introductorio

<section>
    <article>
        <h2>CONTENIDO PRINCIPAL</h2>
        <p>Este es el contenido principal de mi web.</p>
    </article>
</section>

Article

Sintaxis

<article>...</article>

Ejemplo introductorio

<article>
    <h2>CONTENIDO PRINCIPAL</h2>
    <p>Este es el contenido principal de mi web.</p>
</article>

Aside

Sintaxis

<aside>...</aside>

Ejemplo introductorio

<aside>
    <h3>Testimonios</h3>
    <p>Me gusta mucho esta página.</p>
</aside>

Footer

Sintaxis

<footer>...</footer>

Ejemplo introductorio

<footer>
    <h4>Redes sociales</h4>
    <a href="#">Facebook</a>
    <a href="#">Twitter</a>
</footer>