Archiv rubriky: Přístupnost webu

A11y Color Palette: nástroj pro měření kontrastu barev

Máte k dispozici paletu barev a potřebujete z ní vybrat takové kombinace, které jsou vzájemně dostatečně kontrastní? Šikovným nástrojem, který může tuto činnost usnadnit, během chvilky porovnat vzájemný kontrast zadaných barev a vyhodnotit jejich soulad s požadavky metodiky WCAG 2.1 na dostatečný barevný kontrast, je A11y Color Palette.

Požadavky na minimální kontrast

  • AA běžný / velký text: 4,5:1 / 3:1 – minimální kontrastní poměr pro běžné písmo do velikosti 18 bodů nebo tučné písmo do velikosti 14 bodů je 4,5:1. Pro běžné písmo nad 18 bodů nebo tučné písmo nad 14 bodů je minimální kontrastní poměr 3:1.
  • AA netextové objekty: 3:1 – pro prvky uživatelského rozhraní a grafické objekty je minimální kontrastní poměr 3:1
  • AAA běžný / velký text: 7:1 / 4,5:1 – minimální kontrastní poměr pro běžné písmo do velikosti 18 bodů nebo tučné písmo do velikosti 14 bodů je 7:1. Pro běžné písmo nad 18 bodů nebo tučné písmo nad 14 bodů je minimální kontrastní poměr 4,5:1.

Hodnoty AA a AAA vyjadřují míru důležitosti (hodnota AA v kontextu metodiky WCAG 2.1 odpovídá střední úrovni, hodnota AAA úrovni nejnižší).

Jak nástroj funguje?

Jeho použití je velmi jednoduché. Nástroj (nebo chcete-li jednoduchou webovou aplikaci) najdete na adrese a11yrocks.com/colorPalette/. Do editačního pole Colors (comma separated HEX) zadáte hexadecimální kód barev, jejichž vzájemný kontrast chcete porovnat (nástroj k nim automaticky přidá černou a bílou), potvrdíte tlačítko Create Palette a to je vše.

A11y Color Palette jako výsledek vrátí paletu dvojic barevných kombinací, které jsou seřazeny podle míry vzájemného kontrastu (čím jsou barvy vzájemně kontrastnější, tím jsou v tabulce výše). Kromě vizuální reprezentace obsahuje každá dvojice i informace textové:

  • 21:1 – hodnota kontrastního poměru
  • level of compliance – míra shody
    • AA normal / large – vyhovuje požadavku úrovně AA na minimální kontrast pro běžný text a velký text.
    • AA non-text – vyhovuje požadavku na minimální barevný kontrast pro prvky rozhraní a grafické objekty.
    • AAA normal / large – vyhovuje požadavku úrovně AAA na minimální kontrast pro běžný text a velký text.

Z takto nabídnutých výsledků je pak již poměrně snadné vybrat barevné kombinace, které jsou pro požadovaný účel (normální text, velký text, prvky rozhraní) dostatečně kontrastní.

Pokud bychom některou z barevných kombinací rádi použili, ale její vzájemný kontrast není dostatečný, můžeme k nalezení podobné, ale vyhovující kombinace, použít například tanaguru contrast finder.

WebAIM: probíhá 8. průzkum mezi uživateli odečítačů obrazovky

Americký WebAIM minulý týden spustil další ze svých průzkumů mezi uživateli screen readerů (odečítačů obrazovky): Screen Reader User Survey #8. Tento je již v pořadí osmý, obsahuje 33 jednoduchých otázek a jeho vyplnění by nemělo zabrat více než 15 minut. Průzkum opět probíhá formou webového dotazníku a je otevřen všem zájemcům, kteří z jakéhokoliv důvodu používají při práci s webem odečítač obrazovky.

Cílem průzkumu je zjistit informace o aktuálních požadavcích a problémech uživatelů screenreaderů a sledovat změny oproti výsledkům předchozích průzkumů. Stejně jako předchozí průzkum, i tento se snaží reflektovat aktuální trendy a obsahuje tak otázky, týkající se používání mobilních zařízení s odečítačem obrazovky, či ochoty prozradit provozovali stránky, že uživatel používá k práci s ní odečítač obrazovky.

Průzkum bude k dispozici do 13. září 2019, výsledky by měly být zveřejněny do konce září 2019.

Pro zájemce, kteří by se rádi průzkumu zúčastnili, ale mohla by pro ně být překážkou angličtina, jsem opět připravil překlad všech otázek a odpovědí do češtiny (txt; 4 kB).

Pokud používáte odečítač obrazovky – ať už proto, že musíte, či jen k testování přístupnosti webů – najděte si chvilku a dotazník vyplňte. Pomůžete tím lépe poznat potřeby uživatelů odečítačů obrazovek při práci na webu.

Cesta k přístupnému webu: odevzdáním výsledků auditu přístupnosti práce nekončí, ale začíná

Změna legislativy a nový Zákon o přístupnosti s sebou přinesl i zvýšenou poptávku po auditech (testech) přístupnosti webů a aplikací. Což je na jednou stranu samozřejmě dobře, na druhou je třeba říci, že audit sám o sobě z hlediska přístupnosti web či aplikaci nikam neposune, pokud se s jeho výsledky dále nepracuje (ideálně ve spolupráci s autorem auditu).

Pokud to s přístupností svého webu (či aplikace) myslíte opravdu vážně, je potřeba audit přístupnosti doplnit i dalšími navazujícími kroky.

Optimální postup

Auditů přístupnosti většího či menšího rozsahu už jsem vypracoval stovky a postupně dospěl k následujícímu postupu, který mám z hlediska výsledku a praktického přínosu pro uživatele za optimální.

1. Audit přístupnosti

Výsledky auditu slouží jako podkladový materiál k dalším krokům, které jsou pro dosažení cíle (tj. přístupnějšího webu) naprosto nezbytné. Může se samozřejmě stát, že výsledky budou uspokojivé a další kroky nebudou třeba, ale přiznejme si na rovinu, že takový stav je spíše výjimkou, než pravidlem.

2. Navazující konzultace

Ty mohou být jak osobní, tak na dálku. Dnešní technologie už naštěstí umožňují eliminovat cestování (a pošetřit čas na obou stranách), takže konzultaci je možné snadno provést přes některý z online komunikačních nástrojů, aniž by to mělo vliv na její kvalitu a názornost.

Proč jsou tyto konzultace důležité? S výsledky auditů často pracují lidé, kteří se s tématikou přístupnosti setkávají poprvé. Velmi se mi proto osvědčilo se zadavatelem auditu výsledky projít, okomentovat je, zodopovědět případné dotazy a přesvědčit se, zda je všechno pochopeno tak, jak by pochopeno být mělo.

3. Workshop(y) o přístupnosti

Přístupnost se na straně zadavatele zpravidla netýká jen jednoho člověka, ale má na ni vliv celá řada lidí různých profesí: namátkou UX designer, grafik, kodér či redaktor. Proto je vhodné se s týmem na straně zadavatele auditu (ideálně osobně) sejít, s tématikou přístupnosti jej seznámit a při té příležitosti s ním výsledky auditu projít.

Workshop také může sloužit jako platforma pro stanovení nejbližších dalších kroků a domluvě na tom, co, kdy a jak se bude upravovat. Ne vždy je možné (z mnoha důvodů – zvolená technologie, časové či finanční možnosti) implementovat okamžitě všechny požadované změny. Ideální je proto domluvit se na prioritách a opravách největších bariér co nejdříve (nepopsané obrázky ve fotogalerii jsou sice problém, ale nepřístupnost položek menu z klávesnice či absence nadpisové osnovy jsou pro uživatele překážky mnohem závažnější).

4. Zmírnění či odstranění nalezených bariér

Na základě stanovení priorit proběhne zmírnění (či odstranění) bariér, které provede zadavatel auditu. Tato činnost může trvat dny, týdny i měsíce v závislosti na jejich složitosti, volných vývojových kapacitách, rozpočtu, či dalších okolnostech – pokud je například třeba některé komponenty nově naprogramovat a otestovat jejich funkčnost, či je přístupnost součástí vývojového cyklu a opravy se tak do produkční verze dostanou až s další verzí webu či aplikace.

5. Kontrola

Po provedení úprav je vhodné zkontrolovat, zda jsou úpravy dostačující, jejich výsledkem je odstranění (či zmírnění) nalezené bariéry a v důsledku toho přístupnější web či aplikace.

Body 2 až 5 pak lze po první úspěšné iteraci samozřejmě libovolně opakovat a kombinovat 🙂

Zpřístupnění webu je proces, ne jednorázová aktivita

Už na začátku spolupráce je vhodné upozornit zájemce o zpřístupnění webu či aplikace na to, že zpřístupnění webu či aplikace je proces, který mnohdy trvá i několik měsíců. A pokud se má jednat o změnu dlouhodobou a trvalou, je potřeba proškolit i zaměstance a začlenit tak přístupnost do “DNA” týmu, který web či aplikaci vyvíjí a průběžně aktualizuje.

A není to pak celé (mnohonásobně) dražší?

Může, ale nutně nemusí. Výslednou cenu ovlivňuje celá řada faktorů a řada věcí se dá díky možnostem dnešních technologií udělat jednodušeji (a v důsledku toho levněji). Například výsledky auditu je možné nabídnout prostřednictvím sdíleného dokumentu, který může následně posloužit jako podklad ke konzultacím (či konzultace mohou probíhat přímo v něm) a jako osnova workshopu. A finance, ušetřené za mnohdy desítky hodin věnovaných zpracování detailní formální zprávy, mohou být investovány třeba do workshopu a zvýšení kompetencí členů pracovního týmu v oblasti přístupnosti.

Příklady dobré praxe

Nejlepším důkazem toho, že výše nastíněný postup funguje, jsou jeho praktické výsledky. Za všechny zmíním alespoň dlouhodobou spolupráci na zpřístupňování webu s výsledky voleb, webu a online bankovnictví jedné velké banky či přístupnější online supermarket Rohlík.cz 🙂