Jeden konkurent vypadá na každé obrazovce vypilovaně. Druhý působí stísněně a staromódně, přestože oba prodávají podobné služby. Rozdíl obvykle tvoří to, jak je web přizpůsobený mobilům, a návyky, které za tím stojí. Rozdíl poznáte hned, i když zatím neumíte pojmenovat každé pravidlo.
Web vhodný pro mobily je čitelný bez přibližování, klepání na drobné odkazy nebo vodorovného posouvání. 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á mobile first design. Pojďme na to krok za krokem.
Co v praxi znamená přizpůsobit web mobilům
Web vhodný pro mobily je čitelný bez přibližování, klepání na drobné odkazy nebo vodorovného posouvání.
Většina návštěvnosti místních firem přichází nejdřív z telefonů.
Mobile first design vytváří zážitek pro nejmenší obrazovku dřív než přídavky pro počítač.
Jak přizpůsobení webu mobilům uplatnit na svém webu
Každý týden vyzkoušejte na skutečném telefonu cíle pro klepnutí, velikosti písma a formuláře.
Začněte jednou stránkou, například úvodní nebo hlavní vstupní stránkou. Nejdřív opravte největší problém a stejný vzor pak přenesete na další šablony.
Tuto kapitolu doplňte kapitolou mobile first design jako základem a kapitolou záhlaví webu jako dalším krokem v tomto modulu.
Praktický seznam, který můžete použít hned dnes
Každý týden vyzkoušejte na skutečném telefonu cíle pro klepnutí, velikosti písma a formuláře.
Při kontrole jakékoli stránky se ptejte, zda je přizpůsobení webu mobilům 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 přizpůsobení webu mobilům na vašem webu skutečně pohnulo.
Sdílejte tento seznam s každým, kdo váš web upravuje, aby mobile first design zůstal 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. Mobile first design vytváří zážitek pro nejmenší obrazovku dřív než přídavky pro počítač.
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 záhlaví webu a porovnejte poznatky s příbuznou kapitolou v tomto modulu.
Většina návštěvnosti místních firem přichází nejdřív z telefonů.
Časté otázky, které lidé přehlížejí
Související výrazy jako mobile first design a responzivní design webu vám pomohou najít hlubší příklady a porovnat svou práci s běžnými standardy.
Mobile first design vytváří zážitek pro nejmenší obrazovku dřív než přídavky pro počítač.
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 přizpůsobení webu mobilům 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 kapitoly mobile first design a redesign webu, ať vám modul zůstane v hlavě pohromadě.
Nyní máte k dispozici použitelný pohled na přizpůsobení webu mobilům. Využijte ho při kontrole webu, schvalování marketingových materiálů nebo zadávání práce designérovi. Pokračujte kapitolami redesign webu a záhlaví webu, ať v tomto modulu nepolevíte.
Často kladené otázky
Jak dlouho trvá přizpůsobit web mobilům?
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 přizpůsobení webu mobilům designéra?
Designér pomůže u složitější změny značky, ale mnoho oprav kolem přizpůsobení webu mobilům zvládnete sami, jakmile víte, na co se dívat. Spolu s touto kapitolou využijte kapitolu mobile first design.
Pomůže WEMASY přizpůsobit váš web mobilům?
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 při přizpůsobení webu mobilům?
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 kapitolu redesign webu.
Jak přizpůsobení webu mobilům 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 přizpůsobení webu mobilům?
Pokračujte kapitolami mobile first design a redesign webu v této knize a vybudujte si úplný vizuální systém své značky online.