Blog o podnikání na internetu
Poradce úspěšného podnikatele

Ještě pořád nevíte, jaké barvy použít pro Váš web?

principy webdesignu v praxi - jaké barvy použít pro Váš web nebo e-shopVíte, jak na Vaše zákazníky působí barvy Vašeho webu? Udělejte dobrý dojem a získejte si pozornost návštěvníků svého webu od prvního momentu. Inovujte jeho design v souladu s psychologií barev.

Zdá se Vám to komplikované?  Pojďme se spolu naučit, jak na design, který pomůže tomu, aby se „u Vás“ zákazníci dobře cítili, rádi se déle zdrželi, kontaktovali Vás nebo s radostí rovnou nakoupili.  

O významu teplých barev ve webdesignu jsme psali v předchozím článku. Nyní se podívejme  na neutrální  barvy, které jsou ideální nejen pro tvorbu kontrastů. Na závěr pro Vás máme skvělý nástroj, který Vám kombinování barev výrazně usnadní.

NEUTRÁLNÍ BARVY

Využívají se hlavně jako barvy pozadí. Dotváří nebo zvýrazňují design. Velice často jsou spojovány s ostatními, výraznějšími barvami. I proto je význam těchto barev a dojem z nich ve velké míře definován teplými nebo chladnými barvami, se kterými jsou právě kombinovány.

Černá barva

Nejsilnější z neutrálních barev. Design, ve kterém dominuje černá, může být konzervativní, moderní, tradiční, nekonvenční. Všechno je závislé na barvě, se kterou je černá v designu kombinována. Funguje jako zesilovač vlastností jiných barev, které zvýrazní.

  • V pozitivním smyslu je spojována se silou a formálností. V designu je černá často použita na výrazných, ostrých, ale i elegantních a formálních webech.
  • V negativním smyslu bývá interpretována jako barva zla, smrti a tajemna. Ve většině západních krajin se často spojuje se smutkem, ale rovněž s rebelií, Halloweenem (v našem případě s Památkou zesnulých Dušičkami).
čierna farba vo webdizajne, moderný responzívny web v čiernej farbe

náš klient 2skin.cz velmi decentně využil černou barvu v moderním, flatovém designu

Bílá barva

Je sice protipólem černé, rovněž však dokáže působit s jakoukoliv jinou barvou. Na rozdíl od černé, bílá barva zvýrazňuje, podtrhuje vlastnosti ostatních barev, nechává jim prostor vyniknout a propůjčuje jim čistotu.

  • Často je využívána v minimalistických, jednoduchých designech nebo v případech, kdy chceme poukázat na čistotu a jednoduchost, nevinnost, bezúhonnost.
  • Je spojována s dobrem, právě božství a andělé jsou bílou vyobrazeni. V západních krajinách je tradiční barvou svatebních šatů, ale rovněž se využívá ve zdravotnictví (např. oděvy lékařů a sester).
biela farba vo webdizajne

bíla barva dodá webdesignu vzdušnost, jako např. na webu našeho klienta – writeyboards.sk

Šedá barva

Nepůsobí tak ostrým dojmem jako černá, ale ztrácí čistotu bílé barvy. (Samozřejmě záleží na konkrétním odstínu, který je použit v daném designu.) Můžeme ji zařadit ke studenému konci spektra barev.

  • Může působit náladově až depresivně, rovněž konzervativně, formálně, profesionálně, ale i velmi sofistikovaně, pokud je využita ve správném typu designu.

Nejčastěji je používána do pozadí, ale i na barvu písma.

šedá farba vo webdizajne

klient konzole-prislusenstvi.cz stavil na šedou barvu

Hnědá barva

Hnědá v nás vyvolává pocity odpovědnosti, vytrvalosti a zemitosti. Může být považována i za fádní, nevýraznou barvu, záleží na jejím odstínu.

  • Je spojována s přírodou, barvou země a dřeva. Pomáhá přenést do designu přírodní teplo, pocit bezpečí, domova a pohodlí.

Je často využívána na pozadí, imitaci dřevěné a občas i kamenné textury. Její tmavší odstíny mohou být využity jako náhrada za černou a rovněž se může objevit jako barva písma.

hnedá farba vo webdizajne

hnědá barva dřeva v pozadí webu horské chaty – popradskepleso.com

PALETA BAREV

