Staatliches Gutachten zur digitalen Barrierefreiheit

Deutscher Bundesjugendring (www.dbjr.de)

Nutzbarkeit mit unterschiedlichen Behinderungen

Blindheit Kaum nutzbar

Fehlende Alternativtexte, unzureichende Semantik, keine Medienalternativen und Probleme bei Name/Rolle/Wert schränken Screenreader-Nutzung massiv ein.

Sehbehinderung Mit Hindernissen nutzbar

Unzureichende Textkontraste und fehlende sichtbare Fokusmarkierung erschweren Orientierung, Vergrößerung und Lesen deutlich.

Hörbehinderung Weitgehend zugänglich

Gehörlose können die Website überwiegend nutzen, aber fehlende Gebärdensprache und Medienalternativen für Videos mindern den Informationszugang.

Motorische Behinderung Kaum nutzbar

Fehlende zuverlässige Tastaturbedienung, unsichtbarer Fokus und fehlerhafte Fokusreihenfolge machen eine Nutzung mit Tastatur oder alternativen Eingaben sehr schwierig.

Lernbehinderung Mit Hindernissen nutzbar

Fehlende klare Struktur, unzureichende Formularkennzeichnung und keine Inhalte in Leichter Sprache erschweren Verständnis und Bedienung.

Neurodivergenz Mit Hindernissen nutzbar

Mangelnde inhaltliche Struktur, fehlende Skiplinks und unklare Formularhinweise erschweren fokussierte und stressarme Nutzung.

