Das figure-Element fasst einen Inhalt zusammen, auf den der Text verweist und der als Einheit verschoben werden könnte: eine Abbildung, ein Diagramm, ein Codebeispiel.
- figure
Bereich für einen in sich geschlossenen Inhalt mit optionaler Beschriftung, auf den der Text Bezug nimmt.
Beispiel: „Ein figure-Element lässt sich verschieben, ohne dass der Text unverständlich wird.“
Wofür es gedacht ist
Die Spezifikation beschreibt es als some flow content, optionally with a caption, that is self-contained. Gemeint ist der Inhalt, auf den ein Text verweist, ohne dass dessen genaue Position zählt: Abbildungen, Diagramme, Codebeispiele, auch ein längeres Zitat.
<figure>
<img src="/bilder/aufbau.svg" alt="…">
<figcaption>Der Aufbau im Überblick</figcaption>
</figure>Wann es sich lohnt
Ein Bild im Fließtext braucht kein figure. Sobald eine sichtbare Beschriftung dazugehört oder der Text auf die Abbildung verweist, gewinnt die Auszeichnung: Sie verbindet Bild und Beschriftung zu einer Einheit, auch für Hilfsmittel.
Die Beschriftung kommt mit figcaption und steht als erstes oder letztes Kind, nicht dazwischen.
Nicht jedes Bild ist eine Abbildung
Ein Logo im Kopfbereich, ein Symbol in einem Knopf oder ein Hintergrundbild sind keine Abbildungen in diesem Sinn. Sie gehören ohne figure in den Inhalt, dekoratives sogar ganz ins Stylesheet.