Hlavní navigace

Že na svém webu nepotřebujete řešit mobilní zařízení? Ale no tak…

Martin Michálek 30. 9. 2014

Více než 12 % přístupů k webovým stránkám v ČR probíhá prostřednictvím mobilních telefonů. Mnoho webů ale stále neumí naplnit požadavky, které na ně mobilní návštěvník má.

Pojďme si na začátek zopakovat pár faktů:

  1. Mobilní zařízení mají dnes v ČR přibližně 12% podíl na celkovém počtu zobrazených stránek. Meziročně se čísla znásobují. Podívejte se na obrázek 1.
  2. I v ČR existují weby s takřka polovičním podílem návštěvnosti z mobilních zařízení.
  3. Weby děláme vždy s vyhlídkou na několik let dopředu a tak – i když vás dnešní 12procentní podíl nedojímá – za dva, tři roky pro vás zřejmě pohled do statistik bude znamenat malé překvapení. 
  4. Podle IDC se na světě v roce 2013 prodalo kolem 300 milionů desktop/laptop počítačů, 230 mil. tabletů a — přes 1 miliardu smartphonů.

Podíl mobilních prohlížečů na celkovém počtu zobrazení: 06/2012: 2,28, 06/2013: 6,56, 06/2014: 11,98

Zdroj: Gemius SA, gemiusTraffic, Rankings.cz.

Je jedno, jestli jste zvolili responzivní řešením nebo extra mobilní web, ale myslíme si, že nějakou strategii, jak se vypořádat s mobilními zařízeními, dnes potřebují všichni.

Jak tedy mobilního návštěvníka nadchnout…

…nebo alespoň nenaštvat? Na co je třeba se soustředit a dobře zvládnout

  • Přizpůsobení rozhraní možnostem mobilního zařízení
  • Zajištění konzistence rozhraní a obsahu
  • Rychlost načítání 
  • Fungování na platformách iOS i Android

Pojďme si teď jednotlivé kroky rozebrat podrobněji.

Rozhraní přizpůsobené mobilním zařízením 

Rozhraní webu, který nekomplikuje používání na mobilních zařízeních, vypadá asi takto:

  1. Nepoužívá návrhové vzory desktopového světa (například karusely – obrázek 2, nebo tzv. megamenu)
  2. Nespoléhá se na ovládání myši (na „mouseovery” nezobrazuje žádné informace)
  3. Má dostatečně velké aktivní plochy (doporučuje se alespoň čtvereční centimetr)
  4. Podporuje možnosti mobilního rozhraní (např. klikací telefonní číslo pro vytočení)
  5. Šetří místem pro navigační elementy (významná část hlavního obsahu je vždy nad zlomem stránky)

Autor: Martin Michálek

Zjednodušeně řečeno — složitější návrhové vzory zažité na desktopu na mobilech nefungují. Všechny aktuálně zažívají restart.

Čím jednodušší a přímočarejší to na mobilech bude, tím lépe pro uživatele, tím lépe pro vás. V ČR jsou v tomto velkou inspirací některé mobilní weby Seznamu, podívejte se na ně:


Autor: Martin Michálek

Konzistence rozhraní a obsahu

Výzkumy ukazují, že uživatelé vaši službu před samotným nákupem vidí ze dvou, tří nebo klidně čtyř zařízení. Proto je důležité zachovat konzistenci značky komunikovanou přes uživatelské rozhraní, interakce nebo obsah či funkčnost samotnou.

Konzistentní web…

  • má co nejpodobnější rozhraní napříč zařízeními, hlavně mezi příbuznými jako je desktop a tablet
  • se výrazně nemění při otočení z prohlížení na výšku do režimu na šířku
  • má hlavní obsah a funkčnost všech stránek totožný na všech zařízení

Autor: Martin Michálek

Loňská verze Bata.cz na tabletu zobrazovala verzi vizuálně bližší smartphonové. Aktuální web je už naopak dobrým příkladem konzistence rozhraní. 

Rychlost načítání na mobilních zařízení

Mobilní sítě jsou pomalé a ani zvyšování přenosové rychlosti na 3G/4G sítích rychlost načítání nevyrovnají s pevným připojením. Testyprůzkumy zároveň ukazují, že rychlost načtení stránky má velký vliv na konverze webu.

Přesto tady vznikají responzivní weby, které se na pomalejších sítích načítají několik minut. Srovnejte jeden pomalý responzivní web s rychlým desktopovým webem ze soutěže WebTop100 2013.


Autor: Martin Michálek

Kdyby to byly dva eshopy ve stejné kategorii a vy je navštívili z mobilu, na kterém nejspíše nakoupíte?

A nejde jen o mobily. Nezapomeňte, že rychlost načítání je jedním z řadících parametrů pro výsledky vyhledávání Google nebo AdWords kampaní. Ovlivňuje tak nejen konverze, ale i pravděpodobnost, že se na web člověk vůbec dostane.

