Smernice

Barva naj nikoli ne bo edini nosilec informacije

Barva je odličen način za poudarjanje pomembnih informacij, vendar ne sme biti njihov edini nosilec. Pomembne informacije morajo biti vedno predstavljene tudi z besedilom, ikono, simbolom ali drugim vizualnim namigom.

Barve pogosto uporabljamo za označevanje pomembnih informacij, opozoril, stanj ali dejanj. Če je pomen sporočen samo z barvo, ga nekateri uporabniki ne bodo mogli zaznati ali pravilno razumeti.

Z dodatnimi vizualnimi namigi zagotovimo, da so informacije razumljive tudi osebam z barvno slepoto ter vsem uporabnikom v okoliščinah, kjer je razlikovanje med barvami oteženo.

Za katere uporabnike je to posebej pomembno?

Pomembne informacije, ki niso predstavljene samo z barvo, so ključne za:

  • osebe z barvno slepoto,
  • slabovidne osebe,
  • osebe s kognitivnimi oviranostmi,
  • starejše uporabnike.

Takšen način označevanja koristi tudi drugim uporabnikom, saj omogoča hitrejše razumevanje vsebine in zmanjšuje možnost, da bi pomembne informacije spregledali zaradi slabših svetlobnih razmer, zaslonov slabše kakovosti ali drugih okoliščin.

Pogoste težave

Pomembna informacija je označena samo z barvo

Slaba praksa: Odprti dnevi so označeni z zeleno, zaprti pa z rdečo barvo. Drugih razlik med njimi ni.
Koledar, kjer so dnevi odprtosti in zaprtosti galerije označeni le z različnima barvama.
Prikaz koledarja, kot ga lahko vidi oseba z barvno slepoto, pri katerem se dnevi odprtosti in zaprtosti galerije razlikujejo le z različnima barvama.
Dobra praksa: Poleg barve uporabimo tudi simbol, ikono ali besedilo, ki jasno sporoča pomen informacije.

Primer: Galerija je odprta ob ponedeljkih, četrtkih, petkih in sobotah. Ob torkih, sredah in nedeljah je zaprta.

Napake v obrazcu so označene le z rdečo barvo

Slaba praksa: Polje je obrobljeno z rdečo barvo, uporabnik pa ne dobi nobene razlage, kaj je narobe in kako naj napako odpravi.
Obrazec, kjer je napaka označena le z obarvanim robom vnosnega polja.
Dobra praksa: Poleg rdeče obrobe prikažemo tudi jasno besedilo, ki opiše napako in uporabniku pove, kako naj jo odpravi.

Primer sporočila o napaki: »Vnesite veljaven elektronski naslov.«

 

Obrazec, kjer je napaka poleg rdeče označenega vnosnega polja prikazana tudi z ikono in jasnim besedilnim sporočilom.

Več o ustreznem sporočanju napak (odpre se v novem oknu)

Povezave se od besedila razlikujejo samo po barvi

Slaba praksa: Povezava ni podčrtana in se od navadnega besedila razlikuje le po modri barvi, ki je premalo kontrastna glede na okoliško besedilo.
Povezava v besedilu je označena le z modro barvo, zato jo je zaradi podobnosti z okoliškim besedilom težko prepoznati.
Dobra praksa: Povezave so poleg barve označene tudi s podčrtajem, zato jih uporabniki lažje prepoznajo.
Dobra praksa: Če se povezava razlikuje le po barvi mora imeti kontrast vsaj 3:1 z okoliškim besedilom.
Povezava je poleg modre barve označena tudi s podčrtajem, zato jo uporabniki lažje prepoznajo kot povezavo.

Več o ustreznem kontrastu in uporabi barve (odpre se v novem oknu)

Povezava s smernicami dostopnosti (WCAG)

Področje uporabe barve naslavlja predvsem naslednji kriterij uspeha WCAG:

  • 1.4.1 Uporaba barve

Z ustrezno uporabo barve izboljšamo razumljivost vsebin za osebe z barvnimi motnjami vida ter zagotovimo, da pomembnih informacij ne spregledajo niti uporabniki v zahtevnejših okoliščinah, kot so uporaba mobilnega telefona na soncu ali zasloni slabše kakovosti.