Realita mobilního návštěvníka
Když klient poprvé narazí na tvé portfolio, zřejmě ho vidí na mobilu. Není to politika ani snílek — je to prostě fakt. Lidi si prohlížejí pracovní portfolia během přestávky v kanceláři, v metru nebo doma na gauči. Počítač není jejich první volba.
To znamená jednu věc: pokud tvůj web není pořádně vytvořený pro mobil, jejich první dojem je špatný. Malý text, které se nedá přečíst. Fotky, které se roztahují přes celou obrazovku. Tlačítka, která nejdou kliknout. Zkrátka chaos.
Proč není responsivní design optional
Víme, že to znít jako klišé, ale je to pravda. Responsivní design není přidaná hodnota — je to základní funkce. Stejně jako to, že se auto musí jet.
Když klient přijde na tvůj web a on se rozbije na jeho telefonu, nebudou si myslet: „Ó, je to pěkné na počítači.” Prostě odejdou. Není čas hledat si obsah v malinkatém písmu nebo otáčet telefon do všech směrů.
Klíčový fakt
Více než 50 procent lidí opustí web, který se nezačne načítat během 3 sekund na mobilu. A když se web špatně zobrazuje? Ten čas je ještě kratší.
Co znamená „připravený na mobil”
Není to jenom o tom, aby se web smrskl na šířku obrazovky. To dělá sám prohlížeč. Jde o to, aby web na mobilu opravdu fungoval.
- Text musí být čitelný bez zvětšování
- Tlačítka musí být dost velká na to, aby se dala pocitově kliknout
- Obrázky se musí načíst rychle
- Navigace musí být intuitivní
Praktické tipy, které hned zavedeme
Nemusíš dělat revoluci. Stačí pár změn, a tvůj web bude fungovat na mobilu správně.
Měň přístup k obrazům
Velké fotky vypadají krásně na počítači. Na mobilu jsou jen zatížení. Použij menší rozlišení pro telefony. Prohlížeč si sám stáhne správnou verzi podle zařízení. Věř mi, výsledek bude čitelnější a web se bude načítat rychleji.
Zvětši písmo
Text, který vypadá normálně na počítači (14-16 pixelů), je na mobilu příliš malý. Zvyš ho minimálně na 16 pixelů. Bude se lépe číst a lidi nebudou muset zvětšovat. Je to malá věc, ale udělá obrovský rozdíl.
Zjednoduš navigaci
Nabídka se všemi 12 položkami v horní části je na mobilu věc z hororu. Použi hamburgerové menu nebo je organizuj do skupin. Lidi chcou vidět obsah hned, ne procházet se skrz tunu odkazů.
Testuj na skutečném zařízení
Simulátor v prohlížeči je užitečný, ale není to totéž. Vezmi si svůj mobil a testuj opravdu. Jak se to cítí v ruce? Dá se to používat jednou rukou? Jsou tlačítka dostatečně velká? To všechno se dozvíš jenom když to zkusíš živě.
Měření výkonu na mobilu
Když bereš mobilní design vážně, musíš ho i měřit. Není stačí hádat. Google nabízí bezplatný nástroj zvaný PageSpeed Insights. Tam se dozvíš, jak rychlý je tvůj web na mobilu a co konkrétně zpomaluje.
Není to věda. Stačí jít na PageSpeed Insights, zadat URL svého webu a čekat. Dostaneš skóre od 0 do 100. Všechno nad 70 je pěkné. A získáš seznam konkrétních věcí, které můžeš zlepšit.
Běžné chyby, které by sis měl odpustit
Když se díváš na své portfolio na mobilu a vidíš, že tam něco není pořádně, nejsi sám. Těchto chyb dělá spousta lidí. Hlavní věc je, že teď víš, co hledat.
Chyba číslo 1: Fixní šířka
Když máš web nastavený na fixní šířku (třeba 960 pixelů), na mobilu se to nikdy nezmění. Takže lidi musí posouvat vlevo-vpravo. To je strašné. Použij procenta nebo relativní jednotky místo fixních pixelů.
Chyba číslo 2: Příliš mnoho obsahu
Když dáš všechno na domovskou stránku, na mobilu to bude dlouhé na nekonečno. Lidi si musí projít půl webu, aby se dostali k tomu, co chtějí. Zkrátka to. Nech jen nejdůležitější věci vidět hned.
Upozornění
Mobilní design není jednorázová věc. Technologie se mění, nová zařízení se objevují, návyky lidí se vyvíjejí. To znamená, že se musíš na svůj web koukat pravidelně a aktualizovat ho. Nastavit to jednou a pak zapomenout není strategie. Testuj minimálně jednou za tři měsíce, ideálně měsíčně. Rychle se pozměníš, co funguje a co ne.
Závěr: Začni dnes
Mobilní design není něco, co by sis mohl dovolit ignorovat. Je to základ. Bez něho tvé portfolio selhává hned na prvním kroku. Ale dobra zpráva? Když to vyřešíš správně, všechno ostatní je jednodušší.
Vezmi si telefon. Otevři své portfolio. Podívej se, jak to vypadá. Pokud není čitelné, není snadné na navigaci, nebo se to dlouho načítá — máš práci. Ale teď víš, kde začít a co dělat. A to je víc, než vědělo mnoho lidí včera.
