Správne zvolené farby dodajú webu nadčasovosť. Celý proces výberu vhodných farieb môžeme prirovnať napríklad k zariaďovaniu obývačky. Vďaka návrhu od bytového dizajnéra získate priestor, ktorý je nielen krásny, harmonický, presne podľa vašich predstáv, ale je aj funkčný. Navyše pri dobre premyslených detailoch interiér zohľadní neustále nové “aktuálne” trendy a ochráni vašu peňaženku pred zbytočným prievanom.
V článku si najprv ukážeme, prečo sa zaoberať globálnymi farbami, a kde si ich v Elementore môžete nastaviť. Potom sa pozrieme na to, ako postupovať pri výbere farieb pre váš web. Podelím sa aj o užitočné vychytávky, aby ste sa pri výbere farieb vždy trafili do čierneho. 🙂
Prečo v Elementore nastaviť globálne farby
Netreba za tým hľadať žiaden háčik. Keď si nastavíte globálne farby, vytváranie stránok bude jednoduchšie a oveľa rýchlejšie. Kódy farieb si nemusíte pamätať alebo ich neustále kopírovať. Jednoducho si ich na webe uložíte, aby ste ich mohli používať na miestach, kde to práve potrebujete (nadpisy, ikony, pozadie sekcií…)
Ak vás po čase niektorá z farieb omrzí, stačí ju zmeniť v nastaveniach. Úprava globálnej farby sa premietne na celom webe. Nemusíte pátrať, kde všade, a na akých stránkach ste pôvodnú farbu použili.
V článku 6 tipov, vďaka ktorým bude vaša práca s Elementor rýchlejšia nájdete ďalšie odporúčania, aby ste pri tvorbe webu nestrácali drahocenný čas a boli viac efektívnejší.
Ako v Elementore nastaviť globálne farby
Prihláste sa do administrácie webu, vyberte si niektorú stránku a kliknite na “Upraviť s Elementorom”. Potom v ľavom hornom rohu kliknite na “Hamburger” (3 rovné čiary pod sebou), “Nastavenia stránky” a “Globálne farby”.
Zobrazia sa vám “Systémové farby” a “Vlastné farby”, ktoré si môžete pridať, keď kliknete na tlačítko “+ Pridať farbu”.
Kedy použiť Systémové a kedy Vlastné farby?
Systémové farby
Ak vytvárate web, ktorý si vystačí s jednou farbou pre nadpisy (H1) a podnadpisy (H2-H6), ďalšou farbou pre text, poslednou farbou pre tlačítka a text s vloženým odkazom (napr. link na článok alebo stránku), Systémové farby sú pre vás ideálne. Vôbec nemusíte riešiť Vlastné farby.
Stačí nastaviť farby pre:
- Hlavný element – Nadpis, Ikona, Box s ikonou,
- Sekundárny element – text v Zozname s ikonami alebo v Počítadle,
- Text – element Textový editor,
- Zvýrazniť – element Tlačidlo alebo bežný Text s vloženou linkou.
Vlastné farby
Vlastné farby využite, ak chcete pracovať so základnými, neutrálnymi a extra farbami, čím webu dodáte väčšiu hĺbku a štruktúru.
Aby Elementor ignoroval Systémové farby a zameral sa na Vlastné farby, je potrebné zakázať predvolené farby. Spravíte to tak, že v administrácii webu kliknete na “Elementor”, “Nastavenia” a potom v časti “Všeobecné” zaškrtnete možnosť “Zakázať predvolené farby”.
Avšak aj keď sa vydáte cestou Vlastných farieb, vyberte si z nich farbu hlavnú, sekundárnu, pre text, tlačítko a nastavte ich v Systémových farbách. Pri niektorých elementoch vám pri úprave štýlu Elementor ponúkne Systémové farby, nie Vlastné. Takto sa vyhnete zdĺhavému hľadaniu kódu tej správnej farby.
Ako postupovať pri výbere farieb pre váš web
Na webe je najdôležitejší obsah, ktorý môžu podporiť správne zvolené farby. Kvalitný obsah a skvelý dizajn tvoria fungujúci celok. Jeden bez druhého sa nezaobídu!
Ak návštevníka na vašom webe čaká farebné rošambo, na čítanie kvalitného obsahu ani nedôjde. Divoká farebná kombinácia môže potenciálneho klienta skôr odradiť. A platí to aj opačne. Ani dizajnovo vymakaný web vás nezachráni, ak na ňom návštevník nenájde úžitok alebo pridanú hodnotu.
Prvý dojem na druhýkrát už nespravíte.
1. Rozhodnite sa, či pozadie vášho webu bude svetlé alebo tmavé
Prechod medzi svetlým a tmavým pozadím môže byť pre oko náročné, pretože sa musí rýchlo prispôsobiť výraznej zmene. Prirodzenejšie sú prechody farieb, ktoré sú si veľmi blízke, napr. biela – svetlomodrá alebo modrá – tmavomodrá. Medzi farbami nie je až tak vysoký kontrast, preto ich oko zvláda oveľa lepšie.
2. Vyberte si dve základné a jednu extra farbu
Pri výbere vhodnej farby pre váš web vám určite pomôže farebný kruh. Keď kruh zvislo rozdelíme na dve polovice, naľavo nájdete teplé farby (červená, oranžová, žltá) a napravo farby studené (fialová, modrá, zelená). I keď každá farba môže mať teplý, aj studený vzhľad. Záleží či zmes obsahuje vyšší podiel žltej alebo modrej farby.
Podľa toho, ako farby vytvárame, poznáme:
- primárne farby – modrá, žltá, červená (nie sú vytvorené žiadnou kombináciou iných farieb),
- sekundárne farby – fialová, zelená, oranžová (ide o rôznu kombináciu primárnych farieb),
- terciárne farby – kombinácia primárnych a sekundárnych farieb.
Aby váš web pôsobil harmonicky, vyberte si 2 – 3 farby. Aj Elementor vie, že menej je viac. Preto tvorcom webu ponúka v Systémových farbách priestor pre nastavenie maximálne troch farieb a jednej farby pre zvýraznenie.
Pri výbere vhodných farieb, môžete zvoliť:
- Monochromatické farby – farebnú paletu vytvoríte kombináciou jednej farby (napr. modrá) a jej odtieňov (svetlomodrá, tmavomodrá).
- Analógové farby – paleta použitá na webe pozostáva z kombinácie troch farieb, ktoré sa na farebnom kruhu nachádzajú vedľa seba (napr. modrá, tmavomodrá, fialová alebo oranžová, terakota-tehlovočervená, červená). Takto vám bude všetko so všetkým ladiť.
- Nakoniec vyberte jednu extra – komplementárnu farbu, ktorú použijete na tlačidlá, príp. odkaz vložený do textu. Ide o farby, ktoré na farebnom kruhu stoja presne oproti sebe (napr. žltá – fialová, oranžová – modrá, červená – zelená). Komplementárne farby poskytujú vysoký kontrast, preto na webe, ktorý je ladený do modra, neprehliadnete oranžové tlačítko.
3. K základným farbám dolaďte neutrálne farby
Neutrálne farby môžeme rozdeliť na studené a teplé. Studené neutrálne farby sú biela, šedá a čierna. Tieto farby sú achromatické. To znamená, že už neobsahujú žiadne iné farby.
Teplé neutrálne farby vznikajú primiešaním teplých chromatických farieb (žltá, červená) do studených neutrálnych farieb (biela, šedá, čierna). Takto vytvoríme príjemné teplé tóny farieb ako napr. telová, béžová, hnedá.
Výhodou neutrálnych farieb je to, že sa skvele kombinujú s ďalšími farbami. Ak chcete niektorú časť webu odlíšiť od bieleho alebo tmavého pozadia a obávate sa, že použitie základnej farby, ktorú ste si pre web zvolili, by už nebolo ono, siahnite po neutrálnej farbe.
Užitočné tipy, aby vám výber farieb neprerastol cez hlavu
Teplé, studené, žiarivé, matné, svetlé, tmavé farby, odtieň, tón, kontrast… Máte v tom chaos? Nevadí, existujú vychytávky, ktoré vás z bludného kruhu dovedú k tomu farebnému. 🙂
Adobe color
Adobe color je šikovná aplikácia, vďaka ktorej vytvoríte krásne farebné palety. Aby ste sa v nej hneď na začiatku nezamotali, vyberte si fotku, ktorá sa vám farebne páči. Potom obrázok nahrajte do aplikácie – zvoľte možnosť “Vytvoriť” – “Extrahovať motív”. Aplikácia z fotky vytiahne farby (vrátane ich kódu), ktoré môžete použiť na webe ako základné farby.
Vyskúšajte, ako budú farby fungovať v texte v kombinácii so svetlým alebo tmavým pozadím (nepoužívajte čisto čiernu farbu s kódom #000000, ale jej o niečo svetlejší odtieň, napr. #1B1B1D).
Ak farbu použijete priamo na pozadí, text by nemal byť čisto biely alebo šedý. Radšej zvoľte svetlejší odtieň farby pozadia. Prechod medzi pozadim a textom bude plynulejší, prirodzený pre oko.
Okrem výberu základných farieb vám aplikácia Adobe color pomôže s výberom farieb, ktoré môžete použiť na pozadí s prechodom (Gradient) – “Vytvoriť” – “Extrahovať prechod”.
Ďalším ideálnym miestom, kde sa dá inšpirovať, je Pinterest. Stačí do vyhľadávania zadať napr. web design alebo color palette design. Majte oči otvorené a nechajte sa viesť prírodou, pretože tá dokáže divy. Jej farebné kombinácie fungujú nabetón. Obrázky na Pintereste to len potvrdzujú. 😉
Nicepage
Možno ste typ človeka, ktorý reaguje na podnet. Chcete vytvoriť web pre klienta, ale nič originálne vás nenapadá. Poflakujete sa internetom, až narazíte na parádnu časť (napr. sekciu s ponukou služieb), ktorá vás tak nakopne, že sa vám web začne v myšlienkach sám skladať. Nicepage je na okukávanie perfektný.
Výber vhodných farieb je o tréningu. Držím palce, nech vám to ide ako po masle. 🙂
Tvorím weby a grafiku pre ženy, ktoré s nimi ladia. Vďaka tomu dokážu autenticky šíriť posolstvo svojho podnikania, a tak ľahšie získať tých správnych klientov. Mám rada, keď web dýcha charizmou a štýlom ženy. Má čistý a pre ňu príznačný dizajn, ktorý podčiarkne jej osobnú značku.