Gutachten

Bundeszentrale für politische Bildung

Website nicht konform Prüfung vom 21.12.2022 ID: #99
Politik öffentliche Einrichtung
Prüfbericht herunterladen (PDF) Link kopiert!

Kurzzusammenfassung

Auftraggeber
Überwachungsstelle des Bundes für Barrierefreiheit von Informationstechnik
Prüforganisation
Materna Information & Communications SE
Prüfart
eingehende Überwachung

Technische Umgebung

  • OS: Windows 10 Enterprise (Version 20H2)
  • Browser: Firefox (Version 107.0), Chrome (Version 108.0)
  • Screenreader: NVDA (Version 2022.3.2)
  • Auflösung: 1920 × 1080
  • Tools: Colour Contrast Analyser (Version 3.1.4), PDF Accessibility Checker 2021 (Version 21.0.0.0)

Zugänglichkeits-Analyse

KI-Schnellcheck zur Nutzbarkeit

Blindheit

Mit Hindernissen nutzbar

Mehrere zentrale A‑ und AA‑Fehler bei Alternativtexten, Struktur, Formular-Beschriftungen, Navigation, Name/Rolle/Wert und fehlender Audiodeskription erschweren Screenreader-Nutzung deutlich, machen sie aber nicht vollständig unmöglich.

Sehbehinderung

Kaum nutzbar

Probleme bei Mindest- und Nicht-Text-Kontrast, Reflow, Textabstand, Benutzerpräferenzen sowie Fokus-Sichtbarkeit und nur farblich markierten Links beeinträchtigen die Nutzung für sehbehinderte Personen stark.

Hörbehinderung

Weitgehend zugänglich

Fehlende Audiodeskriptionen betreffen vor allem blinde Nutzer; für Gehörlose sind Inhalte weitgehend nutzbar, da keine gravierenden Untertitel- oder Audio-only-Probleme berichtet werden.

Motorische Behinderung

Mit Hindernissen nutzbar

Schwer bedienbare oder teils unzugängliche Tastatur-Navigation, Fokusprobleme und Drag&Drop-artige Bedienmuster schränken die Nutzbarkeit für motorisch eingeschränkte Menschen deutlich ein.

Lernbehinderung

Mit Hindernissen nutzbar

Inkonsequente Struktur, fehlerhafte Formularkennzeichnung, unklare Linkzwecke und Probleme bei Lesbarkeit und Navigation sind belastend, werden aber teilweise durch vorhandene Leichte-Sprache-Angebote abgemildert.

Neurodivergenz

Mit Hindernissen nutzbar

Unlogische Fokus-Reihenfolge, komplexe Navigation, fehleranfällige Formulare und teils schlechte Lesbarkeit können Überforderung und Desorientierung auslösen, sind aber nicht durchgehend kritisch.

Hinweis: Diese Einschätzung 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.

Getestete Angebote

Webangebot öffnen
  • https://www.bpb.de/
  • https://www.bpb.de/die-bpb/ueber-uns/service/kontakt/

Empfehlung & Status

Empfehlung

Korrigieren Sie die aufgeführten Konformitätsdefizite in den Bereichen Alternativtexte, Tastaturbedienbarkeit, Strukturmarkup, Kontrastkontrolle, Formularerkennung sowie Dokumentation und nationale Zusatzanforderungen, um die WCAG 2.1 A/AA und zusätzlichen nationalen Vorgaben zu erfüllen.

Prüfkriterien

Nicht bestanden

