Testa kontraster – Colour Contrast Analyser

Ett mycket enkelt sätt att öka tillgängligheten på en webbplats, speciellt för människor med nedsatt synförmåga, är att se till att färgerna som används uppfyller kontrastkraven. Tyvärr ser vi ofta färger på webbplatser som inte når upp till det grundläggande kravet. På webbriktlinjer.se kan du läsa:

”De flesta kan läsa brödtext på skärm om skillnaden i ljusintensitet mellan förgrund och bakgrund har förhållandet 4,5:1. Därför har WCAG-standarden detta förhållande som grundkrav.”

Det finns mängder med program och plugins som kan kontrollera kontrasten mellan två färger. Men vi gillar Colour Contrast Analyser som får bli vårat första val som kontrastverktyg.

Det är ett enkelt och tydligt program där du med hjälp av en pipett eller HEX-färgkoder kan välja färger du vill testa. Du får snabbt ett resultat om du uppfyller kontrastkraven eller inte. Dessutom finns det vissa undantag vid stor eller fet text eller om färgerna används i till exempel ikoner eller bilder. De undantagen presenteras också i programmet. Du kan även se hur färgerna uppfattas av människor med olika typer av färgblindhet. Något vi har märkt är att pipetten för att välja färg inte alltid visar helt rätt så är du osäker bör du plocka ut färgkoden med till exempel Chrome DevTools.

Skärmbild på programmet Colour Contrast Analyser
Colour Contrast Analyser
Skärmbild från programmet Colour Contrast Analyser. Visar de valda färgerna med simulering av olika former av färgblindhet.
Hur färger kan uppfattas vid färgblindhet
Skärmbild på programmet Colour Contrast Analyser. Detaljvy.
Verktyget förklarar kontrastkraven

Ladda ner Colour Contrast Analyser (öppnas i nytt fönster)

Läs mer om färger och relaterade WCAG-riktlinjer på andra webbplatser

Alla länkar öppnas i nytt fönster