<article>: Das Artikelinhalts-Element

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Das <article>-Element in HTML repräsentiert eine eigenständige Zusammenstellung in einem Dokument, einer Seite, Anwendung oder Website, die eigenständig verteilt oder wiederverwendbar sein soll (z. B. in Syndikation). Beispiele hierfür sind: ein Forumsbeitrag, ein Magazin- oder Zeitungsartikel, ein Blogeintrag, eine Produktkarte, ein von Nutzern eingereichter Kommentar, ein interaktives Widget oder Gadget oder jedes andere unabhängige Inhaltselement.

Probieren Sie es aus

Ein bestimmtes Dokument kann mehrere Artikel enthalten; zum Beispiel auf einem Blog, der den Text jedes Artikels nacheinander zeigt, während der Leser scrollt, würde jeder Beitrag in einem <article>-Element enthalten sein, möglicherweise mit einem oder mehreren <section>-Elementen darin.

Attribute

Dieses Element umfasst nur die globalen Attribute.

Nutzungshinweise

  • Jedes <article> sollte identifiziert werden, typischerweise durch Einfügen einer Überschrift (<h1> - <h6> Element) als Kind des <article>-Elements.
  • Wenn ein <article>-Element verschachtelt ist, repräsentiert das innere Element einen Artikel, der mit dem äußeren Element in Zusammenhang steht. Zum Beispiel können die Kommentare zu einem Blogbeitrag in <article>-Elementen verschachtelt sein, die den Blogbeitrag repräsentieren.
  • Autoreninformationen eines <article>-Elements können durch das <address>-Element bereitgestellt werden, es gilt jedoch nicht für verschachtelte <article>-Elemente.
  • Das Veröffentlichungsdatum und die -zeit eines <article>-Elements können durch das datetime-Attribut eines <time>-Elements beschrieben werden.

Beispiele

html
<article class="film_review">
  <h2>Jurassic Park</h2>
  <section class="main_review">
    <h3>Review</h3>
    <p>Dinos were great!</p>
  </section>
  <section class="user_reviews">
    <h3>User reviews</h3>
    <article class="user_review">
      <h4>Too scary!</h4>
      <p>Way too scary for me.</p>
      <footer>
        <p>
          Posted on
          <time datetime="2015-05-16 19:00">May 16</time>
          by Lisa.
        </p>
      </footer>
    </article>
    <article class="user_review">
      <h4>Love the dinos!</h4>
      <p>I agree, dinos are my favorite.</p>
      <footer>
        <p>
          Posted on
          <time datetime="2015-05-17 19:00">May 17</time>
          by Tom.
        </p>
      </footer>
    </article>
  </section>
  <footer>
    <p>
      Posted on
      <time datetime="2015-05-15 19:00">May 15</time>
      by Staff.
    </p>
  </footer>
</article>

Ergebnis

Technische Zusammenfassung

Inhaltskategorien Flussinhalt, Gliederungsinhalt, griffiger Inhalt
Erlaubter Inhalt Flussinhalt.
Tag-Auslassung Keine, sowohl der Start- als auch der End-Tag sind obligatorisch.
Erlaubte Eltern Jedes Element, das Flussinhalt akzeptiert. Beachten Sie, dass ein <article>-Element kein Nachkomme eines <address>-Elements sein darf.
Implizierte ARIA-Rolle article
Erlaubte ARIA-Rollen application, document, feed, main, none, presentation, region
DOM-Schnittstelle [`HTMLElement`](/de/docs/Web/API/HTMLElement)

Spezifikationen

Specification
HTML Standard
# the-article-element

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch