Kontrola kontrastu WCAG – súlad AA a AAA pre text
Táto kontrola kontrastu WCAG vypočíta kontrastný pomer medzi farbou popredia a farbou pozadia a potom ho porovná s požiadavkami AA alebo AAA pre bežný alebo veľký text. Živý náhľad zobrazuje text na jeho pozadí, aby vám pomohol posúdiť čitateľnosť. Prahové hodnoty sú 4.5:1 a 3:1 pre AA a 7:1 a 4.5:1 pre AAA.
Táto kontrola kontrastu WCAG vypočíta kontrastný pomer medzi farbou popredia a farbou pozadia. Výsledok hodnotí voči prahovým hodnotám WCAG AA a AAA pre bežný a veľký text a poskytuje živý náhľad, aby ste videli text na jeho pozadí. Použite ju na kontrolu kontrastu farieb a získanie jasného výsledku pri posudzovaní čitateľnosti.
Vyberte, či farby vyhodnotíte voči kritériám AA alebo AAA a či ide o bežný alebo veľký text. Pre AA je požadovaný kontrastný pomer 4.5:1 pre bežný text a 3:1 pre veľký text. Pre AAA sú prahové hodnoty 7:1 pre bežný text a 4.5:1 pre veľký text. Kontrola hlási, ako sa pomer porovnáva so zvolenou požiadavkou.
Farby popredia a pozadia majú v náhľade rôzne úlohy: popredie je farba textu a pozadie je farba za ním. Kontrola dvojice vám pomôže posúdiť ich kontrast spoločne, namiesto posudzovania ktorejkoľvek farby samostatne. Živý náhľad ponúka rýchlu vizuálnu kontrolu popri pomere a hodnotení.
Kontrola funguje úplne vo vašom prehliadači a váš vstup sa spracúva na vašom vlastnom zariadení; na server sa neodosielajú žiadne údaje. Funguje offline, akonáhle sa stránka načíta, a je zadarmo. Vývojári, dizajnéri a DevOps inžinieri ju môžu používať na kontrolu kombinácií farieb voči kritériám WCAG a zachytenie problémov s kontrastom skôr, než rozhranie zdieľajú alebo vydajú.
Krok 1: Zadajte farby popredia a pozadia, ktoré chcete skontrolovať. To sú dve farby, ktoré kontrola porovnáva.
Krok 2: Vyberte kritériá na vyhodnotenie. Kontrola hodnotí kontrast voči prahovým hodnotám AA alebo AAA pre bežný alebo veľký text.
Krok 3: Prezrite si kontrastný pomer a hodnotenie. Výsledok ukáže, či vybrané farby spĺňajú zvolené kritériá.
Krok 4: Skontrolujte živý náhľad. Keď vidíte text na jeho pozadí, ľahšie na prvý pohľad posúdite čitateľnosť.
Prípad použitia: Skontrolujte, či kombinácia farby popredia a pozadia spĺňa požadovanú prahovú hodnotu kontrastu WCAG, skôr než ju použijete v rozhraní.
Prípad použitia: Zachytite nevyhovujúcu kombináciu farieb skôr, než sa dostane k recenzentovi alebo používateľovi, aby ste ju mohli posúdiť skôr.
Prípad použitia: Získajte výsledok splnené/nesplnené s odôvodnením, namiesto spoliehania sa len na kontrastný pomer.
Prípad použitia: Živý náhľad použite na posúdenie, ako text vyzerá na svojom pozadí, pričom kontrolujete jeho kontrast.
Prípad použitia: Skontrolujte bežný a veľký text voči kritériám AA alebo AAA, keď potrebujete vyhodnotiť rôzne požiadavky na text.
Prípad použitia: Overte navrhovanú kombináciu farieb voči prahovým hodnotám, ktoré váš projekt musí dodržiavať.