Praxisleitfaden Blinkenden Text vermeiden

Veraltetes Blink-HTML ersetzen

Den Hinweis erhalten, das blink-Element entfernen und die Korrektur nachprüfen.

blinkWCAG 2.2.2

Sehen Sie, was sich durch die Korrektur ändert.

Beispiel im Prüfbericht
Markierter Befund · Kritisch · WCAG 2.2.2Hinweis im blink-Element

Befund verstehen

Der Scanner erkennt das Element im HTML

Die Namensakte verwendet für „Blinkender Hinweis: Lesart ungeprüft“ das veraltete blink-Element. Der automatische Befund belegt diese Struktur. Er misst weder Blinkdauer noch Blinkfrequenz.

Warum das relevant ist

Tatsächlich blinkender Text kann vom Lesen und Ausfüllen ablenken. Im hier verwendeten Chromium erzeugt das alte Element allein keine Blinkbewegung; der HTML-Befund besteht trotzdem.

Befund im BeispielErkannter Befund

Scanner-Signal

Die Regel blink meldet das sichtbare blink-Element neben dem Feld „Importierter Suchname“.

Regel
blink
Referenz
WCAG 2.2.2

Kritisch fasst die Axe-Stufen critical und serious zusammen.

Diagnose am Hinweis
Element: <blink>
Text: Blinkender Hinweis: Lesart ungeprüft
blink: Verstoß (Axe-Auswirkung: serious)
Eine sichtbare Blinkbewegung wurde damit nicht nachgewiesen.

Braucht dieser Hinweis überhaupt Bewegung?

Der Bearbeitungsstatus bleibt als gewöhnlicher Text vollständig verständlich.

  • Statischer Status wie im Beispiel

    Die Aussage lautet lediglich, dass eine Lesart noch ungeprüft ist.

    Passende Umsetzung

    Ersetzen Sie blink durch span. Lassen Sie den Hinweis dauerhaft lesbar neben dem Suchfeld stehen.

  • Zusätzliche Animation in CSS oder JavaScript

    Der Hinweis wechselt tatsächlich zwischen sichtbaren Zuständen.

    Passende Umsetzung

    Prüfen Sie auch die auslösende Animation. Für diesen Status genügt eine ruhige Darstellung; ein anderes HTML-Element allein beendet einen separaten Effekt nicht.

  • Bewegung soll erhalten bleiben

    Automatische Bewegung dauert länger als fünf Sekunden und erscheint neben anderen Inhalten.

    Passende Umsetzung

    Nach WCAG 2.2.2 ist eine Möglichkeit zum Pausieren, Stoppen oder Ausblenden erforderlich, sofern die Bewegung nicht wesentlich ist. Prüfen Sie diese Ausnahme fachlich.

Fundstelle ansehen

Der Hinweis innerhalb der Namensakte

Der vollständige Abschnitt zeigt Überschrift, Suchfeld und weitere übernommene Eingaben. Die Markierung ordnet den betroffenen Hinweis diesem Arbeitskontext zu.

Der BefundHinweis im blink-Element

Die Aussage „Lesart ungeprüft“ steht neben dem importierten Suchnamen. Das Standbild zeigt ihre Position, kann aber keine Bewegung über die Zeit belegen. Vorher und nachher sieht der Text hier gleich aus; die nachgewiesene Änderung steht in der HTML-Diagnose.

Beispiel im Prüfbericht Markierter Befund
Markierter Befund · Kritisch · WCAG 2.2.2Hinweis im blink-Element

Element ersetzen

Den Text als span erhalten

Ersetzen Sie ausschließlich den blink-Umschlag durch ein gewöhnliches span-Element. Der Hinweistext bleibt vollständig erhalten. Die ID macht die korrigierte Stelle für den Re-Test eindeutig auffindbar.

Im CMS oder Template Öffnen Sie den HTML-Baustein der übernommenen Eingabekarte. Entfernen Sie das blink-Markup an seiner Quelle, damit es beim nächsten Rendern nicht erneut erscheint.

KorrekturvergleichHTML des Hinweises

Vorher

<blink>Blinkender Hinweis: Lesart ungeprüft</blink>

Nachher

