V úterý pozdě večer obnovíte úvodní stránku. Nadpis je v pořádku, fotky taky, ale návštěvníci přesto odcházejí během pár vteřin. Začnete se ptát, jestli právě vizuální design není to, co jste přehlíželi. Často je. Drobná vizuální rozhodnutí utvářejí první dojem rychleji, než většina podnikatelů čeká.
Vizuální design je uspořádání vizuálních prvků tak, aby informace byly jasné, přitažlivé a sloužily cíli. Tato kapitola jednoduše vysvětluje, co to znamená, proč to ovlivňuje váš web a marketing a jak to použít, aniž byste se ztratili v odborných výrazech. Uvidíte také, jak do stejného obrazu zapadá vizuální komunikace. Pojďme na to krok za krokem.
Co je vizuální design
Vizuální design je uspořádání vizuálních prvků tak, aby informace byly jasné, přitažlivé a sloužily cíli.
V praxi se vizuální design objevuje v záhlaví webu, na stránkách služeb, v grafikách pro sítě i v tištěných materiálech. Když ho správně pojmenujete, rychleji zadáte práci designérům a návrhy zkontrolujete s jistotou.
Související myšlenky, například vizuální komunikace, na něj přímo navazují. Mějte je na paměti, když čtete zbytek tohoto modulu.
Utváří to, jak lidé vnímají váš web, prezentace, reklamy i obrazovky produktů.
Proč na vizuálním designu záleží pro vaši firmu?
Zákazníci posuzují důvěryhodnost podle rozvržení dřív, než přečtou každé slovo. Přehledná vizuální struktura snižuje tření a nabídku usnadňuje pochopit.
Vizuální komunikace přenáší stejné myšlenky napříč kanály.
Než vyberete obrázky, určete pro každou stránku jeden vizuální cíl, například registraci nebo telefonát.
Pokud chcete vidět, jak to souvisí se sousedními tématy, přečtěte si dále proces designu od začátku do konce a co je wireframe.
Praktický seznam, který můžete použít hned dnes
Než vyberete obrázky, určete pro každou stránku jeden vizuální cíl, například registraci nebo telefonát.
Při kontrole jakékoli stránky se ptejte, zda je vizuální design vidět už při prvním posunu na mobilu. Pokud ne, přeuspořádejte sekce dřív, než začnete ladit detaily.
Ukládejte si snímky obrazovky před změnami i po nich, abyste poznali, co se u vizuálního designu na vašem webu skutečně pohnulo.
Sdílejte tento seznam s každým, kdo váš web upravuje, aby vizuální komunikace zůstala na nových stránkách jednotná.
Vyberte si tento měsíc jedno číslo ke sledování, třeba čas na stránce nebo začaté formuláře, aby se změny designu vázaly na obchodní výsledky, a ne jen na vkus.
Jak toto téma souvisí s celou vaší značkou
Vizuální rozhodnutí málokdy platí jen pro jednu stránku. Utváří to, jak lidé vnímají váš web, prezentace, reklamy i obrazovky produktů.
Vaše příspěvky na sítích, e-maily i tištěné materiály by měly opakovat stejnou hierarchii, barvy a pravidla písma jako web.
Když se vizuál značky rozjede, zákazníci cítí nenápadný nesoulad, i když ho neumí popsat.
Použijte kapitolu příklady dobrého designu webu a porovnejte poznatky s příbuznou kapitolou v tomto modulu.
Utváří to, jak lidé vnímají váš web, prezentace, reklamy i obrazovky produktů.
Časté otázky, které lidé přehlížejí
Související výrazy jako vizuální komunikace a principy vizuálního designu vám pomohou najít hlubší příklady a porovnat svou práci s běžnými standardy.
Vizuální komunikace přenáší stejné myšlenky napříč kanály.
Zapište si jednu změnu před a po, kterou tento týden vyzkoušíte na živé stránce. Malé změřené úpravy porazí nejasné plány.
Společná slovní zásoba kolem vizuálního designu ve vašem týmu zkracuje kola úprav s designéry a agenturami.
Nástroje, které usnadní vizuální úpravy
K vylepšení mnoha problémů s rozvržením a stylem nepotřebujete vlastní kód. Vizuální editor vám umožní upravit mezery, barvy a typografii a přitom sledovat náhled na mobilu i na počítači.
WEMASY obsahuje Tvůrce webů s vizuálními úpravami, takže změny zveřejníte, aniž byste kvůli každé drobnosti čekali na vývojáře. Otevřete Tvůrce webů, až budete chtít uplatnit, co jste se naučili.
Po zveřejnění úprav si znovu projděte proces designu od začátku do konce a co je wireframe, ať vám modul zůstane v hlavě pohromadě.
Nyní máte k dispozici použitelný pohled na vizuální design. Využijte ho při kontrole webu, schvalování marketingových materiálů nebo zadávání práce designérovi. Pokračujte kapitolami co je wireframe a příklady dobrého designu webu, ať v tomto modulu nepolevíte.
Často kladené otázky
Jak dlouho trvá zlepšit vizuální design?
Většina malých firem uvidí přehlednější stránky během několika soustředěných sezení, jakmile uplatní základy z této kapitoly. Začněte úvodní stránkou a stejná pravidla pak rozšiřte na stránky služeb a kontaktu.
Potřebujete na vizuální design designéra?
Designér pomůže u složitější změny značky, ale mnoho oprav kolem vizuálního designu zvládnete sami, jakmile víte, na co se dívat. Spolu s touto kapitolou využijte proces designu od začátku do konce.
Pomůže WEMASY s vizuálním designem na vašem webu?
WEMASY obsahuje v Tvůrci webů vizuální editor, takže rozvržení, barvy i typografii upravíte bez kódu. Otevřete Tvůrce webů, upravte šablony a zkontrolujte náhled na mobilu.
Jaká je nejčastější chyba u vizuálního designu?
Lidé se snaží opravit všechno najednou místo jedné stránky po druhé. Vyberte si jednu prioritu, třeba čitelnost nebo kontrast, a pro další zlepšení se podívejte na co je wireframe.
Jak vizuální design souvisí 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 dobrou strukturou obsahu a výsledky budou nejlepší.
Kam se posunout po vizuálním designu?
Pokračujte kapitolami proces designu od začátku do konce a co je wireframe v této knize a vybudujte si úplný vizuální systém své značky online.