Zum Inhalt springen

aside-Element

Männliche Person, frontal, schaut in die Kamera; trägt kariertes Hemd über dunkelfarbigem T‑Shirt; heller Innenraum mit unscharfem Monitor oder Poster links und Fenster rechts.

von Richard Albrecht am 18.10.2026

Das aside-Element steht für Inhalt, der mit dem Umgebenden nur lose zu tun hat: ein Kasten mit verwandten Beiträgen, eine Infobox, Werbung.

aside-Element

Bereich mit Inhalt, der mit dem umgebenden Inhalt nur am Rande zu tun hat und sich davon trennen ließe.
Beispiel: „Ein aside-Element steht oft seitlich, muss es aber nicht.“

Abgrenzung zur Seitenleiste: Die Seitenleiste ist eine Position im Layout, das aside-Element eine Aussage über den Inhalt. Ein aside kann auch unter dem Text stehen, und nicht alles in einer Seitenleiste ist ein aside.

Was hineingehört

Fünf ineinanderliegende Kästen: oben der header mit der nav darin, darunter links das main mit einem article und rechts daneben das aside, ganz unten der footer.
Der schmale Bereich rechts: verwandt, aber nicht Teil des Hauptinhalts.

Die Spezifikation spricht von Inhalt, der tangentially related ist, also nur locker verbunden. Dazu zählen eine Box mit verwandten Beiträgen, eine Autorenbox, ein Glossarkasten neben einem Fachtext, Werbung.

Nicht für Einschübe

Die Spezifikation sagt ausdrücklich: It's not appropriate to use the aside element just for parentheticals. Ein Nebensatz, eine Klammerbemerkung oder ein eingeschobener Hinweis bleiben im Textfluss, denn sie gehören dort hin.

Die Probe: Ließe sich der Inhalt entfernen, ohne dass der Haupttext unvollständig wird? Dann passt aside. Fehlt ohne ihn etwas, gehört er in den Fluss.

Die Lage ist nicht entscheidend

Der Name legt eine Seitenleiste nahe, das Element sagt aber nichts über die Position. Ein Kasten unter dem Artikel mit weiterführenden Links ist genauso ein aside wie eine Spalte daneben.

Siehe auch:

main-Element

Der Inhalt, für den die Seite da ist.

#Frontend-Entwicklung (HTML, CSS, JavaScript)

Sektion (Content-Bereich)

Abgegrenzter Abschnitt im Inhaltsbereich einer Seite, der ein Thema zusammenhält.

#Website-Struktur #Frontend-Entwicklung (HTML, CSS, JavaScript)

article-Element

Ein Inhalt, der für sich allein stehen könnte.

#Frontend-Entwicklung (HTML, CSS, JavaScript)

Semantisches HTML

Elemente nach ihrer Bedeutung wählen statt nach ihrem Aussehen.

#Frontend-Entwicklung (HTML, CSS, JavaScript)

Footer

Unterer Bereich einer Seite, der sich auf allen Seiten wiederholt und Pflichtangaben, Kontakt und weiterführende Links sammelt.

#Website-Struktur #Frontend-Entwicklung (HTML, CSS, JavaScript)