Jak vybrat správné páry fontů pro web
Jednoduché pravidlo pro kombinování dvou písem, která si navzájem rozumí. Nejčastější chyby a jak se jich vyvarovat.
Přečíst víceTypografie a teorie barev pro moderní weby
Praktické zdroje pro párování fontů, vytváření barevných palet a techniky vizuální hierarchie. Vše, co potřebujete vědět o typografii a barvách v Česku.
Články a příručky
Prozkoumejte nejnovější články o typografii, barevných schématech a vizuální hierarchii pro webový design.
Vytváření barevné palety krok za krokem
Jak vytvořit harmonickou paletu pěti až osmi barev, která funguje na všech zařízeních. Includes praktické příklady z českých projektů.
Přečíst více
Vizuální hierarchie v typografii — co funguje
Pět technik, kterými udělíte webu strukturu. Bez těchto principů si uživatelé nevědí, kudy jít. A to není dobré.
Přečíst více
Přístupnost barev — WCAG standard v praxi
Jak ověřit, že váš web čtou všichni — včetně lidí se slabším zrakem. Nástroje a jednoduché testy, které zvládnete.
Přečíst víceZákladní principy, které se vyplatí znát
Není potřeba být designér, aby vám přišly logické. Tady jsou čtyři klíčové nápady, které změní způsob, jakým se díváte na weby.
Kontrastní poměry
Text a pozadí musí mít dostatečný rozdíl. WCAG doporučuje minimálně 4,5:1 pro běžný text. To zní technicky, ale ve skutečnosti to znamená — když si sedneš daleko, pořád to čteš.
Váha a velikost
Nemusíš měnit barvu, aby byl text důležitý. Větší, tučnější text už to udělá. A často to funguje lépe než barvení všeho do duhy.
Bílá plocha
Prostor mezi prvky je stejně důležitý jako samy prvky. Když všeho moc je, uživatel neví, kam koukat. Metr vzdálenosti dělá divu.
Konzistence
Pokud je nadpis větší na jedné stránce, měl by být stejně velký všude. To se vyplatí. Uživatelé vědí, na co se dívat, protože už to viděli.
Nástroje a zdroje pro českou komunitu
Nejlepší věc na typografii? Nemusíš ji vymýšlet sám. Tady jsou věci, které používáme všichni v Česku a funguji.
Google Fonts — zdarma a bez komplikací
Přes tisíc fontů, které se načtou rychle. Nemáš licenční problémy, nemáš starosti. Ideální na začátek. Jsou tam i dobré bezpatkové kombinace, které už někdo vyzkoušel.
Figma — design všichni dohromady
Když pracuješ s týmem, je to nejsnazší. Můžete dělat barevné palety společně a hned vidíte, jak to vypadá. A je to zdarma na základní úrovni.
WebAIM Contrast Checker — ověř si dostupnost
Jednoduše vložíš barvu textu a pozadí, a řekne ti, jestli to projde WCAG. Používej to na každé barvě. Trvá to vteřinu a je to důležité.
Coolors.co — generátor palet, co opravdu fungují
Stiskneš mezerník a vygeneruje se nová paleta. Když se ti něco líbí, zamrazíš to. Za chvíli máš celou sadu barev, která drží pohromadě. Není to náhodné, je to matematika.