Met toenemende belangstelling voor webaccessibility hebben we via ons accessibility diagnosticaservices tools ontwikkeld die diagnostiek ondersteunen met "gemakkelijker en begrijpelijker".
Als eerste stap heeft de Chrome-extensie "Area Contrast Checker" zijn release aangekondigd.
Achtergrond van de ontwikkeling
Traditionele contrastcheckers zijn grofweg in drie soorten onder te verdelen, elk met zijn voor- en nadelen.
- Automatisch scantype
: efficiënt omdat het hele pagina's mechanisch extraheert, maar het risico op valse positieven en gemiste detecties is groot wanneer achtergronden afbeeldingen of gradiënten zijn. - Pipettype (kleurkiezer)
: meet kleuren nauwkeurig zoals ze er uitzien, maar omdat kleurinformatie handmatig per locatie wordt geëxtraheerd, vraagt dit veel werkuren. - Elementspecificatietype
: eenvoudig omdat het rechtstreeks HTML/CSS-informatie raadpleegt, maar afbeeldingen kunnen niet worden gecontroleerd en werkelijke renderingstatus zoals overlappende elementen en transparantie kan niet altijd correct worden vastgesteld.
Uit de praktische behoefte "Kan er niet een methode zijn die eenvoudig, nauwkeurig en overal detecteerbaar is?" ontstond de ontwikkeling.
Een vierde benadering zonder precedent
Als "antwoord" hierop hebben we "area-analyse" - een vierde benadering in Area Contrast Checker - concreet vorm gegeven.
Selecteer het gebied dat u wilt controleren door het in te sluiten met uw cursor. Het gereedschap analyseert de pixels in dat gebied en detecteert automatisch twee kleuren: achtergrondkleur en voorgrondkleur. Omdat het gereedschap zich richt op wat gebruikers werkelijk zien, kunnen overlappende elementen worden genegeerd en kunnen ook afbeeldingen worden gecontroleerd.
U kunt eenvoudig controleren wat u wilt door simpelweg over het gewenste gebied te slepen.
Hoofdfuncties
▪️WCAG 2.1 / 2.2 conformiteitsbeoordelingen
op basis van succesvoleringscriteria 1.4.3, 1.4.6 en 1.4.11. Het gereedschap evalueert contrastverhouding voor normale tekst (AA: 4,5:1, AAA: 7:1), grote tekst (AA: 3:1, AAA: 4,5:1) en UI-componenten (AA: 3:1).
▪️Ondersteuning voor de volgende generatie standaard APCA
ondersteunt APCA (Accessible Perceptual Contrast Algorithm), de nieuwe contraststandaard die wordt overwogen in het WCAG 3.0-concept. Toont onmiddellijk tot welke tekengrootte (Lc-waarde) conformiteit is bereikt.
▪️Kleurassistent met behouden kleurint
Wanneer de contrastverhouding onvoldoende is, suggereert het gereedschap vergelijkbare kleuren die aan de norm voldoen terwijl de oorspronkelijke kleurint (Hue) behouden blijft.
▪️Geavanceerde functies voor professionals
・Ondersteunt HEX-, RGB- en HSL-kleurformaten.
・Wanneer u de automatisch gedetecteerde resultaten wilt verfijnen, kunt u de kleurkiezer pixel voor pixel opnieuw selecteren.
・Ondersteuning voor twee talen: Japans en Engels
Download Area Contrast Checker hier
Bij Liberogic beschouwen we toegankelijkheid niet als een "speciale maatregel", maar als "standaardkwaliteit".
We hebben jaren ervaring in webontwikkeling en toegankelijkheidsaudit opgebouwd, en dit gereedschap bevat alles wat we ons altijd hebben gewenst. We zullen doorgaan met het uitbrengen van gereedschappen die toegankelijkheid dichter bij u brengen en soepeler maken. We hopen dat u daarop verheugd bent.