Kriterium Status Notizen
4.9.1.1.1.a
Alternativtexte für Bedienelemente
nicht bestanden Das grafische Bedienelement ‚Anfahrtsskizze Bonn‘ hat nur den Text ‚Anfahrtsskizze Bonn‘; die Funktion (Lightbox öffnen, Inhalte der Karte) muss im alt-Attribut mitgegeben werden.
4.9.1.1.1.c
Leere alt-Attribute für Layoutgrafiken
nicht bestanden Layoutgrafiken verwenden teilweise nicht-leere alt- oder title-Attribute; diese dekorativen Elemente müssen konform mit leerem alt implementiert werden, damit Screenreader keinen unnötigen Inhalt ausgeben.
4.9.1.2.3
Audiodeskription oder Medienalternative (aufgezeichnet)
nicht bestanden Videos auf ‚Erklärfilme Freihandel‘ enthalten visuelle Informationen (Handlung, Kontext), für die weder eine Audiodeskription noch eine vollständige Volltext-Alternative vorliegt und der direkte Link zur Transkript-Datei nicht funktioniert.
4.9.1.2.5
Audiodeskription (aufgezeichnet)
nicht bestanden Auf der Seite ‚Erklärfilme Freihandel‘ fehlt die Audiodeskription zu mehreren visuellen Informationen, dieser Inhalt wird blinden Nutzern nicht vermittelt.
4.9.1.3.1.b
HTML-Strukturelemente für Listen
nicht bestanden Listenartige Inhalte (z. B. im Impressum) verwenden keine HTML-list-Elemente; stattdessen sind sichtbare und funktionale Listen ohne ul/ol/li markiert. Kennzeichnen Sie die Einträge korrekt, damit assistive Technologien Listen überspringen können.
4.9.1.3.1.h
Beschriftung von Formularelementen programmatisch ermittelbar
nicht bestanden Die Gruppenbeschriftung ‚Lieferungsspezifikationen‘ wird beim Fokus auf die zugehörigen Auswahlfelder nicht ausgegeben; versehen Sie die Gruppe mit einem legend-Element, damit Screenreader die Gruppierung erkennen.
4.9.1.3.5
Eingabezweck bestimmen
nicht bestanden Mehrere Formularfelder (Vorname, Name, Straße, Ort etc.) verfügen nicht über das autocomplete-Attribut; tragen Sie eindeutige Eingabezwecke ein, damit Browser und Hilfssoftware sinnvolle Vorschläge bieten.
4.9.1.4.3
Kontrast (Minimum)
nicht bestanden Einige Texte definieren nur eine Vordergrund- oder nur eine Hintergrundfarbe; Benutzer, die eigene Systemfarben verwenden, sehen dadurch nicht vorhersehbar kontrastierte Texte. Stellen Sie sicher, dass bei jedem Text sowohl Vorder- als auch Hintergrundfarbe genannt sind.
4.9.1.4.7
Nicht-Text-Kontrast
nicht bestanden Grafiken und Bedienelemente verfügen zwar über Vordergrundfarben, aber keine Hintergrundfarben; individuelle Systemfarben führen dazu, dass der Kontrast unvorhersehbar ist. Geben Sie stets Vorder- und Hintergrundfarbe oder Konturen an.
4.9.2.1.1
Tastatur
nicht bestanden Die mobile Navigation lässt sich nur schwer ohne Maus bedienen: manche Untermenüs sind gar nicht erreichbar, andere müssen über eine umständliche Drag&Drop-artige Steuerung verschoben werden; fügen Sie logische Tastenfolgen und Fokusmanagement hinzu.
4.9.2.4.3
Fokus-Reihenfolge
nicht bestanden Im mobilen Menü springt der Fokus beim Tabben mehrfach und der Reiter ‚Mediathek‘ wird nur mit Shift+Tab erreichbar, Registerkarten werden in falscher Reihenfolge durchlaufen; optimieren Sie die Fokusfolge so, dass alle Tabs und Untermenüs nachvollziehbar erreichbar sind.
4.9.2.4.7
Fokus sichtbar
nicht bestanden Die markierten Bedienelemente im mobilen Menü zeigen beim Tastaturfokus keine sichtbare Hervorhebung; Ergänzen Sie eine deutliche Fokushervorhebung, damit die aktuelle Position erkennbar ist.
4.9.4.1.1
Syntaxanalyse
nicht bestanden Der W3C-Validator zeigt auf der Startseite mehrere Syntaxfehler und weitere Fehler liegen auf anderen Seiten vor; überarbeiten Sie das Markup, damit es valide ist und assistive Technologien die Seite korrekt interpretieren.
4.9.4.1.2
Name, Rolle, Wert
nicht bestanden Das mobile Menü verwendet kaum WAI-ARIA-Auszeichnungen, sodass Name, Rolle und Zustand der Tabs für Screenreader nicht ermittelbar sind; implementieren Sie passende roles, aria-selected und Fokusmanagement nach dem ARIA Tab Panel Pattern.
4.9.6
Konformitätsanforderungen der WCAG
nicht bestanden Da die geprüften Seiten nicht durchgehend alle Anforderungen der Konformitätsstufen A und AA erfüllen (siehe z. B. Tastatur, Kontrast, Struktur), ist die WCAG-Konformität nicht gegeben.
4.11.7
Benutzerpräferenzen
nicht bestanden Mit benutzerdefinierten Systemeinstellungen (eigene Schriftarten, Farben, Schriftgröße) werden einzelne Elemente so kontrastarm, dass sie kaum noch erkennbar sind; versehen Sie die Elemente mit Hintergrundfarbe oder Kontur, die auch bei Systemfarben behalten wird.
4.12.1.2
Barrierefreie Dokumentation
nicht bestanden Die Erklärung zur Barrierefreiheit übernimmt die allgemeinen Auffälligkeiten dieses Berichts, deshalb erfüllt die Seite nicht alle Vorgaben des Abschnitts 4.5 bis 4.11; überarbeiten Sie sie entsprechend der genannten Mängel.
5.1
Technische Dokumentprüfung
nicht bestanden Das PDF ‚Anfahrtsskizze_Bonn.pdf‘ enthält keine Tags, ist nicht PDF/UA-konform und liefert Screenreadern inkorrekte Straßennamen; strukturieren Sie das PDF mit Tags, Alternativtexten und korrekter Lesereihenfolge.

Im Wesentlichen bestanden

