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

18/Oct/2012 HTML5 , , 7 Comentarios

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.

  1. <time datetime="2012-10-16T09:00" pubdate="pubdate">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.

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

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

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

Difunde el Conocimiento

Si te ha gustado el artículo o te ha sido de utilidad, no dejes de compartirlo con tus amigos en las redes sociales... Te estaremos muy agradecidos. :-D

7 comentarios en “Fecha de publicación de un artículo en HTML5”

Víctor Cuervo

desarrollo de software bogota

SIRVE PARA QUE GOOGLE TOME LA FECHA

Víctor Cuervo

Roberto Ortiz

Muy buena informacion, me gusta mucho la manera en que abordaste el tema. He leido varias de tus entradas y me ha gustado. Saludos
http://www.noiasistemas.com.mx/

Víctor Cuervo

Víctor Cuervo

Muchas gracias por el comentario Roberto. Me alegra que te haya gustado. Saludos.

Víctor Cuervo

arkhej

Una pregunta, si lo que deseo es tener abajo de un articulo X una sección con los “artículos relacionados” como debería hacerse. En funsión de qué parametros podría obtenerlos.

Víctor Cuervo

Víctor Cuervo

Buenas,

En los sistemas de gestión de contenidos suelen mostrar los relacionados atendiendo a la categoría del artículo o a las etiquetas… Al fin y al cabo atendiendo a metainformación que haya sobre el artículo.

Si quieres montártelo tu deberás de crear esa información asociada al artículo o interpretar el contendio del artículo para auto-generar dicha información.

Saludos.

Víctor Cuervo

Jahiro

y si quiero que la fecha se me genere automáticamente si tener que ponerla manuel en html5 ?

Víctor Cuervo

Víctor Cuervo

Jahiro, En ese caso tienes que generar la fecha mediante algún lenguaje de servidor ya sea PHP, JSP, ASP.Net,… que te vuelquen la hora a la página web. Saludos.

¿Algo que nos quieras comentar?

Déjanos tu comentario, no te preocupes que tu email no será publicado

*

*