iframe ohne Titel (frame-title)

Die Regel frame-title meldet ein <iframe> (oder <frame>) ohne zugänglichen Namen. Ein Screenreader hat dann nichts Verlässliches anzusagen – je nach Software hört man nur „Frame“, eine Webadresse oder den Titel, den das eingebettete Dokument zufällig hat –, und niemand kann eine Karte von einem Video oder einer Werbung unterscheiden, bevor er hineingeht. Die Lösung ist ein kurzes, beschreibendes title-Attribut: <iframe title="Karte: unser Büro in Berlin" …>.

Was die Regel bedeutet

Ein iframe ist ein eigenes Dokument innerhalb der Seite. Hilfsmittel behandeln es als eigenen Bereich und brauchen einen Namen, um es anzusagen. WCAG 4.1.2 Name, Rolle, Wert verlangt, dass Bedienelemente einen Namen haben, den Software ermitteln kann; axe-core ordnet die Regel diesem Kriterium zu.

Die Regel ist erfüllt, wenn der Frame eines davon hat:

• ein nicht leeres title-Attribut – der übliche Weg;
• aria-label oder aria-labelledby, das auf sichtbaren Text verweist;
• role="presentation" oder role="none".

Nicht geprüft werden Frames mit negativem tabindex und Frames, die per CSS verborgen sind, etwa mit display: none.

Was die Regel nicht prüft: ob der Name den Inhalt beschreibt. title="iframe", title="Eingebetteter Inhalt" oder das allgemeine „YouTube video player“ aus einem kopierten Einbettungscode bestehen alle – aber keiner sagt, welches Video oder welche Karte sich dahinter verbirgt.

Wen es betrifft

Vor allem blinde Menschen mit Screenreader. Erreichen sie ein iframe, sagt der Screenreader dessen Namen an; manche Screenreader bieten zusätzlich eine Liste aller Frames der Seite. Ohne Namen klingt jede Einbettung gleich, und herauszufinden, was darin steckt, heißt: hineingehen und suchen. Ein fehlender Name kostet auf jeder Seite mit Einbettung Zeit.

Warum die Prüfung anschlägt

• Einbettungscodes von Karten-, Kalender-, Buchungs- oder Formulardiensten, die ohne title kommen.
• Einbettungsblöcke im CMS und Seitenbaukästen, die das Attribut entfernen oder nie ausgeben.
• Widgets von Drittanbietern – Chat, Bewertungen, Social-Feeds, Werbung –, die eigene iframes einfügen.
• Tracking- und Consent-iframes, die nichts zeigen, für Hilfsmittel aber trotzdem sichtbar sind.
• Alte Framesets in Intranets und Archiven.
• JavaScript, das iframes erzeugt, etwa nachgeladene Videoplayer, ohne einen Namen zu setzen.

So beheben Sie es

1. Geben Sie jedem sichtbaren iframe einen title, der sagt, was darin ist: „Karte: unser Büro in Berlin“, „Video: Wandhalterung montieren (3 Min.)“.
2. Ersetzen Sie allgemeine Namen aus Einbettungscodes – „YouTube video player“ – durch etwas Konkretes.
3. Frames, die für Menschen nichts enthalten, etwa Tracking-Pixel, verbergen Sie für alle (hidden oder display: none), statt einen Namen zu erfinden.
4. Bei Widgets von Drittanbietern, die Sie nicht ändern können, sprechen Sie den Anbieter an und dokumentieren den Befund mit Begründung.

<!-- Vorher: eingebettete Karte ohne Namen -->
<h2>So finden Sie uns</h2>
<iframe class="standort-karte" src="/einbettung/standort-karte.html"
        width="600" height="400" loading="lazy"></iframe>

<!-- Nachher: der Titel sagt, was der Frame enthält -->
<h2>So finden Sie uns</h2>
<iframe class="standort-karte" src="/einbettung/standort-karte.html"
        title="Karte: Büro der Beispiel GmbH, Berlin"
        width="600" height="400" loading="lazy"></iframe>

Der Titel darf die sichtbare Überschrift aufgreifen, sollte aber auch allein verständlich sein – Screenreader listen Frames mitunter ohne Zusammenhang auf.

So prüfen Sie es von Hand

1. Listen Sie in der Browserkonsole alle Frames mit ihrem Namen auf: [...document.querySelectorAll('iframe')].map(f => f.title). Ein leerer Text heißt: kein Titel.
2. Lesen Sie jeden Titel und fragen Sie sich: Wüsste ich, was darin ist, ohne es zu sehen?
3. Gehen Sie mit einem Screenreader (NVDA unter Windows, VoiceOver unter macOS) per Tab- oder Pfeiltaste zur Einbettung und hören Sie, was angesagt wird.
4. Prüfen Sie auch den Inhalt im Frame – die Buttons eines Videoplayers brauchen eigene Namen, und die werden im Frame geprüft, nicht von dieser Regel.

Zugehöriges WCAG-Kriterium

4.1.2 Name, Rolle, Wert, Stufe A. Verwandt: 2.4.1 Blöcke umgehen, weil benannte Frames helfen, Inhaltsblöcke zu überspringen, und 1.3.1 Info und Beziehungen.

So meldet Reviseberg diese Regel

Reviseberg führt frame-title auf jeder gecrawlten Seite bei 1280 px aus. Einbettungen im Header oder Footer – eine Karte, ein Chat-Widget – erscheinen auf jeder Seite; an der Zahl der Seiten erkennen Sie, ob ein Template oder ein einzelner Artikel die Ursache ist. In der Befundliste sehen Sie die Regel mit Schweregrad, WCAG-Kriterium 4.1.2 und Stufe, der Zahl der Elemente und Seiten und den Punkten, die ein Fix zurückbringt. Im Detail stehen der Selektor, der HTML-Ausschnitt mit der src des Frames und alle betroffenen Seiten. Bei einem Widget eines Drittanbieters, das Sie nicht ändern können, markieren Sie den Befund mit Begründung als „nicht behebbar“; „ignorieren“ und „Fehlalarm“ gibt es ebenfalls, und jede Entscheidung wird protokolliert.

Ob ein Titel seinen Frame tatsächlich beschreibt, entscheidet kein Crawl. Ohne Befund gilt 4.1.2 als teilweise geprüft, nicht als bestanden, bis ein Mensch ein manuelles Ergebnis erfasst.

Verwandte Regeln

• undefined – dasselbe Prinzip für die Seite selbst.
• undefined – Buttons ohne zugänglichen Namen, oft in eingebetteten Playern.
• undefined – Links ohne zugänglichen Namen.

Alle Einbettungen Ihrer Website prüfen – kostenloser Scan