Tipps zu Entwicklertools: Text mit niedrigem Kontrast erkennen und korrigieren

Sofia Emelianova
Sofia Emelianova

Text mit niedrigem Kontrast ist das größte Problem bei der Barrierefreiheit im Web. Im Februar 2022 trat dieses Problem bei 83, 9% der beliebtesten Millionen Startseiten auf. Weitere Informationen finden Sie im WebAIM Million 2022 Report.

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

In diesem Video erhalten Sie Informationen zu folgenden Themen:

  • Sehen Sie sich die Kontrastverhältnisse in der Kurzinfo des Inspector-Modus und die empfohlenen Verhältniswerte in der Farbauswahl an.

    Kontrastverhältnisse sind in einer Kurzinfo verfügbar. Mit einer Farbauswahl können Sie das Verhältnis alternativer Farben messen. AA- und AAA-Benotung der Ration ist möglich.

  • Wählen Sie in der Farbauswahl die vorgeschlagenen Farben oder eine Farbe unter den Linien mit dem Kontrastverhältnis aus, um die WebAIM-Richtlinien einzuhalten.

    Empfohlene Kontrastlinien sind in der Farbauswahl der Farbauswahl verfügbar.

  • Entdecken Sie alle Kontrastprobleme in den Bereichen CSS-Übersicht und Probleme in der Vorschau.

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

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

    Unkenntlich gemachtes Bild auf dem Tab „Rendering“ ausgewählt und im Darstellungsbereich emuliert

Weitere praktische Informationen finden Sie in der Anleitung Lesbarkeit Ihrer Website verbessern.

Weitere Informationen erhalten Sie unter: