Prüfe den Farbkontrast deiner Website kostenlos

Wenn die Hintergrundfarbe deiner Website den für Text und andere UI-Elemente verwendeten Farben zu ähnlich ist, kann es für einige Besucher schwierig sein, deine Seite zu lesen und zu verstehen.

Gib einfach zwei Hexadezimalwerte ein, und unser Tool sagt dir, ob die Farbkombination die Anforderungen der WCAG 2.2 erfüllt.

Textfarbe

Hintergrundfarbe

Kontrastverhältnis: 21:1 SUPER

Mach deine Website für alle leicht lesbar

Farben mit geringem Kontrast erschweren es Besuchern, sich zurechtzufinden. Sorge dafür, dass dein Text stets den Barrierefreiheitsstandards entspricht.

Textgröße	AA (Minimum)	AAA (Erweitert)
Kleiner Text
Großer Text

Kleiner Text = normale Schriftstärke unter 16 px, großer Text = fette Schriftstärke über 18 px.

Willst du deine gesamte Website auf einmal prüfen?

Unser automatisiertes Tool scannt all deine Seiten gleichzeitig, hebt Probleme beim Farbkontrast hervor und gibt dir klare Empfehlungen. Nur eine weitere Möglichkeit, wie wir dir helfen, die laufende Barrierefreiheits-Compliance zu vereinfachen.

Preise ansehen

Wie interpretiert man Farbkontrastverhältnisse?

Für normalen Text, der kleiner als 24 px bzw. kleiner als 18 pt ist, verlangt WCAG Level AA ein Farbkontrastverhältnis von mindestens 4,5:1 Level AAA erfordert ein Verhältnis von 7:1 oder höher.

Für großen Text, also ≥ 24 px oder ≥ 18 pt, verlangt WCAG Level AA ein Farbkontrastverhältnis von mindestens 3:1. Level AAA erfordert ein Verhältnis von mindestens 4,5:1.

Wie interpretiert man Farbkontrastverhältnisse?

Warum Farbkontrast wichtig ist

Warum ist Farbkontrast für Menschen mit Beeinträchtigungen so wichtig?

Website-Besucher mit Sehbeeinträchtigungen müssen zwischen deinem Inhalt und dem Hintergrund deiner Website unterscheiden können – genau hier spielt der Farbkontrast eine entscheidende Rolle.

Besuchern ein barriereärmeres Online-Erlebnis zu bieten, ist das ethisch Richtige. Es gibt jedoch einen weiteren wichtigen Grund, warum du sicherstellen solltest, dass deine Website die WCAG-Anforderungen zum Farbkontrast erfüllt.

Erfahre mehr über ADA-Farbkonformität für deine Website and ADA-Compliance.

Bleib compliant und geschützt

Im Jahr 2023 wurden 2.794 Klagen wegen digitaler Barrierefreiheit vor US-Bundesgerichten eingereicht. Wenn du den Farbkontrast deiner Website proaktiv prüfst, schützt du dich vor Abmahnungen, kostspieligen Klagen und einem beschädigten Ruf.

Wie funktioniert es?

Ein Farbkontrast-Checker ist ein vielseitiges Tool zum Testen von Webseiten, Infografiken, Diashows und mehr. Er ist unverzichtbar für Webdesigner und Website-Betreiber und sorgt für eine bessere Nutzererfahrung für alle – auch für Menschen mit Sehbeeinträchtigungen.

Häufig gestellte Fragen und Antworten

Kann ich mit dem kostenlosen Farbkontrast-Tool jede Seite meiner Website prüfen?

Der kostenlose Checker ist für manuelle, einmalige Farbprüfungen gedacht. Wenn du deine gesamte Website auf einmal scannen, alle Farbkontrastprobleme hervorheben und priorisierte Empfehlungen erhalten möchtest, ist die Nutzung unseres automatisierten Barrierefreiheits-Scanners schneller und einfacher.

Preise anzeigen

Überwacht euer Tool meine Domain automatisch auf Compliance-Probleme?

Ja, wir scannen Ihre gesamte Domain alle sieben Tage erneut und verfolgen sowohl neue Verstöße als auch behobene Probleme. Dieser Nachweis hilft, Ihre laufenden Bemühungen um Barrierefreiheit im Falle rechtlicher Beweiserfordernisse zu demonstrieren.

Bedeutet das Bestehen eines Farbkontrasttests, dass meine Website vollständig barrierefrei ist?

Nicht ganz. Farbkontrast ist ein wichtiger Faktor, aber Barrierefreiheit umfasst auch Tastaturnavigation, Screenreader-Unterstützung, eine korrekte Überschriftenstruktur und mehr. Ein vollständiger Website-Scan sollte alle WCAG-Anforderungen abdecken – nicht nur den Farbkontrast.

Erhalte ich Schritt-für-Schritt-Anleitungen zur Fehlerbehebung?

Ja! Für jedes Problem, das unser Tool erkennt, erhalten Sie detaillierte Schritt-für-Schritt-Anweisungen – zusammen mit dem genauen fehlerhaften Element, seinem CSS-Selektor, bewährten Methoden zur Behebung und häufigen Fallstricken, die es zu vermeiden gilt. Wir gruppieren auch ähnliche Probleme über mehrere Seiten hinweg, sodass Sie sie alle auf einmal angehen können, was den Behebungsprozess schneller und effizienter macht.

Muss ich irgendetwas in meine Website integrieren?

Nein. Unser Tool kann jede Website scannen – unabhängig von ihrem CMS – ohne direkte Integration. Fügen Sie einfach Ihre Domain oder XML-Sitemap hinzu, und wir entdecken und scannen jede Seite und melden WCAG-Konformitätsprobleme basierend auf dem von Ihnen gewählten Standard (WCAG 2.1 A–AAA oder WCAG 2.2 AA).

Welche weiteren Barrierefreiheitsprüfungen kann das kostenpflichtige Tool durchführen?

Unser automatisiertes Barrierefreiheits-Tool wurde entwickelt, um deine Website anhand der neuesten WCAG-Standards sowie verschiedener globaler Vorschriften zu testen, darunter ADA, Section 508, AODA und EAA.

Pläne ansehen und registrieren

Prüfen Sie die Zugänglichkeitskompatibilität Ihrer Website

Prüft die Einhaltung von: WCAG ADA EAA Section 508 AODA