Zlepšite čitateľnosť a skúsenosti používateľa s primeraným kontrastom
Kontrast zohráva dôležitú úlohu v úspechu návrhu webových stránok. Z typografie tejto stránky , po obrázky používané na celom webe, ku kontrastu medzi prvkami popredia a farbami pozadia - dobre navrhnutá lokalita musí mať vo všetkých týchto oblastiach primeraný kontrast, aby sa zabezpečila kvalitná používateľská skúsenosť a dlhodobý úspech na stránkach.
Nízky kontrast je rovnocenný so slabým zážitkom z čítania
Webové stránky, ktoré sú príliš nízke v kontraste, môžu byť ťažko čitateľné a používané, čo bude mať negatívny vplyv na úspech každého webu. Problémy s nízkym kontrastom farieb sú často ľahko identifikovateľné. Zvyčajne to môžete robiť len tým, že hľadáte stránku, ktorá je vykreslená vo webovom prehliadači a môžete zistiť, či je text príliš ťažko čitateľný kvôli zlým výberom farieb. Napriek tomu, hoci môže byť ľahké určiť, ktoré farby nefungujú dobre, môže byť skutočne veľmi náročné rozhodnúť, aké farby fungujú dobre na rozdiel od ostatných. Možno to, čo nefunguje, ale ako zistíte, čo funguje? Obraz v tomto článku by vám mal pomôcť zobraziť rôzne farby a ich kontrast ako farby popredia a pozadia. Môžete vidieť niektoré "dobré" párovanie a niektoré "zlé" párovanie, ktoré vám pomôžu urobiť správnu farebnú voľbu vo vašich projektoch.
Čo sa týka kontrastu
Jedna vec, ktorú by ste mali mať na pamäti, je, že kontrast je viac ako len jasná farba v porovnaní s pozadím. Ako by ste mali vidieť na vyššie uvedenom obrázku, niektoré z týchto farieb sú veľmi jasné a viditeľne sa zobrazujú na farbe pozadia - napríklad modrej na čiernom, ale stále som označil, že má slabý kontrast. Urobil som to preto, že aj keď to môže byť jasné, farebná kombinácia ešte robí text ťažko čitateľný. Ak by ste vytvorili stránku v celom modrom texte na čiernom pozadí, vaše čitatelia by mali oko veľmi rýchlo. Z tohto dôvodu nie je kontrast len čierny a biely (áno, táto hračka bola určená). Existujú pravidlá a osvedčené postupy pre kontrast, ale ako dizajnér musíte vždy ohodnotiť tieto pravidlá, aby ste sa uistili, že pracujú vo vašej konkrétnej inštancii.
Výber farieb
Kontrast je len jeden z faktorov, ktorý treba zvážiť pri výbere farieb pre dizajn vášho webu, ale je to dôležitý. Pri výbere farieb si pamätajte na štandardy značky pre spoločnosť, ale tiež sa snažte riešiť farebné palety, ktoré, aj keď môžu byť v súlade s pokynmi organizácie, nefungujú dobre online. Napríklad som vždy našiel žlté a jasné zelené, ktoré sú strašne náročné efektívne využívať na webových stránkach. Ak sú tieto farby v usmerneniach spoločnosti, pravdepodobne budú musieť byť použité len ako akcenty farieb, pretože je ťažké nájsť farby, ktoré dobre kontrastujú s oboma.
Podobne, ak vaše farby značky sú čierne a biele, znamená to veľký kontrast, ale ak máte stránky s zdĺhavým množstvom textu a čierne pozadie s bielym textom, čítanie bude veľmi náročné. Dokonca aj kontrast medzi čiernymi a bielymi je skvelý, biely text na čiernom pozadí spôsobuje namáhanie očí pre dlhé pasáže. V tomto prípade by som prevrátil farby používať čierny text na bielom pozadí. To nemusí mať taký vizuálny záujem, ale nenájdete lepší kontrast!
Online nástroje
Okrem vlastného dizajnu, existujú aj niektoré online nástroje, ktoré môžete použiť na otestovanie výberu farieb vašej lokality.
CheckMyColors.com otestuje všetky farby vášho webu a oznámi kontrastný pomer medzi prvkami na stránke.
Navyše pri rozmýšľaní o farebnej voľbe by ste mali tiež zvážiť prístupnosť webových stránok a ľudí, ktorí majú formy farebnej slepoty. WebAIM.org vám s tým môže pomôcť, rovnako ako ContrastChecker.com, ktorý bude otestovať Vaše rozhodnutia voči smerniciam WCAG.