Da das Interesse an Webaccessibility wächst, haben wir uns durch die Bereitstellung von Accessibility-Diagnosedienstleistungen der Entwicklung von Tools widmet, die Diagnosen „einfacher und verständlicher" unterstützen.
Als erste Initiative wurde die Chrome-Erweiterung „Area Contrast Checker" veröffentlicht.
Hintergrund der Entwicklung
Herkömmliche Kontrastprüfer lassen sich grob in drei Kategorien einteilen, und jede hat ihre Vor- und Nachteile.
- Automatisierte Scan-
Typ: Obwohl die maschinelle Extraktion aus der gesamten Seite effizient ist, gibt es den Nachteil, dass Fehlererkennungen und Erkennungslücken auftreten, wenn der Hintergrund ein Bild oder ein Farbverlauf ist. - Farbwähler-Typ (Pipette)
Mit dieser Methode können Sie die Farben so genau messen, wie Sie sie sehen, aber da Sie die Farbe manuell an jeder Stelle einzeln extrahieren müssen, ist der hohe Arbeitsaufwand ein Nachteil. - Elementauswahl ist
einfach, da direkt auf HTML/CSS-Informationen zugegriffen wird, aber Bilder können nicht geprüft werden und der tatsächliche Renderzustand wie Überlagerung von Elementen oder Transparenz wird möglicherweise nicht korrekt erfasst.
„Wäre es nicht möglich, eine Methode zu entwickeln, die einfach zu bedienen ist, hohe Genauigkeit bietet und überall einsatzbar ist?" – aus diesem Gedanken der praktischen Anforderungen heraus ist die Entwicklung entstanden.
Der vierte Ansatz, den es bisher noch nicht gab
Als „Antwort" darauf haben wir mit dem „Area Contrast Checker" einen vierten Ansatz entwickelt: die „Flächenanalyse".
Wählen Sie den gewünschten Bereich durch Ziehen aus. Das Tool analysiert die Pixel in diesem Bereich und erkennt automatisch zwei Farben: die Hintergrundfarbe und die Vordergrundfarbe. Da das tatsächlich angezeigte Bild das Ziel ist, können Sie auch überlappende Elemente und Bilder prüfen.
Sie können es ganz einfach überprüfen, indem Sie einfach über den gewünschten Bereich ziehen.
Hauptfunktionen
▪️ WCAG 2.1 / 2.2 Konformitätsprüfung
Basierend auf den Erfolgskriterien 1.4.3, 1.4.6 und 1.4.11 wird das Kontrastverhältnis für gewöhnlichen Text (AA: 4.5:1, AAA: 7:1), großen Text (AA: 3:1, AAA: 4.5:1) und UI-Komponenten (AA: 3:1) bewertet.
▪️ Unterstützung für den nächsten Standard APCA
Unterstützt APCA (Accessible Perceptual Contrast Algorithm), das neue Kontrastkriterium, das in den WCAG 3.0-Entwürfen diskutiert wird. Die Lc-Werte zeigen sofort an, für welche Schriftgrößen die Konformität besteht.
▪️ Farbvorschläge mit erhaltener Farbtonigkeit
Wenn das Kontrastverhältnis nicht ausreichend ist, werden ähnliche Farben vorgeschlagen, die den Standard erfüllen und dabei den ursprünglichen Farbton (Hue) beibehalten.
▪️ Erweiterte Funktionen für Profis
• Unterstützt die Farbformate HEX, RGB und HSL.
• Bei Bedarf können Sie die Ergebnisse der automatischen Erkennung in Pixelgenauigkeit mit der Farbauswahl anpassen.
• Verfügbar in zwei Sprachen: Japanisch und Englisch
Laden Sie Area Contrast Checker herunter
Liberogic verfolgt das Ziel, Accessibility nicht als "spezielle Maßnahme", sondern als "selbstverständliche Qualität" zu etablieren.
Wir haben die Wünsche, die wir bei der Web-Entwicklung und Accessibility-Diagnose gespürt haben, in dieses Tool eingefloßt. Wir werden weiterhin Tools entwickeln und veröffentlichen, um Accessibility näher und reibungsloser zu gestalten. Wir freuen uns auf zukünftige Entwicklungen.
