Praxisleitfaden Frame-Titel prüfen

Frames gezielt unterscheiden

Doppelte Titel erkennen, Inhalte vergleichen und Einbettungen treffend benennen.

frame-title-uniqueWCAG 4.1.2

Sehen Sie, was sich durch die Korrektur ändert.

Beispiel im Prüfbericht
Manueller Prüfhinweis · Manuell prüfen · WCAG 4.1.2Gleicher Titel für zwei Folgen

Prüfhinweis einordnen

Zwei Inhalte tragen denselben Titel

Die Zeitstudie enthält ein Taktblatt mit „Erste Folge“ und ein weiteres mit „Zweite Folge“. Beide haben denselben title-Wert. Axe erkennt die Wiederholung, entscheidet aber nicht, ob die Inhalte denselben Zweck erfüllen.

Warum das relevant ist

Wer über die Frame-Navigation eines Screenreaders ein bestimmtes Blatt sucht, erhält aus „Doppeltes Taktblatt“ keine Unterscheidung. Beide Frames müssen erst geöffnet werden, um die Folge zu erkennen.

Befund im BeispielManueller Prüfkandidat

Scanner-Signal

frame-title-unique meldet am dritten iframe im Abschnitt zeitstudie-alt-title einen manuellen Prüfkandidaten: title="Doppeltes Taktblatt" kommt erneut vor.

Regel
frame-title-unique
Referenz
WCAG 4.1.2

Kritisch fasst die Axe-Stufen critical und serious zusammen.

Vorher: Titel und tatsächlicher Inhalt
Frame 3: title="Doppeltes Taktblatt" → Inhalt: Erste Folge
Frame 4: title="Doppeltes Taktblatt" → Inhalt: Zweite Folge
unique-frame-title am Frame 3: incomplete (Axe-Auswirkung: serious)

Gleiche Frame-Titel inhaltlich vergleichen

Vergleichen Sie Inhalt und Zweck gleich benannter Einbettungen, bevor Sie ihre Titel unterscheiden.

Rechenbeispiel · Gleiche Frame-Titel

Ihre Annahmen für die manuelle Prüfung

Ganze Zahl von 1 bis 10.000.

Ganze Zahl von 1 bis 120.

5 Seiten × 8 Minuten pro Seite40 Minuten40 Min. manuelle Prüfzeit unter diesen Annahmen.
  • Annahme: zwei gleich benannte Frames je Seite.
  • Annahme: acht Minuten je Seite für Inhaltsvergleich und Frame-Navigation.
  • Titeländerung und Prüfung eingebetteter Anwendungen sind nicht enthalten.

Das ist keine gemessene Prüfzeit und kein Vergleich mit der Scanner-Geschwindigkeit. Inhaltliche Beurteilungen bleiben manuelle Arbeit.

Brauchen die Frames verschiedene Namen?

Entscheidend ist, welche Inhalte Menschen anhand der Bezeichnungen auswählen sollen.

Umsetzungen im Vergleich
FallWann trifft er zu?Passende Umsetzung
Unterschiedliche InhalteDie Frames enthalten verschiedene Ziele, Dokumente oder Folgen, die gezielt erreichbar sein sollen. Benennen Sie den Unterschied im Titel. Hier passen „Taktblatt: Erste Folge“ und „Taktblatt: Zweite Folge“ zum jeweiligen Inhalt.
Gleicher oder gleichwertiger ZweckMehrere Einbettungen zeigen dieselbe Ressource oder erfüllen im Kontext einen gleichwertigen Zweck. Gleiche Namen sind dann nicht automatisch falsch. Prüfen und dokumentieren Sie die inhaltliche Gleichwertigkeit, bevor Sie nur für den Scanner umbenennen.
Wechselnde EinbettungEin Widget lädt je nach Auswahl einen anderen Standort, Film oder Bericht. Prüfen Sie Titel und Inhalt in den relevanten Zuständen gemeinsam und aktualisieren Sie die Beschriftung bei einem Bedeutungswechsel.

Kontext ansehen

Beide Taktblätter bleiben im Bild

Der vollständige Abschnitt „Import aus einer alten Zeitstudie“ zeigt die benachbarten Einbettungen mit ihren sichtbaren Texten. Die Markierung gehört zur ersten der beiden Folgen; der Titelvergleich steht zusätzlich als Text unter dem Befund.

Der BefundGleicher Titel für zwei Folgen

„Erste Folge“ und „Zweite Folge“ stehen sichtbar nebeneinander. Ihre identischen Frame-Titel sind im Screenshot selbst nicht ablesbar. Genau diese unsichtbare Doppelung löst den Prüfhinweis aus.

Beispiel im Prüfbericht Manuell nachprüfen
Manueller Prüfhinweis · Manuell prüfen · WCAG 4.1.2Gleicher Titel für zwei Folgen

Titel korrigieren

Die vorhandenen Folgen im Titel benennen

Beide iframe-Elemente erhalten einen Titel, der den eingebetteten Text aufgreift. Die Inhalte und das Layout bleiben unverändert. Die Bezeichnungen sind ein Korrekturbeispiel, dessen Eignung in der Frame-Navigation manuell zu prüfen ist.

Im CMS oder Widget Ändern Sie das Feld für den Titel der Einbettung und kontrollieren Sie das gerenderte iframe. Ein interner Komponentenname ist nicht zwingend dessen zugängliche Beschriftung.

KorrekturvergleichHTML der beiden Taktblätter

Vorher

<iframe title="Doppeltes Taktblatt"
  srcdoc="<p>Erste Folge</p>"></iframe>
<iframe title="Doppeltes Taktblatt"
  srcdoc="<p>Zweite Folge</p>"></iframe>

Nachher

<iframe title="Taktblatt: Erste Folge"
  srcdoc="<p>Erste Folge</p>"></iframe>
<iframe title="Taktblatt: Zweite Folge"
  srcdoc="<p>Zweite Folge</p>"></iframe>

Markierte Zeilen wurden geändert

Umsetzung absichern

Titel an Inhalt und Nutzung koppeln

Die Beschriftung soll vor dem Betreten einer Einbettung eine sinnvolle Auswahl ermöglichen.

  1. 1

    Öffnen Sie jede betroffene Einbettung und bestimmen Sie ihren tatsächlichen Inhalt und Zweck.

  2. 2

    Verwenden Sie eine knappe Bezeichnung mit dem relevanten Unterschied, etwa Folge, Standort oder Dokumentname.

  3. 3

    Prüfen Sie im Accessibility Tree den wirksamen Namen, besonders wenn zusätzlich aria-label oder aria-labelledby gesetzt ist.

  4. 4

    Pflegen Sie den Titel am iframe im einbettenden Dokument. Der Dokumenttitel innerhalb des Frames hat eine eigene Aufgabe.

  5. 5

    Kontrollieren Sie dynamisch erzeugte und mehrfach verwendete Widgets nach dem vollständigen Laden erneut.

Fehlkorrekturen vermeiden

Eindeutigkeit allein erklärt keinen Inhalt

Zufällige Nummern anhängen

„Frame 928“ und „Frame 929“ unterscheiden Zeichenfolgen, erklären aber keine Inhalte. „Erste Folge“ und „Zweite Folge“ beziehen sich hier auf die vorhandenen Texte.

Nur id oder name ändern

Technische Kennungen ersetzen die Frame-Beschriftung nicht. Im Beispiel muss sich der title-Wert ändern.

Jede Wiederholung zum Fehler erklären

Wiederholte Titel können bei gleichen oder gleichwertigen Ressourcen sinnvoll sein. Die Meldung verlangt den Inhaltsvergleich, keine pauschale Umbenennung.

