Jeden konkurent působí na každé obrazovce vyleštěně. Druhý působí stísněně a zastarale, i když oba prodávají podobné služby. Rozdíl obvykle spočívá ve vizuálním vyvážení v designu a v návycích, které za tím stojí. Rozdíl poznáte hned, i když zatím neumíte pojmenovat každé pravidlo.
Vizuální vyvážení v designu rozděluje vizuální váhu tak, aby stránka působila stabilně. Tato kapitola jednoduše vysvětluje, co to znamená, proč to ovlivňuje váš web i marketing a jak to uplatnit bez zbytečného žargonu. Uvidíte také, jak do stejného obrazu zapadá vizuální hierarchie. Projděme si to krok za krokem.
Co vizuální vyvážení v designu znamená v praxi
Vizuální vyvážení v designu rozděluje vizuální váhu tak, aby stránka působila stabilně.
Asymetrie může působit moderně, pokud zůstanou jasné mezery a hierarchie.
Bílý prostor v designu je nástroj, jak vyvážit těžké obrázky s textem.
Jak použít vizuální vyvážení v designu na webu
Pokud je jedna strana sekce příliš těžká, upravte velikost obrázku nebo přidejte odsazení.
Začněte jednou stránkou, třeba úvodní nebo hlavní vstupní. Nejdřív opravte největší problém a stejný postup pak přeneste na další šablony.
Tuto kapitolu spojte s kapitolami zarovnání v designu jako základem a pozitivní a negativní prostor jako dalším krokem v tomto modulu.
Praktický seznam, který můžete použít hned dnes
Pokud je jedna strana sekce příliš těžká, upravte velikost obrázku nebo přidejte odsazení.
Když kontrolujete jakoukoli stránku, ptejte se, zda je vizuální vyvážení v designu patrné už při prvním posunu na mobilu. Pokud ne, přeskládejte sekce dřív, než začnete ladit detaily.
Ukládejte si snímky obrazovky před změnou a po ní, abyste poznali, co u vizuálního vyvážení v designu na vašem webu skutečně zabralo.
Sdílejte tento seznam s každým, kdo váš web upravuje, aby vizuální hierarchie zůstala jednotná i na nových stránkách.
Vyberte si na tento měsíc jedno číslo ke sledování, třeba čas na stránce nebo počet zahájených formulářů, aby změny designu souvisely s výsledky podnikání, a ne jen s vkusem.
Jak toto téma souvisí s celou vaší značkou
Vizuální rozhodnutí málokdy žijí jen na jedné stránce. Asymetrie může působit moderně, pokud zůstanou jasné mezery a hierarchie.
Vaše příspěvky na sociálních sítích, e-maily i tištěné materiály by měly opakovat stejnou hierarchii, barvy a pravidla písma jako váš web.
Když se vizuály značky rozcházejí, zákazníci cítí nepatrný nesoulad, i když ho neumějí vysvětlit.
Podívejte se na pozitivní a negativní prostor a porovnejte si poznatky se související kapitolou tohoto modulu.
Asymetrie může působit moderně, pokud zůstanou jasné mezery a hierarchie.
Časté otázky, které lidé přehlížejí
Související pojmy jako vizuální hierarchie a bílý prostor v designu vám pomohou najít další příklady a porovnat vaši práci s běžnými standardy.
Bílý prostor v designu je nástroj, jak vyvážit těžké obrázky s textem.
Zapište si jednu změnu, kterou tento týden otestujete na ostré stránce, včetně stavu před a po. Malé změřené úpravy porazí vágní plány.
Společná slovní zásoba týmu kolem vizuálního vyvážení v designu zkracuje kola úprav s designéry a agenturami.
Nástroje, které usnadní vizuální úpravy
Na zlepšení rozvržení a stylu často nepotřebujete vlastní kód. Vizuální editor vám umožní upravit mezery, barvy a písmo a zároveň si prohlédnout náhled na mobilu i na počítači.
WEMASY obsahuje tvůrce webů s vizuálními úpravami, takže změny můžete publikovat, aniž byste kvůli každé drobnosti čekali na vývojáře. Otevřete tvůrce webů, až budete chtít použít, co jste se naučili.
Když zveřejníte úpravy, znovu zkontrolujte zarovnání v designu a kontrast v designu, aby si modul v hlavě držel pohromadě.
Teď už máte pro vizuální vyvážení v designu funkční pohled. Použijte ho při kontrole webu, schvalování marketingových materiálů nebo zadání pro designéra. Pokračujte kapitolami kontrast v designu a pozitivní a negativní prostor a udržte v tomto modulu tempo.
Často kladené otázky
Jak dlouho trvá zlepšit vizuální vyvážení v designu?
Většina malých firem má přehlednější stránky už po několika soustředěných sezeních, když použije základy z této kapitoly. Začněte úvodní stránkou a stejná pravidla pak přeneste na stránky služeb a kontaktu.
Potřebujete designéra na vizuální vyvážení v designu?
Designér pomůže u složitého rebrandingu, ale řadu oprav kolem vizuálního vyvážení v designu zvládnete sami, jakmile víte, na co se dívat. Souvisejícím tématem je zarovnání v designu.
Může WEMASY pomoci s vizuálním vyvážením na vašem webu?
WEMASY má v tvůrci webů vizuální editor, takže rozvržení, barvy a písmo upravíte bez kódu. Otevřete tvůrce webů, upravte šablony a prohlédněte si náhled na mobilu.
Jaká je nejčastější chyba u vizuálního vyvážení v designu?
Lidé se snaží opravit všechno najednou místo jedné stránky po druhé. Vyberte jednu prioritu, třeba čitelnost nebo kontrast, a pak se podívejte na kontrast v designu, co zlepšit dál.
Jak souvisí vizuální vyvážení v designu se SEO?
Jasná vizuální hierarchie a čitelné písmo udrží návštěvníky na stránce déle, což podporuje signály zapojení, které vyhledávače sledují. Opravy designu spojte s promyšlenou strukturou obsahu a výsledek bude nejlepší.
Co se učit dál po vizuálním vyvážení v designu?
Pokračujte v této knize kapitolami zarovnání v designu a kontrast v designu a vybudujte kompletní vizuální systém své značky online.