Tipps zu Entwicklertools: Text mit niedrigem Kontrast erkennen und korrigieren

Sofia Emelianova
Sofia Emelianova
GitHub

Text mit niedrigem Kontrast ist das größte Problem hinsichtlich der Barrierefreiheit im Web. Im Februar 2022 trat dieses Problem bei 83, 9% der Millionen Startseiten auf. Weitere Informationen findest du im WebAIM Million 2022-Bericht.

Mit den Chrome-Entwicklertools können Sie alle Kontrastprobleme auf einen Blick erkennen und sie mit nur einem Klick beheben.

In diesem Video erfahren Sie, wie Sie:

  • Kontrastverhältnisse finden Sie in der Kurzinfo des Prüftools. Die empfohlenen Verhältniswerte finden Sie in der Farbauswahl.

    Kontrastverhältnisse sind in einer Kurzinfo verfügbar und enthalten eine Farbauswahl, um das Verhältnis alternativer Farben zu messen. Die Bewertung der Ration mit AA- und AAA-Standard ist verfügbar.

  • Wähle in der Farbauswahl die vorgeschlagenen Farben oder eine Farbe unter den Kontrastverhältnislinien aus, um die WebAIM-Richtlinien zu erfüllen.

    Die empfohlenen Kontrastlinien sind in der Schattierungsvorschau der Farbauswahl verfügbar.

  • Alle Kontrastprobleme finden Sie in den Bereichen CSS-Übersicht und Probleme (Vorabversion).

    Kontrastprobleme, die im Bereich „CSS-Übersicht“ und auf dem Tab „Probleme“ aufgeführt sind.

  • Simulieren Sie Sehschwächen, um zu verstehen, wie Ihre Seite für alle Nutzer aussieht.

    Auf dem Tab „Rendering“ ist eine verschwommene Sicht ausgewählt und im Darstellungsbereich emuliert.

Weitere praktische Informationen finden Sie in der Anleitung Website lesbarer machen.

Weitere Informationen erhalten Sie unter: