Deutsch
a11yglass · Barrierefreiheits-Check für Websites

Geprüft am 31.8.2026 · https://contentglass.com/

C
68 / 100
1 kritisch · 2 zu prüfen

1 kritische Barriere · zusätzlich 2 zu prüfen.

Wie kommt der Score zustande? (100 Startpunkte)
{n} CSS-Regel{nPlural} mit möglicherweise zu geringem Textkontrast-18
{n} Link(s) ohne erkennbaren Namen im HTML-7
Keine <h1>-Überschrift im ausgelieferten HTML-7
Ergebnis68 / 100
✕Kontrast (1)✓Textalternativen?Beschriftung (1)?Struktur (1)✓Sprache✓Zoom✓Robustheit

Wahrnehmbar

KritischWCAG 1.4.3 Kontrast (Minimum)

{n} CSS-Regel{nPlural} mit möglicherweise zu geringem Textkontrast

Nötig: 4.5:1 (normal) bzw. 3:1 (großer Text). Bei „angenommenem Seitenhintergrund“ konnte der tatsächliche Hintergrund nicht sicher bestimmt werden — im Zweifel im Browser prüfen. Gefunden u. a.: {examples}

.p-qe19929 .pagelayer-heading-holder *, .pagelayer-social_grp[class*="pagelayer-social-shape"] .pagelayer-icon-holder[class*="pagelayer-facebook"], .pagelayer-social_grp[class*="pagelayer-social-shape"] .pagelayer-icon-holder[class*="pagelayer-twitter"], .pagelayer-social_grp[class*="pagelayer-social-shape"] .pagelayer-icon-holder[class*="pagelayer-google-plus"], .pagelayer-social_grp[class*="pagelayer-social-shape"] .pagelayer-icon-holder[class*="pagelayer-linkedin"]

Das solltest du tun: Textfarbe abdunkeln oder Hintergrund aufhellen, bis der jeweilige Mindestwert erreicht ist. Farbe nie als einziges Unterscheidungsmerkmal einsetzen.

Bedienbar

Zu prüfenWCAG 2.4.4 Linkzweck / 4.1.2 Name, Rolle, Wert

{n} Link(s) ohne erkennbaren Namen im HTML

Leere Links oder nur ein Icon/Bild ohne alt. Ein per JavaScript gesetztes aria-label wird hier nicht erkannt.

a

Das solltest du tun: Sichtbaren Linktext ergänzen, oder bei Icon-Links aria-label bzw. ein Bild mit alt verwenden.

Zu prüfenWCAG 1.3.1 Info und Beziehungen / 2.4.6 Überschriften und Beschriftungen

Keine <h1>-Überschrift im ausgelieferten HTML

Jede Seite sollte mit genau einer h1 beginnen. Bei per JavaScript aufgebauten Seiten kann die h1 erst im Browser entstehen — dann im gerenderten DOM prüfen.

body

Das solltest du tun: Eine aussagekräftige <h1> als erste Überschrift einfügen (möglichst schon serverseitig).

Schon richtig gelöst

Nächste Schritte

  1. {n} CSS-Regel{nPlural} mit möglicherweise zu geringem Textkontrast. Textfarbe abdunkeln oder Hintergrund aufhellen, bis der jeweilige Mindestwert erreicht ist. Farbe nie als einziges Unterscheidungsmerkmal einsetzen.
  2. {n} Link(s) ohne erkennbaren Namen im HTML. Sichtbaren Linktext ergänzen, oder bei Icon-Links aria-label bzw. ein Bild mit alt verwenden.
  3. Keine <h1>-Überschrift im ausgelieferten HTML. Eine aussagekräftige <h1> als erste Überschrift einfügen (möglichst schon serverseitig).
Diese Seite automatisch überwachen?

Wöchentlicher Re-Scan, JS-gerendert, E-Mail bei neuen Barrieren — kommt bald.

Barrierefreiheitserklärung erstellen →

Methodik & Grenzen

Geprüft wurde am 31.8.2026 das HTML, das contentglass.com beim ersten Aufruf ohne Login ausliefert, plus bis zu vier verlinkte CSS-Dateien derselben Domain. Geprüft: Farbkontrast (aus CSS), Textalternativen, Formular-Beschriftung, Bedienelement-Namen, Überschriften-Struktur, Seiten­titel und -sprache, Zoom-Sperre, doppelte IDs, positive tabindex-Werte, Landmarks.

Nicht geprüft: alles, was per JavaScript entsteht, Tastatur-Bedienbarkeit, sichtbarer Fokus, Fokus-Reihenfolge, Screenreader-Ansage, Inhalte hinter Login, Unterseiten. Der automatische Test findet grob 20–35 % der WCAG-Verstöße — der Rest braucht eine manuelle Prüfung. Momentaufnahme, kein Rechtsurteil.

Overlay-Widgets (Barrierefreiheits-Buttons, die Kontrast oder Schrift umschalten) stellen keine Konformität her — die gefundenen Barrieren müssen im Quellcode behoben werden. Warum Overlays nicht helfen

Andere Website prüfen