Při vytváření designu webu je podstatné uvědomit si, jaké pocity chceme u návštěvníka svého webu vyvolat, a tomu přizpůsobit barvy. Aby byly v souladu s Vaším záměrem i filozofií Vaší firmy, kterou budou reprezentovat. Věříme,  že Vám náš předešlý a dnešní článek pomohly pochopit jejich význam. Pokud se chcete dozvědět víc o správném míchání a kombinování barev,  doporučujeme http://paletton.com.

naučte sa správne miešať a kombinovať farby pomocu nástroja paletton.com

Jedním ze dvou hlavních prvků na stránce je paleta barev. Ve vnějším kruhu palety si můžete vybrat barvu, kterou chcete jako hlavní barvu pro svůj design. Ve vnitřním kruhu si můžete vybrat konkrétní odstín dané barvy.

V levé části obrazovky se nachází druhý hlavní prvek – simulátor.

simulátor farieb paletton.com

Zde Vám simulátor vygeneruje jednotlivé barevné odstíny, na základě Vámi zvolené hlavní barvy, které doporučuje zkombinovat tak, aby byla webová stránka přehledná a barvy dobře rozlišitelné.

Kliknutím na jednotlivé čtverce se Vám zobrazí tabulka obsahující informace o konkrétní barvě. Dané hodnoty si můžete uložit a poslat svému grafikovi, případně je zužitkovat při tvorbě grafiky ve Floxu.

informácie o farbách

Při volbě své základní barvy si můžete vybrat z více palet, které software předpřipravil. Nemusíte tedy odstín barvy ručně zdlouhavě ladit. Můžete si vybrat z předpřipravených možností. Tuto možnost vyvoláte kliknutím na tlačítko PRESETS v dolní části.

predpripravené možnosti kombinácií farieb v paletton.com

U vybírání správné barvy a jejích odstínů se nemusíte omezovat jen na jednu barvu. Můžete si vybrat z více možností – kombinovat 1 až 4 barvy (více kombinací samostatných barev se nedoporučuje, mezi samostatné barvy neřadíme jednotlivé odstíny). Z možností si můžete vybírat v horní liště. Kliknutím na tlačítko „add complementary“ se Vám k vybrané možnosti doplní další barva. Podle zvoleného množství barev se změní i simulátor vpravo.

ako  kombinovať farby vo webdizajne

Pokud jste se prozatím nerozhodli, jaká barva se Vám líbí, jaký design si zvolit, jaké rozložení stránky si ve Floxu vybrat, máme pro Vás tip.

Do redakčního systému Flox Vám naši programátoři zakomponovali i prvky umělé inteligence, takže si můžete změnit webdesign jen 1 kliknutím na čarovnou hůlku Vygenerovat šablonu.

automatické generování šablony webu

Tato Vám vybere náhodné rozložení webu, náhodný banner a následně se začíná dít ta zajímavá část.

Flox analyzuje barevné složení banneru, podle toho vybere nejvíc využívané barvy a sladí je podle grafických pravidel. Zvolené barvy tedy ladí nejen mezi sebou, ale i spolu s bannerem.

Flox přesně ví, které části webu jsou důležité (jako například menu nebo nákupní košík), a proto jim vždy přidělí výraznější barvy. U méně důležitých míst využívá Flox jemnější barvy. Barevné schéma šablony poté působí kompaktně a uživatelsky příjemně.

Automatické generování šablon obsahuje každý z našich balíčků, dokonce i webové stránky a e-shopy zdarma. Flox dokáže vytvořit tisíce kombinací barev, písma a designových prvků, které Vám pomohou oživit Váš web.

A nyní se již můžete směle pustit do inovace grafické šablony webu. Pokud byste si i přes naše doporučení stále nevěděli rady, nezoufejte. Pro své webové stránky a e-shopy od ByznysWebu si můžete tvorbu grafického designu kdykoliv doobjednat.

objednavka-webdesignu

Ty správné barvy pro Váš byznys Vám přeje ByznysWeb 🙂

avatar
Autor: Lukáš Koprivňanský Lukáš pracuje jako Key Account Manager pro klienty ByznysWeb.cz a BiznisWeb.sk. V malíčku má i HTML a CSS a tak Vám rád pomůže s designovými úpravami webové stránky nebo e-shopu.

Diskuse k článku