Oblikovanje spletnih strani za barvno slepe

V povprečju je vsak 10. obiskovalec vaše strani barvno slep. Barva slepota sicer ne pomeni, da oseba ne vidi barv (razen v 100% obliki), ampak povzroča težave le pri nekaterih odtenkih oz. slednje težje razlikujejo. Zaradi tega je lahko ob uporabi napačnih odtenkov navigiranje po strani tem uporabnikom oteženo.

Zaradi omenjenih razlogov je zanašanje, da bodo samo barve prenašale naše sporočilo (naslovi, povezave, akcije, gumbi, …) spletne strani uporabnikom zmotno. V spodnjem besedilu si bomo pobližje ogledali nekaj primerov, kako lahko naše strani naredimo bolj dostopne barvno slepim uporabnikom.

Strani dostopne barvno slepim

Kontrast med besedilom in ozadjem mora dosegati priporočila WCAG. V praksi to pomeni, da mora imeti besedilo ali slike besedila kontrast v razmerju najmanj 4.5:1, medtem, ko mora imeti veliko besedilo razmerje najmanj 3:1. Vsi ostali elementi, kot so npr.: logotipi nimajo nobenih priporočil. Za lažjo oceno kontrasta vam je na voljo priročno spletno orodje “contrast ratio”, ki ga je pripravila Lea Verou. Lahko pa uporabite tudi LESS ali SASS rešitev.

Uporaben vir za pripravo pravih razmerij kontrastov je tudi “Index of Color Contrast Samples”.

Pri izdelavi spletnih strani moramo v zakup vzeti, tako tudi barvno slepoto. To je še posebej očitno pri spletnih trgovinah, kjer velikokrat pozabijo dopisati barvo tudi v besedilu. Namreč običajno se uporabijo samo slike ali barvasti kvadrati, ki v tem primeru barvno slepim otežujejo nakup izdelka. V zakup pa je potrebno vzeti tudi to, da preveč detajlni opis barv lahko povzročajo zmedo. Zaradi tega je pametno izbrati pravo kombinacija besed in barv oz. slik ali vzorcev. Če so oblike kompleksnejše, kot so grafi in sorodne oblike pa je priporočljivo uporabljati še legendo.

Testiranje barvne slepote

Oblikovalci lahko s svojimi orodji tudi testirajo barvno slepoto oz. izgled njihovega designa ob barvni slepoti. Orodja, kot so Photoshop in Illustrator ponujajo posebne poglede, ki simulirajo barvno slepoto. Pogledi za barvno slepoto se običajno nahajajo v: View > Proof Setup > Color Blindness – Protanopia-type ali Color Blindness – Deuteranopia-type.

Oblikovanje-spletnih-strani-za-barvno-slepe

Dodatne informacije o barvni slepoti sl.wikipedia.org/wiki/Barvna_slepota

Oznake: Accessibilitybarvna slepotapodporaWCAG

Komentiraj


*