Jak vybrat barvy na blog


Ačkoliv v minulém článku jsem vám představila dvě čistě černobílé šablony, jsem zastánce toho, že na blozích má být barva. I proto jsem se rozhodla dát vám k dispozici ještě jednu verzi této šablony, kterou si budete moct sami upravit.

Ale než tak učiním, chci vám dát pár tipů, jak s barvami na blogu pracovat. (A pokud se vám bude zdát, že některé body znějí podobně jako v článku o písmech, věřte, že to není náhoda.)

Méně je více

Stejně jako u fontů, i u barev platí, že je lepší to s nimi nepřehánět. Nejlepší je vždy začít s bílo-černým základem #ffffff a #000000 nebo #111111, což je příjemnější varianta pro oči. Jiné odstíny tmavě šedé ovšem fungují stejně dobře. A tato šedivá kombinace se poté dá doplňovat dalšími barvami.
Přidávat další barvy ovšem neznamená, že vezmete všechny barvy duhy a nacpete je, kde se dá. Ne! Nejvyšší počet základních barev by se měl pohybovat kolem čísla 3.

Čitelnost nadevše


Podívejte se na texty na obrázku nahoře. Který sloupec se vám čte lépe a který hůře? Odpověď by měla být jasná... Čitelnost je v tomto případě dána kontrastem mezi dvěma překrývajícími se barvami (tj. barvou textu a barvou pozadí).
Myslete na to, že váš blog plní především funkci informativní a až poté estetickou. K čemu je blog, když čtenář většinu podstatných věcí kvůli nízkému kontrastu ani nepřečte?

Co je to hex code

Hex code - neboli hexadecimální kód - je šestice (v některých případech trojice) číslic a písmen předcházená znakem #, která je určená pro zápis barvy. (V tomto článku už jich pár je, schválně, kdo je najde první?) Tento kód zadáváte do editoru vašeho blogu a nebo do CSS kódu.
Nakonci tohoto článku bude seznam užitečných pomůcek při práci s barvami. Mezi nimi třeba i taková, která vám hex kódy rychle zjistí z jakéhokoli obrázku... Určitě je nezapomeňte všechny prozkoumat!

Jak vybrat barvy

Každá barva má svůj význam, každá nějak působí na člověka. Proto základní barvy vybírejte s obzvlášť velkou pečlivostí a při jejich výběru si pokládejte otázky jako:
  • Čím se zabývá můj blog? Je zaměřený na módu, vaření, knihy, ...?
  • Kdo jsou mí čtenáři? Jsou to teenageři, studenti, matky s malými dětmi, ...?
  • Jak chci, aby na ně můj blog působil? Blog může čtenáře uklidnit, ale i rozdráždit. Jaký je ten váš?
Nebudu sem vypisovat, jak která barva na koho působí, nicméně založila jsem nástěnku na Pinterestu, která se tímto tématem zabývá a kam i v budoucnosti budu určitě přidávat další piny.

Způsobů, jak barvy kombinovat je spousta. Můžete volit z několika pravidel, mezi nimi třeba analogické, trojúhelníkové či doplňkové. Ale než vám tady vysvětlovat teorii barev, radši se podívejte na stránku Adobe Color CC a vyzkoušejte si to v praxi.

Kde vybrané barvy používat

Jak už jsem řekla na začátku, používat barvy neznamená, že je nacpete, kam se dá. Naopak byste měli pečlivě rozmýšlet, kde barvu použít a kde nechat klasickou černou / šedou.

Kde se stoprocentně vyplatí použít barvu jsou odkazy. Nejsem velkým fanouškem podtrhávání, tak mi obvykle nezbývá jiný způsob, jak odkazy odlišit od obyčejného textu. Dejte si ovšem pozor, aby barva odkazů byla unikátní (tzn. aby se na blogu neobjevila jinde než v odkazu). Aby se potom nestalo, že čtenář bude zuřivě klikat na váš barevný podnadpis v domění, že jde o odkaz.

Vybrané barvy můžete používat i v jakékoli grafice, kterou ke svému blogu děláte. (Proto mou zlatou vidíte na každém úvodním obrázku.)

