Co znamená kontrastní poměr
Kontrastní poměr vyjadřuje rozdíl mezi světlostí barvy popředí a pozadí.
Vyšší číslo obecně znamená výraznější rozdíl mezi oběma barvami.
Nejde pouze o to, zda jsou barvy na první pohled „světlé“ nebo „tmavé“. Dvě vizuálně odlišné barvy mohou mít z hlediska vypočteného kontrastu stále nedostatečný rozdíl.
Proto je užitečné pracovat s vypočteným poměrem místo samotného odhadu podle obrazovky.
Jak číst běžné hodnoty WCAG pro text
Pro text se běžně posuzují různé prahové hodnoty podle úrovně a velikosti textu.
WCAG Level AA používá pro běžný text minimální kontrast 4,5:1 a pro velký text 3:1.
Přísnější Level AAA používá 7:1 pro běžný text a 4,5:1 pro velký text.
Tento nástroj porovnává zadané barvy přímo s těmito oficiálními prahovými hodnotami a zobrazuje přehledné vyhodnocení pro běžný text, velký text i prvky uživatelského rozhraní.
Nevyhodnocujte jen samotné číslo bez kontextu
Stejný kontrastní poměr nemusí být použit ve stejné situaci.
Při návrhu zvažte:
- zda jde o běžný nebo velký text
- zda je text důležitý pro ovládání stránky
- zda se barva mění při hoveru nebo focusu
- zda stejná dvojice funguje i v různých stavech rozhraní
Barva by neměla být jediným nositelem informace
Dobrý kontrast je důležitý, ale přístupnost barev nekončí u kontrastního poměru.
Pokud je například chyba označena pouze změnou barvy, část uživatelů může informaci přehlédnout.
Kde je to důležité, kombinujte barvu s textem, ikonou, tvarem nebo jiným srozumitelným signálem.
Testujte skutečné barvy textu a pozadí
Pro užitečný výsledek zadejte barvy, které budou skutečně použity společně.
Pokud je text umístěn přes jinou vrstvu, poloprůhledný podklad nebo přechod, zadejte výslednou barvu, která se pod textem skutečně zobrazí na obrazovce.
Co tento checker neověřuje
Výsledek jedné dvojice barev nepotvrzuje přístupnost celé stránky.
Další části přístupnosti mohou zahrnovat například strukturu obsahu, ovládání klávesnicí, popisky formulářů, focus stavy a způsob předávání informací.
Používejte tento nástroj pro jeho konkrétní úkol: spolehlivou kontrolu kontrastu zvolených barev.
Časté otázky ke kontrole kontrastu barev
Je vyšší kontrastní poměr vždy lepší?
Vyšší poměr znamená větší rozdíl mezi posuzovanými barvami, ale návrh je stále potřeba hodnotit v kontextu skutečného použití textu a rozhraní.
Jaký kontrast potřebuje běžný text pro WCAG AA?
Pro běžný text je u kritéria kontrastu WCAG AA používána hranice 4,5:1. Velký text má nižší hranici 3:1.
Znamená výsledek „Pass“, že je celý web přístupný?
Ne. Pokud checker zobrazuje vyhovující výsledek, vztahuje se k testované barevné dvojici a příslušnému kontrastnímu kritériu, nikoli k celé přístupnosti webu.
Mohu tímto nástrojem otestovat celý web?
Tento nástroj je určen pro přesné porovnání zadaných barev popředí a pozadí, nikoli pro automatický audit celého webu.