Pie de página de un artículo HTML5

Ya hemos visto cómo podemos crear un pie de página de un documento HMTL5, pero mediante el elemento footer también podemos crear un pie de página de un artículo HTML5. Digamos que el funcionamiento es similar al que se hace mediante el elemento header el cual nos sirve para crear cabeceras de documentos y de artículos en HTML5.

Creando el elemento footer en un artículo

Lo primero que haremos para crear nuestro pie de página de un artículo HTML5 será crear el elemento footer en un artículo creado mediante un elemento article.

<article>
  <footer>
  </footer>
</article>

Añadiendo información al pie de página

En el pie de página del artículo podremos encontrar diferentes tipos de información. En nuestro caso lo que vamos a poner es la fecha de publicación del artículo y el autor del mismo. Para ello nos vamos a ayudar de un elemento time.

<article>
  <footer>
    Publicado el <time datetime="2011-10-30" pubdate>30 de octubre de 2011</time> por Víctor Cuervo
  </footer>
</article>

Artículo completo con header y footer

Con la combinación entre el elemento header para crear la cabecera de un artículo HTML5 y el elemento footer para definir un pie de página de un artículo HTML5, obtendríamos un artículo completo que quedaría de la siguiente forma:

<article>
  <header>
    <h1>Título del Artículo</h1>
  </header>
  <p>Contenido del artículo...</p>
  <footer>
    Publicado el <time datetime="2011-10-30" pubdate>30 de octubre de 2011</time> por Víctor Cuervo
  </footer>
</article>