Staatliches Gutachten zur digitalen Barrierefreiheit
Gemeinschaftswerk Nachhaltigkeit
Nutzbarkeit mit unterschiedlichen Behinderungen
Blindheit Kaum nutzbar
Massive Screenreader- und Tastaturprobleme, fehlende Alternativtexte, Titel, Skiplinks und unzugängliche Formulare sowie PDFs schränken blinde Nutzende stark ein, machen Teile aber nicht völlig unbenutzbar.
Sehbehinderung Kaum nutzbar
Unzureichender Kontrast, fehlender Reflow, abgeschnittene Inhalte und fehlende Fokusanzeige in Kombination mit schwacher Tastaturunterstützung machen die Nutzung für sehbehinderte Personen nahezu unmöglich.
Hörbehinderung Mit Hindernissen nutzbar
Für gehörlose Menschen fehlen zwar DGS-Inhalte und Leichte Sprache, aber Kernfunktionen sind überwiegend nutzbar, da Tonabhängigkeit nicht im Vordergrund steht.
Motorische Behinderung Kaum nutzbar
Weitreichende Tastaturhindernisse (nicht fokussierbare Menüs, Login, Registerkarten, Checkboxen, Pop-ups) machen eine Nutzung ohne Maus in großen Teilen praktisch unmöglich.
Lernbehinderung Kaum nutzbar
Fehlende klare Labels, Fehlerhinweise, Suchfunktion, unlogische Fokus- und Tab-Reihenfolgen sowie keine Leichte Sprache erschweren Orientierung und Formularnutzung stark.
Neurodivergenz Kaum nutzbar
Inkonsistente Navigation, fehlende Strukturhilfen, schlechte Fokusführung und unklare Interaktionen führen zu hoher kognitiver Belastung für neurodivergente Personen.
Hinweis: Diese Zusammenfassung mit generativer KI basiert auf den Informationen aus diesem Gutachten. Künstliche Intelligenz kann Inhalte nicht automatisch barrierefrei machen oder Prüfungen durchführen. Behinderungen sind komplex und mehrschichtig, weshalb diese Analysen nicht zutreffen müssen.
Technische Umgebung
- OS
- Windows 11
- Browser
- Chrome 135.0.7049.115
- Screenreader
- NVDA
- Tools
- Color Contrast Analyser (CCA), PDF Accessibility Checker (PAC), Chrome web inspector, NVDA ScreenReader, HeadingsMap (Chrome), Landmark Navigation (Chrome)
-
https://gemeinschaftswerk-nachhaltigkeit.de/ Web-Angebot öffnen
-
https://auth.gemeinschaftswerk-nachhaltigkeit.de/realms/wpgwn/protocol/openid-connect/registrations?response_type=code&client_id=wpgwn-app&state=Lng4V3Fudmw0OEh4bjViVU5WTkVDLTdlRzdrQllYTnlma042ZmV3cFcycUYt%3B%252Faccount%253FforceRegistration%253D&redirect_uri=https%3A%2F%2Fgemeinschaftswerk-nachhaltigkeit.de%2Fapp%2F&scope=openid%20profile%20email&code_challenge=vPBg2IXOR3b_RLv8tUJgSjqW7BEzVTteJhwsxB5Tvg8&code_challenge_method=S256&nonce=Lng4V3Fudmw0OEh4bjViVU5WTkVDLTdlRzdrQllYTnlma042ZmV3cFcycUYt
-
https://gemeinschaftswerk-nachhaltigkeit.de/app/events/search
-
https://gemeinschaftswerk-nachhaltigkeit.de/app/search?query=pdf&type=orga
-
https://gemeinschaftswerk-nachhaltigkeit.de/cms/assets/c3bbd359-5edd-4113-98b2-66840549ec83
Prüfkriterien
Nicht bestanden
| Kriterium | Status | Notizen |
|---|---|---|
| Nicht-Text-Inhalt | nicht bestanden | Alle Bilder im Bereich Veranstaltungen benötigen aussagekräftige Alternativtexte oder leere alt-Attribute, damit Screenreader die Inhalte korrekt vermitteln und nicht überflüssige Informationen vorlesen. |
| Audiodeskription oder Medienalternative (aufgezeichnet) | nicht bestanden | Das eingebettete Video weist keine Audiodeskription oder Volltext-Alternative auf, wodurch visuelle Informationen blinden Nutzenden vorenthalten bleiben; liefern Sie eine beschreibende Tonspur oder Textfassung. |
| Audiodeskription (aufgezeichnet) | nicht bestanden | Es fehlt eine Audiodeskription für visuelle Inhalte des Videos (Szenenwechsel, Gestik, Texteinblendungen); ergänzen Sie diese sowohl für blinde als auch für stark sehbehinderte Personen. |
| Info und Beziehungen | nicht bestanden | Interaktive Kacheln sind als ein einziges a-Element gekennzeichnet, sodass Linktexte lang und unübersichtlich sind; strukturieren Sie Inhalte und beschränken den Linktext auf die klickbare Kerninformation. |
| Bedeutungsvolle Reihenfolge | nicht bestanden | Das Cookie-Banner ist erst nach Durchlaufen der Seite tagbar, bestehende Nutzer müssen Entscheide am Ende treffen; bringen Sie das Banner an den Beginn der Fokusreihenfolge und machen Sie es sofort tastaturzugänglich. |
| Bedeutungsvolle Reihenfolge | nicht bestanden | Die programmatische Reihenfolge der Filterelemente stimmt nicht mit der visuellen Darstellung überein und erschwert die Orientierung; rücken Sie die DOM-Reihenfolge an das visuelle Layout heran. |
| Ausrichtung | nicht bestanden | Texte und Bedienelemente werden abgeschnitten oder überlagern sich bei Zoom oder kleineren Bildschirmen; sorgen Sie für ein responsives Verhalten, sodass Inhalte flexibel umgebrochen werden. |
| Eingabezweck bestimmen | nicht bestanden | Eingabefelder enthalten kein autocomplete-Attribut und geben damit den Zweck der Eingabe nicht programmatisch weiter; versehen Sie Felder mit passenden autocomplete-Werten wie given-name oder email. |
| Kontrast (Minimum) | nicht bestanden | Der Button „Verband/ Nichtregierungsorganisation“ weist nur 2,9:1 Kontrast zum Hintergrund auf; passen Sie Farben so an, dass der Mindestkontrast von 4,5:1 (bzw. 3:1 für großen Text) erreicht wird. |
| Kontrast (Minimum) / Nicht-Text-Kontrast | nicht bestanden | Pinke Textelemente und Interface-Elemente liegen mit nur 2:1 Kontrast vor und überschreiten nicht die Anforderungen; erhöhen Sie den Kontrast von Text und grafischen Elementen auf mindestens 4,5:1 (3:1 für große Elemente). |
| Automatischer Umbruch (Reflow) | nicht bestanden | Im einspaltigen Layout, z. B. bei Zoom oder Mobilnutzung, ragen Inhalte aus dem Sichtbereich und werden nicht komplett dargestellt; sorgen Sie dafür, dass der gesamte Inhalt bei Reflow ohne horizontales Scrollen zugänglich bleibt. |
| Tastatur | nicht bestanden | Menüeinträge mit Untermenüs lassen sich mit Tastatur nicht öffnen; machen Sie Untermenüs vollständig tastaturzugänglich, inklusive fokussierbarer Unterpunkte. |
| Tastatur | nicht bestanden | Registerkarten lassen sich per Tastatur weder fokussieren noch aktivieren; setzen Sie role="tab"/aria-selected korrekt ein und ermöglichen Sie die Aktivierung per Enter/Leertaste. |
| Tastatur | nicht bestanden | Checkboxen sind ausschließlich mit Maus bedienbar; stellen Sie sicher, dass sie mit Tab erreichbar, mit Leertaste schaltbar und ihr Status programmgesteuert verfügbar ist. |
| Tastatur | nicht bestanden | Auf der Registrierungsseite sichtbare Texte können nicht per Tastatur oder Screenreader erreicht werden, weil sie nur visuell vorhanden sind; setzen Sie echten HTML-Text ein, der in der Fokusreihenfolge liegt. |
| Tastatur | nicht bestanden | Der Login-Link in der Navigation ist nicht fokussierbar, sodass ohne Maus keine Anmeldung möglich ist; implementieren Sie ihn als korrektes interaktives Element mit sichtbarer Fokusanzeige. |
| Tastatur | nicht bestanden | Die Filterliste „Themenfelder“ lässt sich zwar öffnen, aber nicht per Escape schließen; ermöglichen Sie das Schließen mit Escape und führen Sie den Fokus zurück an eine logische Stelle. |
| Tastatur | nicht bestanden | Das Info-Pop-up kann weder per Escape noch per fokussierbarer Schaltfläche geschlossen werden; schaffen Sie ein Tastatur-schließbares Element und managen Sie Fokus beim Öffnen/Schließen. |
| Blöcke überspringen | nicht bestanden | Es fehlt ein sicht- und fokussierbarer Skiplink zum Hauptinhalt, wodurch Tastaturnutzende sich durch wiederkehrende Elemente durchkämpfen müssen; fügen Sie einen hörbaren Skiplink mit Zielen wie #maincontent ein. |
| Seite mit Titel | nicht bestanden | Die getesteten Seiten besitzen kein <title> im <head>, wodurch Orientierung und Linkkontext fehlen; geben Sie jeder Seite einen eindeutigen sprechenden Titel („Seitennamen – Webseitenname“). |
| Fokus-Reihenfolge | nicht bestanden | Nach dem Footer folgen mehrere leere Tab-Schritte, die zu keinem erkennbaren Ziel führen; entfernen Sie nicht sichtbare Fokusziele oder leiten Sie den Fokus an einen logischen Ort zurück. |
| Fokus-Reihenfolge | nicht bestanden | Der Fokus springt nach Interaktionen wie Formularabsendungen zum Seitenanfang; setzen Sie ihn stattdessen gezielt auf sinnvolle Ziele (z. B. Überschrift der Ergebnisse oder das zuvor genutzte Steuerelement). |
| Linkzweck (im Kontext) | nicht bestanden | Der Link ist nur mit „Hier“ beschriftet, was ohne Kontext nicht verständlich ist; formulieren Sie den Text so, dass der Zweck oder Zielort eindeutig benannt wird, z. B. „Informationen zur Anmeldung“. |
| Verschiedene Möglichkeiten | nicht bestanden | Die Seite bietet keine barrierefreie Suchfunktion und keine Sitemap, die Informationssuche für assistive Technologien erleichtern könnte; ergänzen Sie mindestens eine gut zugängliche Suchfunktion oder eine strukturierte Sitemap. |
| Fokus sichtbar | nicht bestanden | In Formularen fehlt ein sichtbarer Fokusindikator, sodass Tastaturnutzende nicht erkennen, welches Feld aktiv ist; aktivieren Sie kontrastreiche Fokusrahmen oder Hintergründe ohne CSS-Override. |
| Fokus sichtbar | nicht bestanden | Beim Videoelement verschwindet der Fokus sofort oder ist gar nicht sichtbar, sodass Steuerelemente nicht steuerbar sind; führen Sie Fokusmanagement für den Player ein, inklusive sichtbarer Indikatoren und vollständiger Tastatursteuerung. |
| Fokus sichtbar | nicht bestanden | Der Button „Veranstaltungen“ zeigt bei Tastaturfokus keine klare Visuelle Hervorhebung; gestalten Sie ihn mit Rahmen, Farbwechsel oder Schatten, damit die Fokussierung sofort erkennbar ist. |
| Sprache von Teilen | nicht bestanden | Im Englischen Modus bleiben Inhalte auf Deutsch, zusätzlich fehlen passende lang-Angaben; übersetzen Sie Inhalte vollständig oder markieren Sie sie korrekt und vermeiden Sie falsche Sprachauszeichnung. |
| Konsistente Navigation | nicht bestanden | Die Registrierungsseite enthält keine sichtbare Navigation zu anderen Bereichen, wodurch Nutzende nicht zurückkehren oder wechseln können; binden Sie zumindest grundlegende Navigationslinks ein. |
| Fehlerkennzeichnung | nicht bestanden | Fehlermeldungen stehen nicht unmittelbar bei den betroffenen Formularfeldern, was insbesondere bei Screenreadern zu Verwirrung führt; ordnen Sie sie visuell und programmatisch direkt zu (z. B. via aria-describedby). |
| Beschriftungen (Labels) oder Anweisungen | nicht bestanden | Pflichtfelder sind nur mit Asterisk markiert, aber ohne Erklärung; ergänzen Sie eine Beschreibung (z. B. Text über dem Formular oder im Label) und kennzeichnen Sie Pflichtfelder programmatisch (aria-required). |
| Beschriftungen (Labels) oder Anweisungen | nicht bestanden | Formulare nutzen ausschließlich Placeholder-Texte ohne permanente Beschriftung, wodurch der Zweck der Felder verloren geht; setzen Sie dauerhaft sichtbare Labels für jedes Eingabefeld ein. |
| Name, Rolle, Wert | nicht bestanden | Schalter sind zwar als solche erkennbar, erhalten aber keine funktionale Beschriftung oder Zustandsangabe; ergänzen Sie aria-labels/ -pressed oder sprechenden Text und geben Sie den Status programmgesteuert aus. |
| Name, Rolle, Wert | nicht bestanden | Der aktive Menüeintrag besitzt keine semantische Kennzeichnung (z. B. aria-current="page"), sodass Screenreader die aktuelle Position nicht erkennen; setzen Sie diese Attribute ein. |
|
PDF-Dokument mit PAC geprüft
PAC-Test
|
nicht bestanden | Das zugehörige PDF hat den automatisierten PAC-Test nicht bestanden und benötigt eine weitergehende manuelle Prüfung zur logischen Struktur, Alternativtexten und Lesereihenfolge. |
|
PDF Dokument ist getaggt
Tag-Struktur
|
nicht bestanden | Das PDF verfügt über keine Tags, wodurch Screenreader logische Strukturen und Überschriften nicht erkennen können; bringen Sie eine vollständige Tag-Struktur mit korrektem Mapping zu Absätzen, Listen, Tabellen und Links ein. |
|
Zusatzkriterien: DGS/Leichte Sprache
Zusatzkriterien
|
nicht bestanden | Es fehlen durchgängig die Informationen in Deutscher Gebärdensprache und Leichter Sprache (Links, Erläuterungen und Navigationshinweise); ergänzen Sie alle geforderten Inhalte und verlinken Sie sie barrierefrei. |
|
Barrierefreiheitserklärung vorhanden
Barrierefreiheitserklärung
|
nicht bestanden | Auf der Webseite gibt es keine Barrierefreiheitserklärung, sodass weder rechtlich noch für Nutzende Transparenz über den Stand der Barrierefreiheit besteht; veröffentlichen Sie eine vollständige Erklärung mit Status, Ausnahmen und Kontaktmöglichkeiten. |
Möglicherweise verwandte Prüfungen
www.deutscher-nachhaltigkeitskodex.de
BFIT Bund
Prüfung vom 23.01.2025
Unterstützung
Barrieren sichtbar machen kostet Geld. Hilf uns, dranzubleiben.
BarrierenWatch wird ehrenamtlich betrieben und finanziert sich über Steady-Mitgliedschaften von Menschen wie dir, die Barrierefreiheit und Inklusion voranbringen möchten. Hinter dem Projekt stehen Menschen mit Behinderung, die seit Jahren im Bereich der digitalen Barrierefreiheit oder als Aktivist*innen aktiv sind. Aktuell sind wir im Prozess der Gründung eines gemeinnützigen Vereins, der dieses Engagement beheimaten soll.
ab
5
Euro
im Monat
für Recherche, Prüfungen und den Betrieb der Plattform.