Die Reparatur am Screenshot ablesen

Ein geänderter title-Wert verändert die Darstellung der Folge nicht. Prüfen Sie die Beschriftung technisch und anschließend mit assistiver Technik.

Titel geändert, fachliche Prüfung bleibt offen

Die Aufnahme bestätigt beide neuen title-Werte bei unverändertem Frame-Inhalt. Axe erkennt am ausgewählten Frame keine Titelwiederholung mehr. Ob beide Namen die Auswahl verständlich machen, bleibt eine manuelle Prüfung.

Im Beispiel dokumentiert

Korrekturbeispiel · Manuell nachprüfen

Die Titel lauten jetzt „Taktblatt: Erste Folge“ und „Taktblatt: Zweite Folge“. Die sichtbaren Frame-Inhalte sind unverändert.

Was Sie zusätzlich beurteilen müssen

Das Beispiel belegt die Titeländerung an diesen beiden Frames. Es dokumentiert keinen abgeschlossenen Screenreader-Test und keinen Nachweis vollständiger WCAG-Konformität.

Der Scanner vergleicht Titel, Menschen beurteilen ihren Zweck

Prüfauftrag für Ihre Umsetzung

  • Vergleichen Sie die geladenen Inhalte mit „Taktblatt: Erste Folge“ und „Taktblatt: Zweite Folge“.
  • Rufen Sie die Frame-Navigation eines Screenreaders auf und wählen Sie jede Folge anhand ihres Namens aus.
  • Prüfen Sie, ob nach dem Betreten tatsächlich die angekündigte Folge erscheint.
  • Führen Sie den Scan nach Veröffentlichung erneut aus und beurteilen Sie verbleibende gleiche Namen im jeweiligen Kontext.
Beispiel im Prüfbericht Manuell nachprüfen
Korrekturbeispiel · Manuell nachprüfenBeide Folgen im Titel benanntManuell prüfen, ob sich beide Folgen in der Screenreader-Navigation anhand ihrer Namen auswählen lassen und den angekündigten Inhalt zeigen.
Nachher: nachgewiesene Änderung und offene Prüfung
Frame 3: title="Taktblatt: Erste Folge" → Inhalt: Erste Folge
Frame 4: title="Taktblatt: Zweite Folge" → Inhalt: Zweite Folge
Axe am Frame 3: Titelwiederholung nicht mehr gemeldet
Offen: verständliche Auswahl und passender Inhalt in der Screenreader-Navigation

Prüfgrenzen kennen

Der Scanner vergleicht Titel, Menschen beurteilen ihren Zweck

frame-title-unique liefert einen Ausgangspunkt für die Prüfung benachbarter Einbettungen.

Automatisch prüfbar

  • Wiederholte title-Werte an den geprüften Frames erkennen
  • Den betroffenen Frame und seinen HTML-Ausschnitt zuordnen
  • Nach einer Änderung erneut auf Titelwiederholung prüfen

Im Kontext zu entscheiden

  • Gleiche oder gleichwertige Inhalte von tatsächlich verschiedenen Zielen unterscheiden
  • Die Verständlichkeit der Namen in der Frame-Navigation beurteilen
  • Wechselnde Inhalte und Einbettungen in weiteren Zuständen prüfen
  • Barrieren innerhalb eines Frames und dessen Tastaturbedienung gesondert untersuchen

Werbung

Kostenloser Website-Barrierefreiheits-Check

Website auf Barrierefreiheit prüfen.

Technische WCAG-Warnsignale erkennen. Kritische Stellen zuerst prüfen.

Der Website-Check ist bereit.

Werbung

Ein letzter Schritt

Prüfen, bevor Sie gehen.

Finden Sie automatisch erkennbare Barrieren auf Ihrer eigenen Website.

Website prüfen

Kostenlos starten · keine Installation

Automatisches Screening. Tastaturbedienung und Screenreader bleiben manuelle Prüfung.