axessia.eu

Najčešća greška pri kontrastu boja: što ide po zlu i kako to izbjegavate?

Nedovoljan kontrast između teksta i pozadine jedan je od najčešće pronađenih problema u provjerama dostupnosti. Ovaj članak objašnjava gdje dolazi do greške, što WCAG zahtijeva i kako to strukturalno izbjegavate.

Nedovoljan kontrast između teksta i pozadine jedan je od problema koji se najčešće pojavljuje pri provjerama dostupnosti, a istovremeno jedna od grešaka koju je najlakše spriječiti. Do greške dolazi kada je svijetlosiva tekst na bijeloj pozadini, kada su gumbovi vidljivi samo zbog suptilne promjene boje ili kada je tekst za objednjavanje (placeholder text) u polju obrasca jedina uputa o tome što treba unijeti. Za osobe s vizualnim oštećenjem, ali i za sve koji koriste zaslom u jakoj sunčevoj svjetlosti, tekst doslovno postaje nečitljiv.

WCAG 2.1, norma na koju se EN 301 549 poziva, propisuje na razini AA minimalnu omjer kontrasta između teksta i pozadine na kojoj se nalazi: obično 4,5 prema 1 za obični tekst i 3 prema 1 za veliki tekst te za upravljačke elemente kao što su gumbovi i okviri obrazaca. To zvuči tehnički, ali osnovna ideja je jednostavna: kontrast nije estetska izbor, to je preduvjet za prosljeđivanje informacija.

Gdje dolazi do greške u praksi

Problemi s kontrastom rijetko nastaju namjerno. Ukradnu se kroz izbore korporativnog identiteta koji izgledaju savršeno na velikom, oštroj zaslonu u studiju za oblikovanje, ali na prosječnom zaslonu prosječnog korisnika malo ostaju ispod norme. Svijetlosiva tekst gumba na pastelnoj pozadini klasičan je primjer. Isto vrijedi za veze koje se prepoznaju samo po promjeni boje, bez podvlačenja ili drugoga vizualnog signala, zbog čega osobe s boljom vidljivošću boja jednostavno ne vide kao klikljive.

Drugi čest obrazac je status prelaska miša: gumb koji je u mirovanju sasvim zadovoljavajući, ali se pri pomicanju miša mijenja u kombinaciju boja koja nije provjerena. Poruke o greškama u obrascima također su česta greška: crveni tekst na svjetlucavoj crvenoj pozadini izgleda dosljedan s korporativnim identitetom, ali često ne dostižu traženi omjer. Onaj koji je znatiželjan kako ovakva ograničenja izgledaju u vlastitom okruženju, može to u nekoliko pitanja vidite gdje je vaša stranica postavljena bez da trebate prvo napraviti račun.

Zašto automatska provjera to djelomično, ali ne u potpunosti rješava

Omjer kontrasta je moguće automatski izmjeriti: skener pročita vrijednosti boja teksta i pozadine te izračuna omjer. Time je ovo jedan od rijetkih WCAG kriterija koje alat može pouzdano provjeriti. Što skener ne vidi, je kontrast koji nastaje tek nakon interakcije, primjerice padajući izbornik, savjet koji se pojavljuje tijekom fokusa ili status koji postaje vidljiv tek nakon radnje korisnika. Upravo zato svako izvješće navodi koji je dio automatski provjeravan i koji dio zahtijeva ručnu procjenu; kontrast je jaka točka automatske provjere, ali ne čini cijelu sliku.

Kako ga strukturno izbjegavate

Najčešći način da se ovaj problem trajno izbjegne jest fiksiranje kontrasta na razini sustava dizajna umjesto po stranici. Kada se osnovne boje korporativnog identiteta već pri određivanju provjere prema normi, urednik ili programer to ne trebaju provjeravati iznova. To također sprječava da nova stranica, privremeni natpis akcije ili vanjski nabavljeni dodatak neopaženo ugrozimo omjer kontrasta.

Pametno je stoga uključiti kontrast eksplicitno u svaku vizualnu izmjenu web-mjesta, a ne samo pri prvoj isporuci. Osvježavanje korporativnog identiteta, nova sezonska tema ili promijenjen stil gumba može uvesti problem koji nije postojao u verziji prije toga. Pristupačnost se u tom smislu ne odnosi na kvačicu koju postavljate samo jednom, već na točku pažnje koja prati održavanje. Više o tome kako takva kontinuirana kontrola funkcionira u praksi možete čitati objašnjenje odakle dolazi ocjena.

Na kraju, vrijedi pogledati ne samo minimalnu normu, već namjeru iza nje: može li svatko, čak i u manje idealnim uvjetima osvjetljenja ili na starijoj zaslonu, zaista razlikovati tekst i gumbe. Često postavljana pitanja, kao što su pitanja je li logotip ili dekorativna slika morala biti u skladu sa zahtjevom za kontrast, detaljno su razrađeni na stranici s odgovore na pitanja koja se često javljaju.

Želite li znati je li kontrast, i ostali ponavljajući problemi, prisutni i u vašem okruženju? Besplatna quick-scan pruža prvi uvid u to, a znanja s temama obrađenim za svaku situaciju pokazuje kako je ovo pitanje povezano s ostatkom obveza vezanih uz Direktivu (EU) 2019/882.

Ovaj članak sadrži opće informacije i nije pravna savjet.