4.1.3 Status Messages

1. Was ist das Ziel dieses Kriteriums?

Du kennst das: Du füllst ein Online-Formular aus, klickst auf "Senden" – und plötzlich erscheint oben auf der Seite "Erfolgreich übermittelt!". Oder du suchst nach einem Produkt und siehst "5 Ergebnisse gefunden". Für sehende Nutzer sind solche Status-Updates selbstverständlich. Aber was ist mit Menschen, die einen Screenreader verwenden?

Das Ziel von Erfolgskriterium 4.1.3 der WCAG ist klar: Wichtige Status-Nachrichten müssen auch für Nutzer assistiver Technologien erkennbar und hörbar werden – ohne dass sie dabei den Fokus erhalten oder die aktuelle Arbeit unterbrechen.

Kurz gesagt: Wenn sich der Status einer Anwendung ändert, sollen alle Nutzer davon erfahren – nicht nur die, die es sehen können.

2. Was fordert das Erfolgskriterium genau?

Ganz konkret geht es um Status-Nachrichten – also Inhalte, die Nutzer über Ergebnisse, Fortschritte oder Fehler informieren, ohne den Fokus zu verändern.

Status-Nachrichten müssen programmatisch erkennbar sein über entsprechende ARIA-Rollen oder -Eigenschaften, damit Screenreader sie automatisch vorlesen können.

Zwei Kriterien definieren eine Status-Nachricht:

• Die Nachricht informiert über Erfolg/Ergebnis einer Aktion, Wartezustand, Fortschritt oder Fehler
• Die Nachricht wird angezeigt, ohne den Kontext zu ändern (kein Dialog, kein Fokus-Wechsel)

Typische Beispiele für Status-Nachrichten:

• "5 Suchergebnisse gefunden"
• "Artikel zum Warenkorb hinzugefügt"
• "Formular erfolgreich übermittelt"
• "Ungültige Eingabe in Postleitzahl"
• "Anwendung ist beschäftigt"
• "Upload bei 75% abgeschlossen"

Keine Status-Nachrichten sind:

• Suchergebnisse selbst (nur die Anzahl ist eine Status-Nachricht)
• Dialoge oder Pop-ups, die den Fokus erhalten
• Aufklappbare Menüs oder Accordion-Bereiche
• Neue Inhalte, die durch Kontextwechsel hinzugefügt werden

Level AA: Dieses Kriterium ist Teil der AA-Konformitätsstufe.

3. Warum ist das wichtig für Barrierefreiheit?

Stell dir vor, du sitzt vor deinem Computer, hörst aber nur über Kopfhörer, was der Screenreader vorliest. Du suchst nach einem Produkt, drückst Enter – und dann? Stille. Du weißt nicht, ob die Suche läuft, ob Ergebnisse gefunden wurden, oder ob ein Fehler aufgetreten ist.

Status-Nachrichten schaffen Barrierefreiheit, weil sie:

• Blinden und sehbehinderten Nutzern dieselben Informationen liefern wie sehenden Nutzern
• Feedback über Aktionen geben, ohne die aktuelle Arbeit zu unterbrechen
• Menschen mit kognitiven Einschränkungen helfen, den aktuellen Zustand einer Anwendung zu verstehen
• Klarheit über Erfolg oder Misserfolg von Aktionen schaffen
• Den Arbeitsfluss verbessern, indem Nutzer wissen, wann sie weitermachen können

Und nicht zuletzt: Sie schaffen Vertrauen in die Anwendung, weil Nutzer immer wissen, was gerade passiert.

4. So setzt du das Kriterium erfolgreich um

Die gute Nachricht: Die technische Umsetzung ist meist einfach – ARIA macht's möglich. Hier die bewährtesten Praxis-Tipps:

Für Erfolgs- und Ergebnis-Nachrichten:

• Verwende role="status" für höfliche, nicht-unterbrechende Meldungen
• Ideal für: Bestätigungen, Anzahl der Suchergebnisse, Warenkorb-Updates
• Beispiel: <div role="status">Artikel hinzugefügt</div>

Für Warnungen und Fehler:

• Verwende role="alert" für wichtige, sofortige Meldungen
• Ideal für: Formulare-Fehler, kritische Systemmeldungen
• Beispiel: <div role="alert">Ungültige E-Mail-Adresse</div>

Für Fortschritts-Updates:

• Verwende role="log" für sich wiederholende Updates
• Oder nutze role="progressbar" mit entsprechenden Attributen
• Ideal für: Upload-Status, mehrstufige Prozesse

Weitere Praxis-Tipps:

• Setze die Rolle VOR der Änderung des Inhalts – nicht danach
• Verwende aria-atomic="true" wenn der gesamte Text vorgelesen werden soll
• Nutze aria-live="polite" oder aria-live="assertive" als Alternative zu Rollen
• Halte Status-Nachrichten kurz und prägnant
• Teste immer mit echten Screenreadern (NVDA, JAWS, VoiceOver)

Was du vermeiden solltest:

• Status-Nachrichten nur visuell anzeigen, ohne ARIA-Markup
• role="alert" für unwichtige Meldungen verwenden (macht Anwendungen zu "geschwätzig")
• Rollen nach der Inhaltsänderung setzen (wird nicht erkannt)

5. Warum dieses Erfolgskriterium für Unternehmen relevant ist

Auch bei Erfolgskriterium 4.1.3 gilt: Barrierefreiheit ist kein Selbstzweck – sondern bringt handfeste Vorteile für dein Business.

1. Benutzererfahrung für alle verbessern

Status-Nachrichten machen deine Anwendung für jeden nutzbarer. Auch sehende Nutzer profitieren von klaren, eindeutigen Rückmeldungen. Gute Status-Nachrichten reduzieren Verwirrung und Unsicherheit – für alle Nutzer.

2. Conversion-Rate und Kundenzufriedenheit steigern

Klare Rückmeldungen über Erfolg oder Misserfolg von Aktionen verhindern Abbrüche. Nutzer wissen immer, wo sie stehen und was als nächstes zu tun ist. Das reduziert Frustrationen und erhöht die Wahrscheinlichkeit, dass Prozesse erfolgreich abgeschlossen werden.

3. Support-Anfragen reduzieren

Eindeutige Status-Meldungen beantworten Fragen, bevor sie entstehen. "Wurde meine Bestellung wirklich übermittelt?" "Läuft der Upload noch?" – solche Unsicherheiten führen zu unnötigen Support-Anfragen, die du mit guten Status-Nachrichten vermeidest.

Und nicht zuletzt: Rechtssicherheit und Fördermöglichkeiten. Viele öffentliche Projekte fordern digitale Barrierefreiheit bereits verpflichtend – wer vorbereitet ist, hat klare Vorteile bei Ausschreibungen und Förderanträgen.

6. Das Erfolgskriterium im Wortlaut der W3C

Success Criterion 4.1.3 Status Messages (Level AA)

In content implemented using markup languages, status messages can be programmatically determined through role or properties such that they can be presented to the user by assistive technologies without receiving focus.

← Zurück zur WCAG-Übersicht