Ejemplos de código HTML5

Volvemos de nuevo a conocer un poco más de código. En este caso, nuestra compañera Sulamita nos ilustra un poquito más sobre el fascinante mundo del HTML5.

Aquí vemos ejemplos rápidos sobre el uso de tags.

‘Header’ ayuda para crear el esquema del flujo de documentos dentro de la página:

<header>
    <h1>Title goes here</h1>
    <h2>And subtitle...</h2>
</header>


‘Nav’ define el área donde los enlaces de la página son los siguientes:

<nav><a href="/home/">Home</a> |
    <a href="/blog/">Blog</a> |
    <a href="/about/">About</a> |
    <a href="/contact/">Contact</a> |
</nav>

 

‘Article’ crea una sección significativa de las historias, también es útil para la distribución:

<article>
    <h1>Article</h1>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu diam magna...</p>
</article>

 

‘Figure’ define los elementos gráficos contenidos en el documento, y con la ayuda opcional de ‘figcaption’, podemos crear títulos:

<figure>
    <img src="funnycat.jpg" alt="I love cats.">
    <figcaption>Cat playing with toy</figcaption>
</figure>

 

‘Section’ es una sección genérica dentro del documento, con su propia estructura:

<section>
    <h1>Section</h1>
    <p>...angam maid ue essidnepsuS .tile gnicsipida rutetcesnoc ,tema tis rolod muspi meroL</p>
</section>

 

‘Aside’ es un parte importante pero no relacionada con la totalidad del contenido principal, si no alguna aclaración o complemento de la información, como notas al margen o archivos:

<aside>
    <h1>Archives</h1>
    <ul>
        <li>October 2011</li>
        <li>September 2011</li>
        <li>...</li>
    </ul>
</aside>

 

‘Footer’ representa un mensaje final, por lo general la información de copyright o contacto:

<footer>Foobar Inc </footer>

 

Artículo original disponible aquí.

 

Pour de plus amples informations sur les optimisations de compilation, consultez notre Avertissement concernant les optimisations.