# Prvky musí splňovat prahové hodnoty minimálního kontrastního poměru barev

<https://www.fixreports.com/cs/issues/color-contrast>

WCAG 1.4.3 Contrast (Minimum) · úroveň AA

Část textu se dostatečně neodlišuje od pozadí, takže ji lidé se slabým zrakem nepřečtou.

## Co toto pravidlo kontroluje
Ověřuje, že kontrast mezi barvou popředí a pozadí splňuje prahové hodnoty minimálního kontrastního poměru WCAG 2 AA.

## Proč na tom záleží
WCAG 1.4.3 vyžaduje kontrastní poměr nejméně 4.5:1 pro běžný text a 3:1 pro velký text. Bledé ceny, štítky a bannery se špatně čtou lidem se slabým zrakem a na ostrém světle všem.

## Jak to opravit
### Na jakémkoli webu
1. Najděte text s nízkým kontrastem a poznamenejte si barvu textu a pozadí: obojí ukáže nástroj pro kontrolu kontrastu nebo vývojářské nástroje prohlížeče.
2. Upravte barvu textu nebo pozadí v CSS svého motivu, dokud poměr nebude alespoň 4.5:1 (3:1 pro text od 24px výše nebo 18,66px tučně).
3. Zvláštní pozornost věnujte štítkům slev, zástupnému textu (placeholder), odkazům v patičce a tlačítkům na obrázcích.

### V Shopify
1. Najděte text s nízkým kontrastem a poznamenejte si barvu textu a pozadí: obojí ukáže nástroj pro kontrolu kontrastu nebo vývojářské nástroje prohlížeče.
2. V nabídce Online obchod > Motivy > Přizpůsobit > Nastavení motivu > Barvy ztmavte barvu textu nebo zesvětlete pozadí u dotčeného barevného schématu, dokud poměr nebude alespoň 4.5:1.
3. Zvláštní pozornost věnujte štítkům slev, zástupnému textu (placeholder), odkazům v patičce a tlačítkům na obrázcích.

### Ve WooCommerce a WordPressu
1. Najděte text s nízkým kontrastem a poznamenejte si barvu textu a pozadí: obojí ukáže nástroj pro kontrolu kontrastu nebo vývojářské nástroje prohlížeče.
2. Upravte barvu textu nebo pozadí v CSS svého motivu, dokud poměr nebude alespoň 4.5:1 (3:1 pro text od 24px výše nebo 18,66px tučně).
3. Zvláštní pozornost věnujte štítkům slev, zástupnému textu (placeholder), odkazům v patičce a tlačítkům na obrázcích.

## Jak opravu ověřit
- Spusťte sken znovu a ověřte, že se color-contrast už mezi chybami neobjevuje.
- Namátkově ověřte přesné barvy nástrojem pro kontrolu kontrastu.

## Zdroje
- Dokumentace pravidla axe-core (Deque): https://dequeuniversity.com/rules/axe/4.13/color-contrast
- Vysvětlení kritéria WCAG 1.4.3 (W3C): https://www.w3.org/WAI/WCAG22/Understanding/contrast-minimum