Artículos
HTML5

Fecha de publicación de un artículo en HTML5

18/Oct/2012

De una forma muy sencilla hemos visto como podemos identificar la fecha de publicación de un documento con HTML5. Para ello simplemente nos hemos tenido que apoyar en el atributo pubdate del elemento time de HTML5.

<time datetime="2012-10-16T09:00">16 de octubre de 2012 a las 9h</time>

En estos casos, al utilizar el atributo pubdate, dicho atributo aplicará al elemento inmediatamente superior que contenga al elemento time. Así, en el caso de la identificación de la fecha de publicación de un documento lo hacíamos a nivel del documento.

Pero en HTML5 aparecen otros elementos que nos permiten dar semántica a la estructura de los documentos web. Uno de ellos es el elemento article. Dentro de un elemento article podemos recoger toda información relativa a un artículo. Lo que, por ejemplo en un blog, vendría a ser una entrada o post.

De esta forma podemos asignar una fecha diferente a la publicación de un artículo en nuestra web, el truco consiste en asignar el elemento time, con su respectivo atributo pubdate, a un elemento article.

<article>
  <header>
    <h1>Artículo 1 - Presentación</h1>
    Publicado el <time datetime="2012-10-15T12:00">15 de octubre de 2012 a las 12h</time> por <a href="#">Autor 1</a>
  </header>
  En un lugar de la Mancha, de cuyo nombre no quiero acordarme...
</article>

Así, cada uno de los artículos que tengamos en nuestra página (o entradas de nuestro blog) puede tener una fecha de publicación diferente.

<article>
  <header>
    <h1>Artículo 1 - Presentación</h1>
    Publicado el <time datetime="2012-10-15T12:00">15 de octubre de 2012 a las 12h</time> por <a href="#">Autor 1</a>
  </header>
  En un lugar de la Mancha, de cuyo nombre no quiero acordarme...
</article>
<article>
  <header>
    <h1>Artículo 2 - Detalles</h1>
    Publicado el <time datetime="2012-10-16T09:00">16 de octubre de 2012 a las 9h</time> por <a href="#">Autor 2</a>
  </header>
  Es, pues, de saber que este sobredicho hidalgo, los ratos que estaba ocioso,....
</article>

 

Incluso, a nivel de documento podemos seguir teniendo una fecha de publicación del documento.

Vídeos sobre HTML5

Disfruta también de nuestros artículos sobre HTML5 en formato vídeo. Aprovecha y suscribete a nuestro canal.

Test HTML5

¿Te atreves a probar tus habilidades y conocimiento en HTML5 con nuestro test?

Test HTML5
Suscribir
Notificar de
guest
7 Comentarios
Recientes
Anteriores Más votados
Opiniones integradas
Ver todos los comentarios