Věděli jste, že podle nových studií se lidé o produktu rozhodují z 62% až 90% na základě jeho barvy! Nejenom to, tyto studie také dokázaly, jak můžete díky barvám jednoduše ovlivňovat nálady a chování vašich návštěvníků.
Díky těmto poznatkům je správné vybrání barvy na web (a váš brand celkově) nesmírně důležité a rozhoduje o tom, zda bude web vůbec úspěšný. Proto jsem napsal tento článek, po jehož dočtení budete jistě schopni vybrat ty nejefektivnější barvy na web vašeho podnikání.
Výhody jednotlivých barev
Nejdříve je dobré znát psychologii barev samotných, každá barva totiž v lidech podněcuje nějaké emoce např. žlutá v nás vyvolává pocit hladu. Jiné barvy na sebe zase lépe přitahují pozornost, jako především červená. Na tu jsme totiž od malička učení dávat pozor, objevuje se na různých dopravních značkách, signálech či výstrahách. Proto využil kombinaci těchto barev třeba McDonald’s, skvěle přitáhnou pozornost a ještě ve vás vzbudí pocit hladu.
A takové podobné využití mohou mít všechny barvy na web jaké můžete využít. Pokud se v nich ovšem dobře vyznáte. Pojďme si tedy ke každé základní barvě říct její vlastnosti.
Červená
Červená může být odvážnou volbou barvy na web, protože je předurčena k tomu, aby dělala dojem, byla vidět a přitahovala pozornost. To dokazuje experiment společnosti hubspot z roku 2011, ve kterém změnili barvu tlačítka ne jejich domovské stránce ze zelené na barvu červenou.
Ve výsledku pouhá změna barvy tlačítka přitáhla o 21% více kliknutí než dříve.
Červená reprezentuje:
- Vášeň
- Nebezpečí
- Lásku
- Oheň
- Energii
- Autoritu
- Sílu
- Důvěru
Červená se hodí využít na stránkách pro:
- E-shopy s Výprodeji
- Stránky Urgentních Služeb
- Restaurace
- Fitness centra
- Autobazary
Tyto odstíny červené jsou jistě dobrými volbami pro vaše barvy na web:
Zelená
Zelená barva je hluboce spojena s přírodou a životním prostředím. V západním světě je také spojována s bohatstvím a penězi. To jí dává dva zcela protikladné psychologické významy, které můžeme využít ve svůj prospěch v závislosti na cílové skupině značky.
Zelená reprezentuje:
- Růst
- Prosperitu
- Zdraví
- Čerstvost
- Klid
- Stabilitu
- Ekologické vědomí
- Finance a bohatství
Zelená se hodí využít na stránkách pro:
- Ekologické Produkty a Služby
- Fitness a Wellness
- Zahradu a Zemědělství
- Finanční Poradenství
- Technologické Služby s Důrazem na Ekologii
- Turistické a Cestovní Agentury
- Rostoucí Firmy
- Organické Potraviny a Životní Styl
Tyto odstíny zelené jsou jistě dobrými volbami pro vaše barvy na web:
Modrá
Modrá je další barvou, která se často vyskytuje v přírodě, a proto má podobné uklidňující vlastnosti jako zelená, pokud je použita ve světlých tónech. Má však nepřeberné množství dalších významů, které se s ní pojí, pokud je použita v kombinaci s jinými barvami a pokud jsou tmavé odstíny začleněny do brandingu.
Díky svým vlastnostem a tím, že je už od malička s kluky spojována. Může být modrá také považováno za masculiní barvu. Proto se hodí použít, pokud cílíme především na mužské publikum.
Modrá reprezentuje:
- Důvěru
- Spolehlivost
- Výkon
- Znalosti
- Autoritu
- Profesionalitu
- Luxus
- Klid a relaxaci
Modrá se hodí využít na stránkách pro:
- Automobilový Průmysl
- Průmyslový a B2B Sektor
- Cestovní Agentury a Letecké Společnosti
- Vzdělávací Instituce
- Podnikatele
- Zdravotnictví a Farmacii
- Technologické Firmy
- Komunikační platformy
Tyto odstíny modré jsou jistě dobrými volbami pro vaše barvy na web:
Oranžová
Oranžová barva má energii a živost červené barvy, aniž by riskovala, že bude příliš výrazná, odvážná nebo agresivní. Proto je spojována s mladistvými značkami, které se zaměřují na nové generace, jako třeba Fanta. Je příjemná, poutavá a zároveň zůstává klidná a svěží.
Zatímco její neonové barvy bývají používané pro výstrahu (dopravní kužely, vesty s vysokým stupněm viditelnosti), její přirozené tóny jsou klidné a zábavné.
Oranžová reprezentuje:
- Výstrahu
- Zábavu
- Svěžest
- Živost
- Radost
- Mládí
- Nadšení
- Kreativitu
Oranžová se hodí využít na stránkách pro:
- Hobby a volný čas
- Obchody s Outdoorovým a Sportovním Vybavením
- Zábavní Průmysl
- Stránky s Kreativním Obsahem
- Reklamní Agentury
- Různá portfolia
Tyto odstíny oranžové jsou jistě dobrými volbami pro vaše barvy na web:
Žlutá
Sluneční svit, usměvavé emotikony, letní květiny, žlutá barva, i když křiklavá, má mnoho dobrých vlastností.
Je to jedna z nejsnadněji viditelných barev na dálku, pokud je sladěna s hlubšími tóny. Díky tomu je užitečná pro nápisy a billboardy nebo pro upoutání pozornosti na velkých a přeplněných prostranstvích. Také, jak jsem na začátku článku zmiňoval, může vyvolává pocit hladu.
Bývá též spojována s něčím levným, proto se skvěle hodí ke slevám.
Žlutá reprezentuje:
- Štěstí
- Vzrušení
- Energii
- Optimismus
- Sílu
- Levnost
Žlutá se hodí využít na stránkách pro:
- Akční Nabídky a Slevy
- Obchody s nábytkem
- Restaurace
- Architekty
- Automobilový Průmysl
- Vzdělávání a Online Kurzy
- Outdoorové Aktivity a Sport
- Služby Rychlého Přepravního Doručení
Pár odstínů žluté, jaké se dají dobře použít jako barva na web:
Fialová
Fialová je zajímavá barva, protože je zároveň hluboká i světlá, teplá i studená. Často se v mysli kombinuje s modrými tóny, avšak nenabízí stejný klid a pohodu. Ve skutečnosti fialová spíše vzbuzuje pocit tajemství nebo nejistoty – což je důvod, proč ji běžně používají technologické nebo progresivní společnosti.
V různých spíše teplejších tónech, bývá také považována za feminní barvu. Tudíž se hodí použít, pokud jsou vaší cílovou skupinou ženy.
Fialová reprezentuje:
- Ambice
- Progresivitu
- Hojnost
- Prestiž
- Ženskost
- Spojení
- Moc
- Tajemství
Fialová se hodí využít na stránkách pro:
- Progresivní společnosti
- Módní a Luxusní Produkty
- Kosmetiku a Krásu
- Umělecké a Kreativní Stránky
- Romantické Produkty a Služby
- Eventy a Gala Akce
- Cokoliv mystického a spirituálního
Tyto odstíny fialové jsou jistě dobrými volbami pro vaše barvy na web:
Růžová
Tradičně byla růžová barva spojována s ženstvím a často se používala pouze k cílení na ženy. Nové generace však tuto asociaci nemají, což znamená, že růžová se spíše stala symbolem něčeho, co může být hravější, odvážnější a rebelštější.
Růžová reprezentuje:
- Hravost
- Zdraví
- Nevinnost
- Odvážnost
- Lásku
- Vlídnost
Růžová se hodí využít na stránkách pro:
- Kosmetiku a Produkty pro Krásu
- Osvětu a Podporu
- Dětské Produkty a Mateřství
- Stránky Pro Romantiku a Svatební Služby
- Cukrářství
- Blogy
- Fitness
Tyto odstíny růžové jsou jistě dobrými volbami pro vaše barvy na web:
Černá
Černá je mocná, zejména v podmínkách web designu. Je sofistikovaná, formální a poutavá sama o sobě.
Při použití se správným barevným nádechem může zářit jasněji než jakýkoli jiný tón. Proto je její správné použití tak složité, protože je zároveň neutrální i provokující, matná, ale živá.
Černá reprezentuje:
- Luxus
- Bohatství
- Odvážnost
- Sílu
- Eleganci
- Sofistikovanost
- Progresivitu
Černá se hodí využít na stránkách pro:
- Módní Průmysl
- Luxusní Produkty a Služby
- Portfolia
- Progresivní blogy
- Automobilový Průmysl
- Obchody s elektronikou
Tyto odstíny černé jsou jistě dobrými volbami pro vaše barvy na web:
Bílá
Bílá barva je nevinná, jednoduchá, minimalistická, a když se použije správně, je sofistikovaná. Při špatném použití je sterilní a nudná. Přesto existuje jen málo značek, které nemají ve svém brandingu a stylu nějaký prvek černé nebo bílé. Dokáže vdechnout vzduch a prostor do složitého designu, v jiných případech může sama o sobě strhnout celou pozornost.
Bílá reprezentuje:
- Čistotu
- Mír
- Vyváženost
- Jednoduchost
Bílá se hodí využít jako hlavní barva na všech stránkách. V různých případech je dobré ji dát nádech odstínu jiné barvy, pokud se to hodí k vaší značce a produktu.
Tyto odstíny bílé jsou jistě dobrými volbami pro vaše barvy na web:
Jak tedy složit vaší paletu barvy na web.
Efektivní paleta barev by měla nejen dobře vypadat, ale také by se měla svými vlastnostmi hodit k vaší značce. Zároveň byste neměli zapomínat na uživatelskou orientaci na webu a vybírat tak barvy, které jsou na webu čitelné a přirozeně k sobě sedí.
Začněte s neutrálními barvami
Neutrální barvy na web jako černá a bílá tvoří základní stavební kameny každé barevné palety. Bílá barva je často používána pro pozadí, aby vytvořila čistý a jednoduchý vzhled, zatímco černá může být použita pro texty a základní grafické prvky, což dodává webu eleganci a sofistikovanost.
Můžete to však i otočit, pokud chcete spíše nějaký moderní atypický vzhled pro vaše stránky je černá určitě také zajímavou volbou pro pozadí.
Hlavní barva
Hlavní barva by měla reprezentovat vaši značku a být nejvíce viditelná na vašem webu. Tato barva bude dominovat většinu prvků, jako jsou tlačítka, odkazy a hlavní navigace.
Tato barva by měla odrážet emoce a hodnoty, které chcete, aby vaše značka komunikovala. Projděte si tedy předchozí definice barev a vyberte právě tu, která se k vaší značce nejvíce hodí.
Doplňkové barvy
Vyberte 2-3 doplňkové barvy, které dobře ladí s vaší hlavní barvou a neutrálními barvami. Tyto barvy budou použity pro menší prvky, jako jsou nadpisy, ikony nebo tlačítka v pozadí.
Doplňkové barvy by měly být vybrány tak, aby se vzájemně doplňovaly a zároveň poskytovaly dostatečný kontrast k hlavní barvě. Například, pokud je vaše hlavní barva modrá, můžete zvolit zelenou a oranžovou jako doplňkové barvy, protože tyto barvy společně vytvářejí harmonický a přitom výrazný vizuální efekt.
Kontrast a čitelnost
Zajistěte, aby byly vaše barvy dostatečně kontrastní, aby byl text dobře čitelný. Používejte nástroje, jako je WCAG Contrast Checker, abyste se ujistili, že splňujete standardy přístupnosti.
Kontrast je klíčový pro uživatelskou přívětivost. Tlačítka a odkazy by měly být zřetelně odlišitelné od pozadí. Například, pokud je pozadí vašeho webu světlé, použijte tmavé barvy pro texty a tlačítka.
Testování a úpravy
Po vytvoření palety barev ji otestujte na různých zařízeních a monitorech, abyste se ujistili, že barvy vypadají konzistentně.
Neváhejte paletu upravit podle zpětné vazby od uživatelů a kolegů. Důležité je, aby byla paleta nejen esteticky příjemná, ale také funkční.
Používání nástrojů
Využijte online nástroje pro tvorbu barevných palet, jako jsou Adobe Color, Coolors nebo Canva. Tyto nástroje vám mohou pomoci snadno vytvářet funkční barevné schémata.
Shrnutí
Výběr správné palety barev pro váš web je zásadní pro úspěch vašeho online podnikání. Každá barva má své specifické vlastnosti a může ovlivnit nálady a chování vašich návštěvníků. Pečlivě zvolte hlavní, doplňkové a neutrální barvy, zajistěte dostatečný kontrast a testujte jejich vzhled na různých zařízeních. Správně zvolená barevná paleta nejen zlepší vizuální přitažlivost vašeho webu, ale také podpoří vaši značku a zlepší uživatelský zážitek.
Stále si po přečtení článku nevíte s vybráním barvy rady? Nebo si lámete hlavu nad dalšími otázkami úspěšného designu pro váš web? V tom případě se vám jistě hodí mé služby web-designera. Můžete využít první konzultaci o vašem problému zdarma!
Kdo je Jacob Zak, autor tohoto článku.
Odkazy, ze kterých jsem čerpal
Assety, které jsem využil