Skip to main content

Ako kontrastovať pozadia a farby popredia vo webe

Anonim

Kontrast zohráva dôležitú úlohu v úspechu návrhu webových stránok. Primeraný kontrast zaručuje kvalitnú používateľskú skúsenosť a ľahšiu čitateľnosť, ktorá prispeje k dlhodobému úspechu lokality.

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é; často sa môžete jednoducho pozrieť na stránku vo webovom prehliadači a zistiť, či je text ťažko čitateľný kvôli nízkej kontrastnej farebnej voľbe.

Aj keď môže byť ľahké určiť, ktoré farby nefungujú dobre, môže byť náročné rozhodnúť, ktoré farby budú fungovať dobre v porovnaní s inými a v rámci návrhu webových stránok. Tento graf zobrazuje rôzne farby a ako dobre kontrastujú ako farby popredia a pozadia. Môžete vidieť niektoré efektívne párovania, rovnako ako zlý párovanie, ktoré by ste sa mali vyhnúť pri výbere farieb pre vaše projekty lokality.

Nie všetky silné kontrasty sú dobré kontrasty

Jedna vec, ktorú by ste mali v grafe poznamenať, je, ako niektoré z týchto farieb môžu byť veľmi jasné a môžu sa zobrazovať žiarivo na konkrétnej farbe pozadia, napríklad modrej na čiernom, ale sú označené ako slabé kontrastné voľby. Je to preto, že kombinácia farieb, napriek kontrastu, stále vedie k ťažko čitateľnému textu. Ak by ste vytvorili stránku v celom modrom texte na čiernom pozadí, vaše čitatelia by zažívali okuliare veľmi rýchlo.

Existujú pravidlá a osvedčené postupy pre kontrast, ale ako dizajnér, musíte tieto pravidlá vždy ohodnotiť, aby ste sa uistili, že pracujú vo vašej konkrétnej inštancii.

Štandardy značky a kontrastné voľby farieb

Kontrast je len jeden z faktorov, ktoré je potrebné zvážiť pri výbere farieb pre dizajn vášho webu. Pri výbere farieb budete pravdepodobne musieť mať na pamäti štandardy značky pre klienta, či už ide o spoločnosť, inú organizáciu alebo dokonca o jednotlivca. Hoci farebné palety môžu byť v súlade s usmerneniami organizácie, nemusia sa prekladať pre online prezentáciu.

Napríklad, žlté a jasné zelené sú úžasne 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, čierne pozadie s bielym textom prinesie čítanie veľmi očné napätie, napriek tomu, že vlastná sila kontrast medzi čiernou a bielou. V tomto prípade je vhodné obrátiť farby pomocou čierneho textu na bielom pozadí. To nemusí byť tak vizuálne zaujímavé, ale je to oveľa lepší výber kontrastu a čitateľnosti.

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ý otestuje vaše voľby voči Pravidlám pre prístupnosť obsahu webu (WCAG).