Warum braucht ein iframe einen Titel?

Ein iframe bettet ein ganzes eigenes Dokument ein. Sehende Nutzer erhalten visuellen Kontext; Screenreader-Nutzer nur dann, wenn der `title` benennt, was der Rahmen enthält – sonst wird er als unerklärter Bereich angesagt.

Was ist ein guter iframe-Titel?

Eine kurze, konkrete Beschreibung des Zwecks – Benennung des Videos, des Kartenausschnitts oder des Widgets. Vermeiden Sie generische Werte wie das Wort iframe oder einen reinen Dateinamen.

Welche WCAG-Regel gilt für iframe-Titel?

SC 4.1.2 (Name, Rolle, Wert), Stufe A, ergänzend auch 2.4.1 (Blöcke umgehen). axe-core meldet es als `frame-title`.

Häufige Verstöße

Fehlende iframe-Titel: Eingebettete Inhalte benennen

Ein <iframe> bettet ein komplettes separates Dokument in die aktuelle Seite ein – ein YouTube-Video, eine Karte, ein Zahlungsformular, ein Chat-Widget. Sehende Nutzer erhalten visuellen Kontext kostenlos: das Video-Thumbnail, den Standort-Pin der Karte. Ein Screenreader-Nutzer erhält nichts davon, es sei denn, das iframe selbst ist benannt, und ohne ein title-Attribut wird es als etwas wie "iframe" angekündigt, ohne jeden Hinweis darauf, was sich darin befindet.

Dies fällt unter WCAG-Erfolgskriterium 4.1.2 (Name, Rolle, Wert) und 2.4.1 (Bereiche überspringen) – ein unbeschriftetes iframe ist sowohl nicht identifiziert als auch, da es oft ein großer eingebetteter Block ist, selbst ein Navigationshindernis.

Die Lösung

Fügen Sie ein title-Attribut hinzu, das beschreibt, was der eingebettete Inhalt tatsächlich ist:

<!-- Vorher -->
<iframe src="https://www.youtube.com/embed/xyz"></iframe>

<!-- Nachher -->
<iframe
  src="https://www.youtube.com/embed/xyz"
  title="Produkt-Demovideo: Ihren ersten Scan einrichten"
></iframe>

Der Titel sollte den Inhalt oder Zweck des Embeds beschreiben, nicht nur generischen Standardtext wie "eingebetteter Inhalt" oder "iframe" wiederholen – das erfüllt technisch den Wortlaut der Regel, liefert aber keinen der tatsächlichen Kontext, für den das Kriterium existiert.

<!-- Hat technisch einen Titel, sagt dem Nutzer aber nichts -->
<iframe src="..." title="iframe"></iframe>

<!-- Tatsächlich nützlich -->
<iframe src="..." title="Karte mit Filialstandort"></iframe>

Wo dies leicht übersehen wird

Drittanbieter-Embed-Widgets (Karten, Zahlungsanbieter, Chat-/Support-Werkzeuge, Videoplayer) werden häufig standardmäßig ohne Titel im Beispiel-Embed-Code ausgeliefert – der Copy-Paste-Schnipsel des Anbieters ist oft die tatsächliche Quelle des Verstoßes, nicht etwas intern Geschriebenes. Fügen Sie das title-Attribut nach dem Einfügen eines Drittanbieter-Embed-Schnipsels immer hinzu oder überschreiben Sie es, und prüfen Sie es erneut, wenn der Anbieter seinen Embed-Code bei einem Integrations-Update ändert.

Verschachtelte/namenlose iframes, die rein für Layout-Tricks verwendet werden (ein alter Anzeigenplatz, eine Legacy-Cross-Domain-Umgehung), sind die andere häufige Quelle – wenn das iframe tatsächlich keinen bedeutsamen Inhalt für irgendeinen Nutzer trägt, überlegen Sie, ob es vollständig entfernt werden kann, statt es nur zu beschriften.

Offizielle Referenzen

Häufige Fragen

Warum braucht ein iframe einen Titel?: Ein iframe bettet ein ganzes eigenes Dokument ein. Sehende Nutzer erhalten visuellen Kontext; Screenreader-Nutzer nur dann, wenn der `title` benennt, was der Rahmen enthält – sonst wird er als unerklärter Bereich angesagt.
Was ist ein guter iframe-Titel?: Eine kurze, konkrete Beschreibung des Zwecks – Benennung des Videos, des Kartenausschnitts oder des Widgets. Vermeiden Sie generische Werte wie das Wort iframe oder einen reinen Dateinamen.
Welche WCAG-Regel gilt für iframe-Titel?: SC 4.1.2 (Name, Rolle, Wert), Stufe A, ergänzend auch 2.4.1 (Blöcke umgehen). axe-core meldet es als `frame-title`.