<article>: El elemento con contendio del artículo

El Elemento de HTML <article> representa una composición auto-contenida en un documento, una página, una aplicación o en un sitio, que se quiere que sea distribuíble y/o reutilizable de manera independiente, por ejemplo, en la redifusión. Algunos ejemplos podrían ser un mensaje en un foro, un artículo de una revista o un periódico, una entrada de blog, el comentario de un usuario, un widget o gadget interactivo, o cualquier otro elemento de contenido independiente.

Pruébalo

Un mismo documento puede tener varios artículos; por ejemplo, en un blog en el que se que muestran distintos mensajes a medida que el usuario va navegando, cada mensaje estaría en un elemento <article>, posiblemente con uno o más elemenentos <section> dentro.

Categorías de contenido Contenido de flujo, contenido de sección, contenido palpable.
Contenido permitido Contenido de flujo.
Omisión de etiquetas Ninguna, tanto la etiqueta de apertura como la de cierre son obligatorias.
Padres permitidos Todo elemento que permita contenido de flujo. Un elemento <article> no puede ser hijo de un elemento <address>.
Rol ARIA implícito article (en-US) (en-US)
Roles ARIA permitidos application, document, feed, main, none, presentation, region.
Interfaz DOM HTMLElement.

Atributos

Este elemento solo incluye los atributos globales.

Notas de uso

  • Cada <article> debe ser identificado, normalmente con un elemento de encabezado (elementos <h1> - <h6>) como hijo.
  • Cuando un <article> está incorporado dentro de otro, representa un artículo cuyo contenido está relacionado con el artículo que lo anida. Por ejemplo, un comentario en una entrada de blog puede ser un <article> dentro de otro <article> que representa la propia entrada del blog.
  • La información del autor de un <article> se pueden proporcionar mediante el elemento <address>, pero esto no se aplica a los artículos anidados dentro de otros.
  • La fecha y momento de publicación de un elemento <article> pueden ser declarados mediante el atributo datetime de un elemento <time>.

Ejemplo

html

<article class="film_review">
  <h2>Jurassic Park</h2>
  <section class="main_review">
    <h3>Reseña</h3>
    <p>¡Los dinosaurios estuvieron genial!</p>
  </section>
  <section class="user_reviews">
    <h3>Reseñas de usuarios</h3>
    <article class="user_review">
      <h4>¡Demasiado aterrador!</h4>
      <p>Demasiado aterradores para mí</p>
      <footer>
        <p>
          Publicado el
          <time datetime="2015-05-16 19:00">16 de mayo</time>
          por Lisa.
        </p>
      </footer>
    </article>
    <article class="user_review">
      <h4>¡Amo a los dinos!</h4>
      <p>Estoy de acuerdo, los dinosaurios son mis favoritos.</p>
      <footer>
        <p>
          Publicado el
          <time datetime="2015-05-17 19:00">17 de mayo</time>
          por Tom.
        </p>
      </footer>
    </article>
  </section>
  <footer>
    <p>
      Publicado el
      <time datetime="2015-05-15 19:00">15 de mayo</time>
      por Staff.
    </p>
  </footer>
</article>

Especificaciones

Specification
HTML Standard
# the-article-element

Compatibilidad con navegadores

BCD tables only load in the browser

Véase también