Kriterium Status Notizen
4.9.1.1.1.b
Alternativtexte für Grafiken und Objekte
im Wesentlichen bestanden Die alternativen Texte ‚Tage‘, ‚Stunden‘ und ‚Stadt‘ verdeutlichen nicht, dass es um Datum, Uhrzeit und Veranstaltungsort einer Veranstaltung geht; beschreibende Texte (z. B. ‚Datum der Veranstaltung‘) sind erforderlich.
4.9.1.3.1
HTML-Strukturelemente für Überschriften
im Wesentlichen bestanden Die Überschriftenstruktur ist inkonsistent (h3 statt h2, Überschriften ohne zugehörigen Inhalt) und einige visuelle Überschriften wurden nur mit strong ausgezeichnet; kennzeichnen Sie sie mit den passenden heading-Tags, damit Screenreader die Seitenstruktur richtig übermitteln.
4.9.1.3.1.d
Inhalte gegliedert
im Wesentlichen bestanden Absätze werden teilweise mit mehreren <br>-Elementen umgesetzt, was beim Auslesen im Screenreader zu ‚leer‘ führt; nutzen Sie stattdessen <p>-Elemente und steuern Sie Abstände über CSS.
4.9.1.3.2
Bedeutungsvolle Reihenfolge
im Wesentlichen bestanden Visualisierte Karussells verstecken die nachfolgenden Beiträge mittels aria-hidden=true und eine zusätzliche Anzeige ist nur über eine umständlich zu nutzende Tastatursteuerung erreichbar; entfernen Sie aria-hidden oder implementieren Sie eine barrierefreie Karussellsteuerung.
4.9.1.4.1
Benutzung von Farbe
im Wesentlichen bestanden Die hervorgehobenen Fließtextlinks sind nur farblich markiert und weisen ein Kontrastverhältnis von 2,5:1 auf; ergänzen Sie zusätzliche Markierungen (Unterstreichung, Symbol) oder erhöhen Sie den Kontrast auf mindestens 3:1.
4.9.1.4.6
Automatischer Umbruch (Reflow)
im Wesentlichen bestanden Bei 320 CSS-Pixeln Breite entsteht ein Element, das nicht umbricht, und weitere Inhalte sind nur durch Drag&Drop oder Pfeiltasten erreichbar; gliedern Sie den Inhalt so, dass keine zweidimensionale Scrollrichtung erforderlich ist.
4.9.1.4.8
Textabstand
im Wesentlichen bestanden Durch eine Erhöhung der Textabstände gemäß WCAG-Vorgaben werden Teile der Elemente abgeschnitten, was die Lesbarkeit einschränkt; gestalten Sie die Container flexibler, damit erhöhter Zeilen-, Zeichen- oder Wortabstand nicht zu Clipping führt.
4.9.2.4.1
Blöcke überspringen
im Wesentlichen bestanden Versteckte Bereichsüberschriften erweitern die Struktur unnötig, es fehlt ein role=search für die Suche und ein iframe trägt kein title-Attribut; verwenden Sie stattdessen HTML5-Landmarks, definieren Sie role=search und beschriften Sie eingebundene Inhalte aussagekräftig.
4.9.2.4.4
Linkzweck (im Kontext)
im Wesentlichen bestanden Im Warenkorb und auf Kontaktseiten stehen mehrfach identische Linktexte wie ‚Zum Feld‘ oder ‚hier‘; formulieren Sie die Linktexte so, dass sie den Zweck oder das Ziel eindeutig beschreiben (z. B. ‚Zum Feld Vorname‘).
4.9.3.1.2
Sprache von Teilen
im Wesentlichen bestanden Ein fremdsprachlicher Abschnitt im Datenschutz ist im HTML nicht mit lang ausgezeichnet, daher liest der Screenreader die falsche Wortliste; versehen Sie die Passagen mit dem passenden lang-Attribut.
4.9.3.3.3
Vorschlag bei Fehler
im Wesentlichen bestanden Für das E-Mail-Feld wird die gleiche Fehlermeldung sowohl bei fehlender als auch bei ungültiger Eingabe angezeigt; differenzieren Sie die Meldungen (z. B. ‚Dieses Feld muss ausgefüllt werden‘ vs. ‚Bitte geben Sie eine gültige Adresse ein‘).
5.2
Erklärung zur Barrierefreiheit
im Wesentlichen bestanden Die Erklärung listet nur beispielhaft nicht barrierefreie Inhalte auf und nennt keine Gründe; ergänzen Sie die vollständigen nicht barrierefreien Teile sowie die Ursachen und ggf. Alternativen.
5.4
Erläuterungen in Leichter Sprache
im Wesentlichen bestanden Leichte-Sprache-Inhalte beschreiben zwar die wesentlichen Inhalte, es fehlen aber textliche Hinweise zur Navigation; ergänzen Sie erklärende Navigationstexte und Verweise in Leichter Sprache.
5.5
Erläuterungen in Gebärdensprache
im Wesentlichen bestanden Die Videoseiten enthalten zwar Informationen und Hinweise, aber Nutzer erhalten keine Aussagen zur Dateigröße und das offizielle Gebärdensprachenlogo wird nicht durchgängig genutzt; ergänzen Sie diese Angaben und verwenden Sie immer das korrekte Logo.

Verwandte Prüfungen