Barvy na webu

Jak a jaké barvy na webu správně využít a použít?

f800418df217e1cf4c55b0d161030236?s=96&d=mm&r=g
Štěpánka Horák Voborníková
napsáno 12. 7. 2024
aktualizováno 6. 9. 2024
Obsah článku
MOJE HODNOTY • tvorba webu • terapie webu • Štěpánka Horák Voborníková • web pro sólo podnikatele a malé firmy

Barvy jsou jedním z nejdůležitějších vizuálních prvků na webu.

Kolik barev je vhodné na webu mít? Jaký je význam jednotlivých barev? Jaké barvy na webu použít vzhledem k oblasti mého podnikání?

I malá změna odstínu barvy může mít velký význam.

Kolik barev je vhodné na webu mít?

Tady určitě platí pravidlo, že méně je více. Pro mne je ideální a maximální počet 5 barev.

HLAVNÍ BARVA
většinou barva vaší značky, vašeho podnikání, použijte například na nadpisy.

DOPLŇKOVÉ BARVY
1 — 2 další barvy, které doplňují hlavní barvu, například barva textu, nebo grafických prvků.

AKCENTOVÁ BARVA
výrazná barva, se kterou je potřeba šetřit. Použijte ji na tlačítka nebo pokud chcete na něco upozornit.

Jak se barvy na webu používají?

U barev je to vždy o poměru barev a o tom, jak se barvy spolu kombinují.

POZADÍ WEBU
nemusí být bílé, ale měla by to být jemná barva, která nebude rušit a na které ostatní prvky vyniknou.

ODKAZY

pro všechny odkazy na webu použijte ideálně jednu barvu, může to být akcentová barva. Návštěvník webu rychle pochopí, že tady může na něco kliknout. Je to změna, na kterou čtenář reaguje.

TEXT

černý text na bílém pozadí je hodně tvrdá kombinace. K některým webům se to hodí, ale je to ten největší kontrast, kterého můžete dosáhnout. Pro jemnější weby je lepší použít pro text šedou barvu, ale vždy dejte pozor na to, aby byl text dobře čitelný.

TLAČÍTKA

akcentová barva je jasná volba. Chcete upoutat pozornost. Ideální je použít na tlačítku tzv. hover efekt (změna barvy tlačítka při přejetí myší), tím jasně ukážeme klientovi, že tady má kliknout.

Na co si dát při hrátkách s barvami pozor?

POUŽITELNOST
Pokud si nějaké barvy vyberete, vždy je použijte na webu na tom místě, kde je chcete mít (nadpis, text, pozadí, tlačítko…) a až pak udělejte finální rozhodnutí o barvách. I výrazné barvy použité na malých plochách se vám mohou zdát příliš tmavé.

KONZISTENCE
Udržujte stejné použití barev napříč celým webem. Zvolte si vizuál jednotlivých prvků (například nadpis stránky, tlačítko, odkaz, rámeček u fotky…) a ten mějte na celém webu stejný. Klient se na webu mnohem jednodušeji bude orientovat a nebude zmatený. Tohle je důležité i pro celkový vizuál webu.

PŘÍSTUPNOST
Ideální je používat vysoký kontrast barev. To je důležité pro lidi s barevnou slepotou.

NASTAVENÍ DISPLEJŮ
Každý monitor, mobil, tablet, notebook má trochu jiné nastavení barev displeje. Na mobilu se například nezobrazí stejné barvy jako na monitoru. Nelekněte se toho. Je to fakt, který je potřeba přijmout.

Psychologie barev ve zkratce

Každá barva má svou energii, vibraci a tak dokáže ovlivnit naši náladu, vnímání a třeba i sebevědomí. Všimli jste si, jak se nám v různých životních obdobích líbí různé barvy? Tak je to i v rámci podnikání, barev a cílové skupiny. Lidé s podobnými vlastnostmi, hodnotami a vnímáním (jedna cílová skupina) budou inklinovat k podobným barvám, sytosti, teplotě a použití barev.

⚪️ BÍLÁ
• čistota, jednoduchost, nevinnost
• často používána jako pozadí pro čitelnost a pocit čistoty

⚫️ ČERNÁ
elegance, formalita, tajemství
• běžně se používá na text a spíše jako doplňková barva

🟡 ŽLUTÁ
optimismus, štěstí, kreativita
• běžně se používá na text a spíše jako doplňková barva

🟠 ORANŽOVÁ
přátelství, optimismus, kreativita
vhodná na tlačítka nebo jako doplňková barva

🔴 ČERVENÁ
energie, vášeň, akce, stop
• používá se pro upozornění a chybové zprávy, akční barva

🩷 MAGENTA
kreativita, emocionální rovnováha, láska
převážně jako akcentová barva, ale může to být i hlavní barva značky

🟣 FIALOVÁ
• spiritualita, luxus, tajemství
používaná jako hlavní, zvláště když potřebujete klienta zastavit

🔵 MODRÁ
důvěra, klid, komunikace
využívaná převážně jako hlavní barva značky pro komunikaci

🐳 TYRKYSOVÁ
vyrovnanost, emocionální stabilita, duchovní hloubka
hlavní barva značky, ideálně pro zdravotnictví a wellness

🧵 PETROLEJOVÁ
elegance, sofistikovanost, hloubka
hlavní barva značky, která potřebuje působit důvěryhodně

🟢 ZELENÁ
růst, obnova, zdraví
• hlavní barva značky převážně v ekologii a zdravotnictví

🥇 ZLATÁ
luxus, úspěch, kvalita
hlavní barva luxusních značek, pro nadpisy a text to není vhodná barva

Pokud se chcete dozvídat pravidelně informace ze světa tvorby webů a brandingu, tak si mě na LinkedIn přidejte nebo sledujte můj hashtag #terapiewebu, kterým označuji všechny svoje příspěvky. Pak vám už nic neunikne. 

Chcete najít ty správné barvy pro vaše podnikání? 

„Barev je nekonečně a jsou zdarma a díky tomu se nemusíme omezovat jen na základní barvy, ale můžeme využít celou paletu odstínů barev“. 

Štěpánka Horák

BARVY NA WEBU • tvorba webu • terapie webu • Štěpánka Horák Voborníková • web pro sólo podnikatele a malé firmy

Stažení článku ve formátu .pdf

Mějte informace z článku k dispozici kdykoliv budete potřebovat.
Stáhněte si článek ve formátu .pdf uzpůsobeného pro mobilní telefony.
Přejít nahoru