<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
# the-article-element

Browser-Kompatibilität

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
article

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

Siehe auch