Barevné schéma vašeho blogu by také mělo souhlasit s vaším logem. A nebo by vaše logo mělo souhlasit s barevným schématem blogu? Toť otázka a téma pro vás k zamyšlení...
Barva blog jen dotváří. Je to takovou třešničkou na dortu. Stejně jako dort může být bez ozdob i blog může existovat bez barvy. Ale co když ta třešnička na dortu rozhodne o tom, zda si zákazník v cukrárně dort koupí? Co když ta trocha barvy bude mít vliv na to, zda se čtenář bude pravidelně vracet?

Zkusila jsem barvy, které jsem vybrala o něco výše, použít do šablony Black and ??? (ke stažení již brzy). V tomto případě jsem se rozhodla, že nejtmavší barvou (#3F4042) bude napsaný prostý text, dvě nejsvětlejší (#E9F2ED a #BE9B78) použiji na odkazy a horní lištu a jejich tmavší varianty se zobrazí, pokud přes elementy přejedeme myší (to můžete vidět u odkazu "Kontakt" na navigační liště).

Užitečné odkazy při výběru barev:

  • Colours - nástěnka na Pinterestu o barvách a jejich významech
  • Adobe Color CC - pomocník při tvorbě kombinací i při zjišťování hex kódů z obrázků
  • ColorHexa - databáze barev se spoustou skvělých informací
  • 0 to 255 - nepřekonatelný v hledání odstínů
  • Design Seeds - překrásné barevné kombinace plné inspirace
  • Colordot - najděte "tu pravou" zábavným způsobem
  • Design inspiration - název mluví za vše, inspirujte se
  • Coolors - (NOVÉ!)
Pokud by vás tohle téma hodně zajímalo, mohu o něm napsat více, pro dnešek to ale bude vše. Já doufám, že se vám článek líbil a že jste se dozvěděli něco nového. Budu ráda, když mi necháte komentář, ať se mohu jít podívat, jaké barvy jste vybrali na svůj blog.

Nezapomeňte také sledovat můj blog na Facebooku, a jestli máte zájem o na míru dělanou šablonu, nově přidaná FAQ stránka je pravým místem pro vás.
Přes všechna pravidla a poučky, o kterých jste si právě teď přečetli, nezapomeňte, prosím, na to, že váš blog, váš malý kousek internetu, se musí líbit hlavně vám. A to i za cenu toho, že budete ignorovat vše, co jsem tady právě napsala.

8 komentářů:

  1. Velmi zajímavý blog, nad barvami jsem se až tolik nezamýšlela a přesto jsem se Tvých rad vlastně držela! :D Bílý podklad s černým písmem je podle mě naprostý základ, kterého by se mělo držet a barevný detail jsem použila takový, jaký se líbí mně! :D Ale už koukám na Tvoji Barvenou Nástěnku a asi o tom ještě trochu popřemýšlím! :) Takže děkuji, máš zajímavé rady, dávám odběr! :)
    www.lifestylebirdie.com

    OdpovědětVymazat
    Odpovědi
    1. Jsem moc ráda, že jsem pomohla! Díky za komentář. :)

      Vymazat
  2. Velmi zajímavý článek, který by si měl přečíst povinně snad každý! :)

    Gabux

    OdpovědětVymazat
    Odpovědi
    1. Děkuji, takovýhle komentář vždycky potěší. :)

      Vymazat
  3. Mě až překvapuje, kolik lidí ignoruje, že je potřeba, aby bylo písmo čitelné - snad jako by jim bylo jedno, jestli bude text někdo číst :)

    OdpovědětVymazat
    Odpovědi
    1. I mě to udivuje, ale takoví lidé si možná ani nezaslouží, aby jejich články někdo četl (tvrdá slova, já vím), a pro všechny ostatní je tu tento článek. :) Díky za komentář!

      Vymazat
  4. Já jsem všechno vsadila na jednoduchost. Světlé (ale ne přímo bílé) pozadí a černý text. Jsem spokojená. Mám co se týče vzhledu co největší jednoduchost :)

    OdpovědětVymazat
    Odpovědi
    1. Taky jsem fanoušek jednoduchosti. :) Díky za komentář!

      Vymazat