WCAG AAA: doporučení Priorita: Drobné
Text nedosahuje zvýšeného kontrastu (AAA)
Část textu splňuje základní úroveň kontrastu, ale ne přísnější: 7:1 pro běžný text a 4.5:1 pro velký. Jde o doporučený postup nad rámec WCAG AA, nikoli o povinný požadavek.
Tento text byl přeložen automaticky a rodilý mluvčí ho zatím nezkontroloval.
Proč na tom záleží vašim zákazníkům
Vyšší kontrast pomáhá zákazníkům se středně oslabeným zrakem, starším lidem a všem, kdo čtou z telefonu na slunci. Ceny a tlačítka jsou čitelnější pro všechny, ale jeho absence není porušením úrovně AA, o kterou se zákon opírá.
Koho se to týká
- slabozrací lidé
- starší zákazníci
- lidé s poruchami barevného vidění
- lidé na mobilu při jasném světle
Jak to opravit
Kde je to praktické, zvyšte kontrast na 7:1 pro běžný text a 4.5:1 pro velký (24px nebo 18.66px tučně), nejdřív u hlavního textu, cen a pokladny. Ztmavte barvy textu nebo zesvětlete pozadí v design tokenech nebo CSS. Nejprve opravte základní problémy s kontrastem 4.5:1 (pravidlo color-contrast); tato kontrola je jen doplňkový tip.
V Shopify
Obvykle vychází z barevného schématu šablony. Zvolte tmavší barvy textu v nastavení barev v editoru šablony; pokud jsou barvy pevně v kódu, změňte je v CSS šablony.
V Shoptet (CZ)
Obvykle vychází ze zvolené šablony a jejího nastavení barev. Zvolte tmavší barvy textu v nastavení šablony nebo přidejte vlastní CSS přes možnosti vlastního kódu v Shoptetu.
V PrestaShop
Obvykle definováno v CSS šablony. Přepište barvy ve vlastním souboru CSS šablony nebo v podřazené šabloně; některé šablony mají volby barev ve svém konfiguračním modulu.
V WooCommerce
Obvykle je určuje aktivní šablona nebo page builder. Upravte barvy v Customizeru šablony nebo v globálních stylech, případně je přepište v CSS podřazené šablony.
Normy
| Norma | Bod |
|---|---|
| WCAG 2.2 | 1.4.6 (AAA) Contrast (Enhanced) |
| WCAG 2.1 | 1.4.6 (AAA) Contrast (Enhanced) |
| WCAG 2.0 | 1.4.6 (AAA) Contrast (Enhanced) |
Automatická kontrola: pravidlo axe-core color-contrast-enhanced.
dequeuniversity.com, github.com, www.w3.org
Podobné kontroly
-
Text nedosahuje zvýšeného kontrastu (AAA)
WCAG 1.4.6 AAA
-
Odkazy se stejným textem vedou na různá místa
WCAG 2.4.9 AAA
-
Stránka se po čase sama obnoví, i po dlouhé době
WCAG 2.2.4 AAA