Az ellenőrző a WCAG hivatalos relatív-luminancia-képletét alkalmazza, ezért számai megegyeznek a WebAIM-ellenőrzőével és a legtöbb akadálymentesítési auditéval. Minden a böngésződben fut - a színek nem kerülnek feltöltésre, és nincs korlát.
Színkontraszt-ellenőrző
Teljesen a böngésződben fut - feltöltés és regisztráció nélkül.
Kontrasztarány
Megfelelszükséges 4.5:1
Megfelelszükséges 3:1
Nem felel megszükséges 7:1
Megfelelszükséges 4.5:1
Nagy szöveg = 18pt (24px), vagy 14pt (18,66px) félkövéren.
Mi az a színkontraszt-ellenőrző?
A színkontraszt-ellenőrző megméri a szöveg és a háttér kontrasztarányát, és megmutatja, hogy az megfelel-e a WCAG akadálymentesítési szabványnak. Az eredmény 1:1-től 21:1-ig terjedő arány, amelyhez AA és AAA minősítést is kapsz - normál és nagy szövegméretre egyaránt.
Így működik
- 1Add meg a színeket. Gépelj be egy hex-kódot, rgb()-értéket vagy CSS-színnevet a szöveghez és a háttérhez, vagy válassz a színmintákkal.
- 2Olvasd le az arányt. A kontrasztarány élőben frissül, előnézettel együtt - látod, hogyan néz ki a szöveg a háttéren.
- 3Nézd meg a minősítéseket. Minden jelvény megmutatja, hogy a WCAG AA és AAA normál, illetve nagy szövegre teljesül-e vagy sem.
Kinek hasznos
- Tervezőknek, akik a márkakolórokat tesztelik a fejlesztés előtt.
- Frontend-fejlesztőknek, akik gomb-, link- és feliratszíneket ellenőriznek a WCAG AA szerint.
- Akadálymentesítési auditoroknak, akik pontos arányokkal dokumentálják a kontraszthibákat.
- Tartalom- és e-mail-csapatoknak, akik megbizonyosodnak arról, hogy a szöveg színes háttéren is olvasható marad.
Gyakori kérdések
Ingyenes a színkontraszt-ellenőrző?
Igen - teljesen ingyenes, regisztráció és korlát nélkül. A böngésződben fut.
Mekkora kontrasztarányra van szükség a WCAG AA-hoz?
A WCAG 2.1 AA-szint legalább 4,5:1 arányt ír elő normál szövegre, és 3:1-et nagy szövegre. Az AAA-szint ezt 7:1-re emeli normál szövegnél, nagy szövegnél pedig 4,5:1-re.
Mi számít nagy szövegnek?
Nagy szöveg legalább 18pt (kb. 24px) normál súllyal, vagy 14pt (kb. 18,66px) félkövéren. A nagy szövegnél megengedett az alacsonyabb kontrasztarány, mert a nagyobb betűk könnyebben olvashatók.
Hogyan számítják ki a kontrasztarányt?
A képlet: (L1 + 0,05) / (L2 + 0,05), ahol L1 és L2 a világosabb és a sötétebb szín relatív luminanciája. A luminanciát az sRGB vörös, zöld és kék csatornájából számítják a WCAG 2.x definíciója szerint.
Támogatja a hex, az RGB és a színneveket?
Igen. Megadhatsz 3, 4, 6 vagy 8 jegyű hex-kódot, rgb()- és rgba()-értéket, vagy bármilyen CSS-színnevet - például a teal-t. Szín is kiválasztható a natív színmintával.
Miért teljesül vagy bukik meg ugyanaz az arány más-más esetben?
A szükséges arány a szövegmérattól és a célzott szinttől függ. Egy 3,5:1 arány megbukik az AA-n normál szövegnél, de átmegy az AA-n nagy szövegnél - ezért mindig a ténylegesen használt mérethez és szinthez viszonyíts.