Nu de interesse in webaccessibility toeneemt, werken wij via onze accessibility-diagnosediensten aan de ontwikkeling van tools die diagnoses "eenvoudiger en duidelijker" maken.
Als eerste stap is de Chrome-extensie "Area Contrast Checker" uitgebracht.
Achtergrond van de ontwikkeling
Er bestaan grofweg drie soorten contrastcheckers, en elk heeft zowel voor- als nadelen.
- Automatische scan
is efficiënt omdat deze de pagina als geheel machinaal analyseert, maar bij achtergronden met afbeeldingen of verlopen is de kans op foutmeldingen en gemiste detectie groot. - Pipet-type (kleurkiezer)
meet de kleur precies zoals die er wordt gezien, maar omdat er per punt handmatig wordt gemeten, kost het veel werktijd. - Elementgericht type
is eenvoudig omdat het rechtstreeks HTML/CSS-informatie gebruikt, maar afbeeldingen kunnen niet worden gecontroleerd, en overlappende elementen of transparantie worden soms niet correct weergegeven zoals ze daadwerkelijk worden gerenderd.
De ontwikkeling begon vanuit de vraag die we in de praktijk hadden: "Is er geen manier die eenvoudig is, nauwkeurig is en overal kan worden gebruikt?"
Een vierde aanpak, die er tot nu toe niet was
Als antwoord daarop is dit de vierde aanpak, 'gebiedsanalyse', die we in de Area Contrast Checker hebben uitgewerkt.
Sleep een gebied om te selecteren waarvan u de kleuren wilt controleren. De pixels binnen dat gebied worden geanalyseerd en de achtergrond- en voorgrondkleur worden automatisch gedetecteerd. Omdat het gaat om wat de gebruiker daadwerkelijk ziet, werkt dit ook bij overlappende elementen en kan ook afbeeldingen worden gecontroleerd.
U kunt eenvoudig elk gewenst punt controleren door het te slepen.
Belangrijkste functies
▪️Beoordeling van WCAG 2.1 / 2.2-conformiteit
Op basis van succescriteria 1.4.3, 1.4.6 en 1.4.11 beoordeelt de tool het contrast van 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), een nieuw contrastcriterium dat wordt overwogen voor WCAG 3.0. Direct zichtbaar tot welke lettergrootte de conformiteit geldt (Lc-waarde).
▪️Kleursuggesties die de tint behouden
Als de contrastverhouding onvoldoende is, stelt de tool een vergelijkbare kleur voor die aan de norm voldoet en de oorspronkelijke tint (Hue) behoudt.
▪️Geavanceerde functies voor professionals
Ondersteunt de kleurformaten HEX, RGB en HSL.
Wilt u het automatisch gedetecteerde resultaat verfijnen? Dan kunt u met de pipet per pixel opnieuw een kleur selecteren.
Beschikbaar in twee talen: Japans en Engels.
Download hier de Area Contrast Checker
Bij Liberogic streven we ernaar toegankelijkheid niet als 'speciale aandacht' te behandelen, maar als een vanzelfsprekende kwaliteitseis.
Alles wat we in webontwikkeling en toegankelijkheidsonderzoek hebben gemist en graag hadden willen hebben, hebben we in deze tool verwerkt. We blijven tools uitbrengen die toegankelijkheid dichterbij en eenvoudiger maken. Blijf op de hoogte.