<span id="lesart-hinweis">
  Blinkender Hinweis: Lesart ungeprüft
</span>

Markierte Zeilen wurden geändert

Änderung umsetzen

Inhalt und Darstellung getrennt prüfen

Ein wichtiger Status braucht eine verständliche Aussage und einen stabilen Platz.

  1. 1

    Suchen Sie die ausgebende Vorlage oder den gespeicherten HTML-Inhalt, nicht nur die aktuelle Browserdarstellung.

  2. 2

    Erhalten Sie beim Elementtausch den vollständigen Text und die Position neben dem Suchfeld.

  3. 3

    Prüfen Sie vorhandene CSS-Selektoren für blink: Übertragen Sie benötigte statische Gestaltung gezielt auf eine Klasse.

  4. 4

    Suchen Sie nach zusätzlichen Animationen und zeitgesteuerten Sichtbarkeitswechseln, wenn die veröffentlichte Seite tatsächlich blinkt.

Fehlversuche vermeiden

Was eine belastbare Korrektur verhindert

Den Hinweis ausblenden

display: none entfernt auch die Statusinformation aus der Nutzung. Der Hinweis soll erhalten bleiben; getauscht wird das veraltete Element.

Den Blinkeffekt mit CSS nachbauen

Die Regel blink kann nach dem Elementtausch verschwinden, während eine CSS-Animation weiter ablenkt. Prüfen Sie das tatsächliche Verhalten zusätzlich.

Ein Standbild als Bewegungsnachweis lesen

Weder Markierung noch unveränderte Pixel zeigen, ob Text blinkt. Dafür müssen Sie die laufende Seite beobachten.

Blinken mit Blitzen gleichsetzen

Schnelle Lichtwechsel betreffen zusätzlich andere Anforderungen. Eine behobene blink-Meldung bewertet keine Blitzfrequenz oder Lichtintensität.

Element entfernt, Hinweis erhalten

Die erneute Prüfung findet das ursprüngliche blink-Element nicht mehr. Das sichtbare span enthält denselben Hinweistext; am Ersatz gibt es keinen blink-Verstoß. Die unmarkierten Aufnahmen sind pixelgleich.

So prüfen Sie die Korrektur nach

  • Auf der veröffentlichten Seite prüfen, dass #lesart-hinweis ein span mit dem vollständigen Hinweistext ist.
  • Die Regel blink erneut ausführen und weitere Fundstellen getrennt bearbeiten.
  • Die laufende Darstellung einschließlich später geladener Zustände auf zusätzliche Bewegung prüfen.

Bestätigt ist die Entfernung dieses blink-Elements. Das Ergebnis belegt weder die vollständige Erfüllung von WCAG 2.2.2 noch die Barrierefreiheit der übrigen Eingabekarte.

Beispiel im Prüfbericht Gelöst
GelöstVeraltetes Element entferntDas alte Element ist entfernt; der Ersatztext ist erhalten und löst die Regel blink nicht aus. Eine Bewegungsprüfung ist damit nicht ersetzt.
Verifizierte Änderung
Vorher: <blink> mit blink-Verstoß
Nachher: <span id="lesart-hinweis"> mit unverändertem Text
Ursprüngliches Element: entfernt
Regel am Ersatz: nicht anwendbar
CSS-Animation am Ersatz: keine

Prüfumfang abgrenzen

HTML erkennen, Bewegung gesondert beurteilen

Die Regel blink ist ein gezielter Strukturtest, kein vollständiger Bewegungstest.

Automatisch prüfbar

  • Das sichtbare veraltete blink-Element im gerenderten Dokument erkennen.
  • Den betroffenen Hinweis einer Fundstelle zuordnen.
  • Die Entfernung und den erhaltenen Ersatztext im gezeigten Beispiel nachprüfen.

Im Kontext zu entscheiden

  • Beobachten, ob CSS, JavaScript, Videos oder Grafiken tatsächlich blinken oder andere Bewegung erzeugen.
  • Start, Dauer, parallelen Inhalt und die Bedienbarkeit einer Pausen- oder Stoppfunktion beurteilen.
  • Bei schnellen Lichtwechseln auch die Anforderungen zum Schutz vor Blitzen gesondert prüfen.

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.