Dokumentierte Barrieren

  • Navigationsmenüs per Tastatur nicht erreichbar

    Die ausklappbaren Menüs der Hauptnavigation lassen sich nicht zuverlässig mit der Tastatur öffnen. In der mobilen Ansicht fehlen zudem mehrere Auswahlpunkte in der Tab-Reihenfolge.

    Auswirkung: Ich kann mich ohne Maus nicht durch die wichtigsten Bereiche der Website bewegen. Dadurch komme ich an zentrale Inhalte und Unterseiten nur sehr schwer oder gar nicht heran.

  • Fokus ist nicht sichtbar

    Beim Navigieren mit der Tastatur ist keine sichtbare Fokushervorhebung vorhanden. Die Browser-Outline wurde entfernt, sodass der aktuelle Fokuspunkt nicht erkennbar ist.

    Auswirkung: Ich weiß nicht, welches Element gerade aktiv ist, und kann Bedienelemente kaum sicher auswählen. Das macht die Bedienung mit Tastatur sehr fehleranfällig und anstrengend.

  • Grafische Links haben keinen verständlichen Namen

    Mehrere grafische Links und das Logo sind nicht so beschriftet, dass ihr Ziel oder ihre Funktion erkennbar wird. Teilweise fehlen Alternativtexte oder sie enthalten nicht den sichtbaren Linktext.

    Auswirkung: Ich kann mit Screenreader oder Sprachsteuerung nicht sicher erkennen, wohin ein Link führt. Dadurch traue ich mich weniger zu klicken und komme eventuell nicht zum gewünschten Ziel.

  • Interaktive Elemente sind semantisch falsch umgesetzt

    Einige Menübuttons sind technisch als einfache grafische Elemente umgesetzt und werden vom Screenreader nicht korrekt als Bedienelement erkannt. Name, Rolle und Zustand sind dadurch nicht zuverlässig verfügbar.

    Auswirkung: Ich weiß nicht immer, ob ein Element anklickbar ist oder was es bewirkt. Das erschwert mir die Bedienung mit Hilfsmitteln und kann zu Fehlversuchen führen.

  • Videoinhalte nicht barrierefrei beschrieben

    Das Video '#WahlalterSenken' enthält wichtige Schriftgrafiken, aber keine Audiodeskription und keine ausreichende Textalternative. Visuelle Inhalte sind deshalb nicht vollständig erschließbar.

    Auswirkung: Ich kann die Aussagen und Details des Videos nicht nachvollziehen, wenn ich Bilder oder eingeblendeten Text nicht sehen kann. Dadurch fehlt mir ein wesentlicher Teil der Information.

  • Schnelles Überspringen von Bereichen fehlt

    Es gibt keine Sprunglinks oder klar ausgezeichneten Landmarken, um wiederkehrende Bereiche wie Navigation oder Breadcrumb zu überspringen. Dadurch landet man bei jeder Navigation erneut an denselben Bereichen.

    Auswirkung: Ich muss mich jedes Mal durch viele wiederkehrende Seitenelemente tabben. Das kostet viel Zeit und erschwert mir den Zugang zum eigentlichen Inhalt deutlich.

  • Bilder und Schriftgrafiken werden nicht erklärt

    Auf mehreren Seiten sind Logos und Schriftgrafiken ohne sinnvolle Alternativtexte eingebunden. Screenreader geben diese Inhalte daher nicht als verständliche Information aus.

    Auswirkung: Ich bekomme wichtige Namen, Hinweise oder Markeninformationen nicht mit. Dadurch fehlen mir Orientierung und Kontext beim Lesen der Seite.

  • Formularfehler werden nicht verständlich zugeordnet

    Im Formular 'Wahlalter senken' sind Fehlermeldungen nicht eindeutig mit den betroffenen Feldern verbunden. Außerdem wird nicht klar erklärt, welche Felder Pflichtfelder sind.

    Auswirkung: Ich weiß bei Eingabefehlern nicht sicher, was ich korrigieren muss. Dadurch kann ich das Formular leichter falsch ausfüllen oder unnötig lange brauchen.

  • Fokusreihenfolge passt nicht zur Seite

    Seitenelemente wie Seitenleisten und Subnavigation erscheinen in einer ungünstigen Reihenfolge. Dadurch geht der Zusammenhang zwischen sichtbarer und tatsächlicher Bedienreihenfolge verloren.

    Auswirkung: Ich erwarte die nächsten Bedienelemente an einer anderen Stelle, lande aber plötzlich woanders. Das verwirrt mich und kann dazu führen, dass ich Inhalte oder Menüs übersehe.

  • Überschriftenstruktur fehlt oder ist unklar

    Auf mehreren Seiten gibt es keine durchgängige Überschriftenstruktur. Inhalte sind dadurch nicht klar gegliedert und schwerer zu erfassen.

    Auswirkung: Ich kann mir die Seite schlechter überblicksartig erschließen und Inhalte nicht schnell ansteuern. Das macht längere Seiten unübersichtlich und anstrengend.

  • Textkontraste sind zu schwach

    Einige rote Hervorhebungen auf Menüs und Buttons erreichen nicht das erforderliche Kontrastverhältnis. Das betrifft besonders aktive Navigation und einzelne Schaltflächen.

    Auswirkung: Ich kann Texte und Bedienelemente schwerer erkennen, vor allem bei schlechteren Lichtverhältnissen oder mit Seheinschränkungen. Dadurch wird Lesen und Auswählen deutlich mühsamer.

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 10 Enterprise (Version 1909)
Browser
Firefox (Version 88.0.1 / 89.0)
Screenreader
NVDA (Version 2020.4)
Auflösung
1920 × 1080
Tools
Colour Contrast Analyser (Version 3.1.2), PDF Accessibility Checker 3 (Version 3.0.7.0)

Prüfkriterien

Nicht bestanden

Kriterium Status Notizen
4.9.1.1.1.a
Alternativtexte für Bedienelemente
nicht bestanden Der Suchbutton im Kopfbereich besitzt keinen Alternativtext; auch das verlinkte Logo beschreibt nicht das Ziel. Bitte aria-label oder versteckten Linktext ergänzen, der Funktion und Ziel kommuniziert.
4.9.1.1.1.b
Alternativtexte für Grafiken und Objekte
nicht bestanden Logos und Schriftgrafiken auf diversen Seiten sind mit leeren alt-Attributen eingebunden, wodurch Screenreader die Namen nicht vermitteln können. Ergänzen Sie sinnvolle Alternativtexte wie "Logo Arbeiter-Samariter-Jugend" oder den sichtbaren Text.
4.9.1.2.3
Audiodeskription oder Medienalternative (aufgezeichnet)
nicht bestanden Das eingebundene Video ‘#WahlalterSenken’ enthält numerous Schriftgrafiken ohne Audiotranskription oder Volltextalternative, so dass blinde Nutzer den Inhalt nicht nachvollziehen können. Stellen Sie eine textliche Alternative oder Audiodeskription bereit mit Szenenbeschreibung und Textwiedergabe.
4.9.1.2.5
Audiodeskription (aufgezeichnet)
nicht bestanden Es existiert keine Audiodeskription für das Video #WahlalterSenken, obwohl visuelle Informationen für das Verständnis erforderlich sind. Eine zusätzliche Audiodeskription oder alternative Inhaltsdarstellung ist notwendig.
4.9.1.3.1.a
HTML-Strukturelemente für Überschriften
nicht bestanden Die Seiten Startseite, Mitgliedsorganisationen und Wahlalter senken weisen keine durchgehende H-Struktur auf; fehlende H1/H2 oder falsche Ebenen erschweren das Verständnis. Setzen Sie korrekte Überschriften (z. B. versteckte H1-Beschriftung, h2 für Organisationstitel, h3 für Unterpunkte).
4.9.2.1.1
Tastatur
nicht bestanden Die Ausklappmenüs der Hauptnavigation lassen sich nicht über die Tastatur aufrufen; in der mobilen Ansicht fehlen viele Auswahlpunkte in der Tab-Reihenfolge. Ergänzen Sie Tastaturzugriff auf Untermenüs und zeigen Sie z. B. Bereichsmenüs oder Tastatur-Events.
4.9.2.4.1
Blöcke überspringen
nicht bestanden Weder strukturierte Bereichsüberschriften noch Sprunglinks oder Landmarken ermöglichen es, wiederkehrende Bereiche (Navigation, Breadcrumb) zu überspringen. Markieren Sie Hauptnavigation und Breadcrumb mit nav/aria-label, ergänzen Sie Sprunglinks und Landmarken.
4.9.2.4.3
Fokus-Reihenfolge
nicht bestanden Die Seitenleisten erscheinen in der linearen Darstellung nach dem Hauptinhalt; Subnavigation geht aus dem Fokus verloren. Ziehen Sie Menüs vor den Hauptinhalt oder platzieren Sie sie im DOM entsprechend der visuellen Reihenfolge und bieten Sie eine Rücksprungmöglichkeit.
4.9.2.4.7
Fokus sichtbar
nicht bestanden Es gibt keine sichtbare Fokushervorhebung (die browsereigene Outline wurde entfernt), so dass Tastaturnutzer nicht erkennen können, wo der Fokus liegt. Entfernen Sie outline:none und definieren Sie mit :focus einen mindestens 3:1 kontrastierenden Rahmen.
4.9.2.5.3
Beschriftung (Label) im Namen
nicht bestanden Graphische Links verwenden weder alt- noch title-Texte, sodass der zugängliche Name den sichtbaren Text nicht enthält. Ergänzen Sie aria-labels, die den sichtbaren Text beinhalten, damit Spracheingabe und Screenreader Konsistenz erhalten.
4.9.3.3.1
Fehlerkennzeichnung
nicht bestanden Fehlermeldungen im Formular Wahlalter senken sind nicht programmatisch mit den Feldern verbunden. Verknüpfen Sie Felder mit aria-describedby, damit Screenreader die Identifikation von Fehlern ermöglichen.
4.9.3.3.2
Beschriftungen (Labels) oder Anweisungen
nicht bestanden Sternchen für Pflichtfelder werden nicht erklärt; es fehlen Hinweise zur Bedeutung der Kennzeichnung. Ergänzen Sie eine Erläuterung zu Beginn des Formulars, dass * Pflichtfelder kennzeichnet.
4.9.4.1.2
Name, Rolle, Wert
nicht bestanden Interaktive Elemente wie Menübuttons sind als div/i mit Javascript umgesetzt und werden per Screenreader nur als Link vorgelesen. Verwenden Sie native button-Elemente mit aria-labels (z. B. „Hauptmenü öffnen“), damit Name, Rolle und Wert ermittelbar sind.
4.9.1.4.3
Kontrast (Minimum)
nicht bestanden Textfarben wie die rote Hervorhebung auf Menüs und Buttons erfüllen das 4,5:1-Verhältnis nicht, das Problem betrifft insbesondere die aktive Hauptnavigation und Buttons auf Wahlalter senken. Erhöhen Sie den Kontrast auf ≥4,5:1 bei normalem Text.

Bestanden

Kriterium Status Notizen
4.9.1.3.1.b
HTML-Strukturelemente für Listen
bestanden Listen und Menüs wurden korrekt mit den vorgesehenen HTML-Strukturelementen ausgezeichnet, sodass sie Screenreader nutzbar machen.

Möglicherweise verwandte Prüfungen

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.