Web dobře funguje na iOS a Android

Zdá se to jako samozřejmost, ale divili byste se, kolik zásadních chyb v zobrazování na těchto dvou nejdůležitějších platformách jsme viděli u webů přihlášených do WebTop100 2013.

Víte co je horší než web, který nemá mobilní nebo responzivní verzi? Web, který se na Androidu nebo iOS ještě ke všemu rozpadne. A tak — testujte své weby na mobilních zařízeních, i když mobilní nebo responzivní verzi teprve plánujete.


Autor: Martin Michálek

Tento materiál vznikl v rámci hodnocení kvality firemních webů v soutěži WebTop100. Autor děkuje porotcům kategorie – Janu Štráfeldovi, Lukáši KokoškoviHonzovi Sládkovi za cenné podněty. Načerpejte inspiraci od odborníků digitálního marketingu – přednášky, případové studie a analýzy. Trendy i osvědčené postupy vám ukáže konference WebTop100: To nejlepší z digitálního marketingu pro váš byznys.

Našli jste v článku chybu?

30. 9. 2014 7:55

shneck (neregistrovaný)

Přesně tak. I na mobilu v drtivé většině případů vyžaduji desktopové zobrazení. Zaprvé jsem na rozložení stránky zvyklej z PC (a nejsem línej stránku zvětšit a zmenšit) a za druhé mnoho stránek do mobilní verze nezahrnuje všechny možnosti desktopového zobrazení (např. videa,rozšířené filtrování dle parametrů apod...) jenom proto, protože si někdo myslel, že je to pro mobil/tablet zbytečné...

Další věc, o které psal pán nademnou, je ta "zobrazit klasicky". To je tak složité udělat cookies nebo t…

30. 9. 2014 7:24

wor (neregistrovaný)

Responzivita je pro me spanelska vesnice a jako uzivatel (ctenar) pristupujici z tabletu i desktopu si myslim ze to nepochopim nikdy. Chapu ze asi neni jednoduche najit vhodne reseni pro vsechny ale nechapu jednu tak trivialni vec, proc ty stranky kdyz uz jsou pro obe verze, tak me smeruji na mobilni verzi ackoliv o to nestojim a jak debil musim hledat tlacitko, ,,zobrazit klasicky" Dalsi vec ktera me dovede k nepricetnosti u nekterych mobilnich verzi je nemoznost tahem dvouma prstama od sebe zv…

120na80.cz: Pánové, pečujte o svoje přirození a prostatu

Pánové, pečujte o svoje přirození a prostatu

120na80.cz: 5 poporodních problémů a jejich řešení

5 poporodních problémů a jejich řešení

Měšec.cz: Kdy vám stát dá na stěhování 50 000 Kč?

Kdy vám stát dá na stěhování 50 000 Kč?

Podnikatel.cz: Přehledná titulka, průvodci, responzivita

Přehledná titulka, průvodci, responzivita

DigiZone.cz: Česká televize mění schéma ČT :D

Česká televize mění schéma ČT :D

120na80.cz: Rovnátka, která nejsou vidět

Rovnátka, která nejsou vidět

Podnikatel.cz: Změny v daních z příjmů u zaměstnávání

Změny v daních z příjmů u zaměstnávání

DigiZone.cz: Digi CZ výrazně zlevnila balíček HBO

Digi CZ výrazně zlevnila balíček HBO

Podnikatel.cz: 3, 2, 1..EET startuje. Na co nezapomenout?

3, 2, 1..EET startuje. Na co nezapomenout?

Podnikatel.cz: Udávání kvůli EET začalo

Udávání kvůli EET začalo

DigiZone.cz: Milan Kruml: procházka TV historií

Milan Kruml: procházka TV historií

Podnikatel.cz: Zavře krám u #EET Malá pokladna a Teeta?

Zavře krám u #EET Malá pokladna a Teeta?

Podnikatel.cz: Na poslední chvíli šokuje vyjímkami v EET

Na poslední chvíli šokuje vyjímkami v EET

Vitalia.cz: Chtějí si léčit kvasinky. Lék je jen v Německu

Chtějí si léčit kvasinky. Lék je jen v Německu

Podnikatel.cz: K EET. Štamgast už peníze na stole nenechá

K EET. Štamgast už peníze na stole nenechá

Vitalia.cz: Pravda o přibírání na zimu

Pravda o přibírání na zimu

Lupa.cz: Babiš: E-shopů se EET možná nebude týkat

Babiš: E-shopů se EET možná nebude týkat

Vitalia.cz: To není kašel! Správná diagnóza zachrání život

To není kašel! Správná diagnóza zachrání život

Vitalia.cz: Tesco: Chudá rodina si koupí levné polské kuře

Tesco: Chudá rodina si koupí levné polské kuře

Lupa.cz: Google měl výpadek, nejel Gmail ani YouTube

Google měl výpadek, nejel Gmail ani YouTube