Mobilní provoz roste, ale výsledky často ne

Mobilní zařízení dnes tvoří u většiny webů hlavní vstupní bránu. Podle dlouhodobých dat z analytických nástrojů bývá mobilní návštěvnost v e-commerce i službách často mezi 55 až 75 procenty všech sessions. Přesto mnoho firem vidí na mobilu nižší konverzní poměr než na desktopu, někdy i o desítky procent. Důvod není jediný: uživatel na telefonu má méně času, menší obrazovku, horší toleranci k pomalému načítání a méně trpělivosti pro složité rozhraní.

Jde o praktický problém s přímým dopadem na tržby. Pokud web přivede stejný počet návštěv, ale mobilní konverze je o 30 % nižší, ztráta se násobí v každém kroku funnelu. Z pohledu SEO je navíc mobilní použitelnost nepřímý faktor kvality: Google pracuje primárně s mobile-first indexací a signály jako Core Web Vitals nebo míra okamžitého opuštění často odhalí, že web není pro prsty navržen dostatečně dobře.

První problém: rychlost, která na mobilu bolí víc než na desktopu

Na mobilu rozhodují sekundy. Ideální LCP by měl být do 2,5 sekundy, INP pod 200 ms a CLS pod 0,1. V praxi ale mnoho mobilních webů naráží na těžké hero bannery, přetížené skripty, velké obrázky a špatně optimalizované fonty. Na pomalejším LTE připojení pak stránka působí „mrtvě“, i když se na desktopu načte přijatelně.

Typický příklad: produktová stránka e-shopu má na desktopu 1,9 s LCP, ale na mobilu 4,8 s. Důvodem bývá velký obrázek v nekomprimovaném formátu, několik reklamních a analytických skriptů navíc a render-blocking CSS. Výsledek? Uživatel stránku opustí dřív, než se zobrazí cena nebo tlačítko „Koupit“.

  • Komprimujte obrázky do moderních formátů WebP nebo AVIF.
  • Odloženě načítejte skripty, které nejsou nutné pro první obrazovku.
  • Minimalizujte fonty a používejte font-display: swap.
  • Měřte reálný výkon přes Chrome DevTools, Lighthouse, PageSpeed Insights a CrUX.

U mobilu se vyplatí sledovat i rozdíl mezi lab daty a field daty. Lighthouse může ukázat slušné skóre, ale reální uživatelé na slabších telefonech a sítích zažívají zcela jiný web. Proto je důležité pracovat s daty z Google Search Console, GA4 a případně s RUM nástroji typu SpeedCurve nebo New Relic.

Dotyk není myš: malé prvky a špatná ergonomie ničí konverze

Další častý důvod ztrát je samotné ovládání. Na mobilu není problém jen v tom, že je vše menší. Problém je, že prst není přesný nástroj. Pokud má tlačítko, checkbox nebo odkaz příliš malou aktivní plochu, uživatel klikne vedle nebo několikrát po sobě. To zvyšuje frustraci a snižuje ochotu pokračovat v nákupu či odeslání formuláře.

Google doporučuje dostatečnou velikost dotykových prvků a rozestupy mezi nimi. V praxi by interaktivní prvky měly mít minimálně kolem 48 × 48 CSS pixelů nebo odpovídající touch target. Častou chybou jsou například hustě naskládané filtry v kategorii, drobný odkaz na „přidat do košíku“ nebo hamburger menu, které se rozbalí až po několika neúspěšných pokusech.

Reálný dopad je snadno měřitelný. V GA4 nebo v nástrojích jako Hotjar, Microsoft Clarity či Smartlook lze vidět rage clicks, opakované tapy a místa, kde uživatelé váhají. Pokud je například 18 % mobilních návštěv na produktové stránce doprovázeno opakovaným klikáním do okolí tlačítka, jde o jasný signál, že UI není dostatečně přesné.

  • Zvětšete CTA tlačítka a oddělte je od okolních prvků.
  • Zkraťte navigaci na mobilu na nejdůležitější kategorie a akce.
  • Otestujte stránku jednou rukou na menším telefonu, ne jen na novém iPhonu.
  • Používejte dostatečný kontrast a jasnou vizuální hierarchii.

Formuláře a checkout: místo posledního kroku přichází únik

Nejvíc zákazníků se ztrácí ve chvíli, kdy už mají zájem. Mobilní formulář často vyžaduje příliš mnoho polí, špatný typ klávesnice, nejasné chybové hlášky nebo složité přepínání mezi obrazovkami. V e-commerce bývá kritické pole pro e-mail, telefon, adresu a doručení. Ve službách zase kontaktní formulář, rezervace nebo poptávka.

Data z praxe ukazují, že zkrácení formuláře z 8 polí na 4 může zvýšit dokončení o desítky procent, zejména na mobilu. Ne vždy je nutné všechno sbírat hned. Pokud lze část údajů doplnit později, je lepší snížit tření v první fázi. U checkoutu pomáhá také možnost nákupu bez registrace, automatické doplňování adres, správné autocomplete atributy a viditelná průběžná indikace kroků.

Na mobilu rozhoduje i technický detail: typ klávesnice. E-mailové pole má vyvolat e-mailovou klávesnici, telefon numerickou, PSČ a čísla rovněž odpovídající layout. Pokud vývojář nechá všechna pole jako obyčejný text, uživatel ztrácí čas a roste chybovost. Stejně důležité jsou jasné validační hlášky přímo u pole, ne až po odeslání celého formuláře.

  • Omezte počet polí na minimum nutné pro dokončení.
  • Používejte autocomplete, inputmode a správné typy polí.
  • Chyby zobrazujte okamžitě a srozumitelně.
  • Testujte checkout na slabším telefonu a pomalé síti.

Obsah, který neodpovídá mobilnímu záměru

Ne všechno je problém designu. Část ztrát vzniká proto, že web neodpovídá tomu, co uživatel na mobilu skutečně chce. Mobilní vyhledávání bývá často situační: „otevírací doba“, „cena“, „nejbližší pobočka“, „rychlé srovnání“, „kdy dorazí objednávka“. Pokud stránka začne dlouhým úvodem, marketingovým textem a až dole se objeví odpověď, uživatel odchází.

To se týká i SEO. Mobilní výsledky vyhledávání jsou zobrazeny na menší ploše a uživatel rychleji vybírá. Pokud titulek a meta description neslibují konkrétní odpověď, CTR klesá. Pokud landing page neodpovídá záměru dotazu, roste pogo-sticking: uživatel se vrátí zpět do výsledků a zkusí jiný výsledek.

Prakticky funguje struktura „odpověď hned nahoře“. U služeb to znamená cenu, dostupnost, lokalitu nebo kontakt v první viditelné části. U e-shopu konkrétní variantu, dopravu, skladovost a CTA bez nutnosti scrollování. U obsahových webů zase stručný souhrn, tabulku, seznam nebo FAQ, které řeší dotaz do 10 sekund.

  • Začněte nejdůležitější informací, ne marketingovým úvodem.
  • Přizpůsobte landing page konkrétnímu dotazu z vyhledávání.
  • Využívejte FAQ, tabulky a stručné bloky pro rychlé skenování.
  • Kontrolujte CTR a engagement podle zařízení v GA4 a Search Console.

Jak poznat, kde web mobilně ztrácí, a co měřit jako první

Bez dat se mobilní optimalizace dělá naslepo. Základní postup je jednoduchý: porovnat mobilní a desktopové metriky v GA4, projít Search Console po stránkách a dotazech, a doplnit to o heatmapy nebo session recordings. Všímejte si hlavně rozdílů v míře zapojení, scroll depth, míře opuštění formuláře a kroků checkoutu. Pokud je mobilní bounce rate výrazně vyšší než desktopová, problém bývá v rychlosti, rozvržení nebo nejasné nabídce.

V technické diagnostice se zaměřte na tyto body:

  • LCP: co je největší prvek nad přehybem a kdy se skutečně zobrazí.
  • INP: jak rychle web reaguje na tapnutí, otevření menu nebo filtrování.
  • CLS: zda se tlačítka a text neposouvají při načítání reklam, bannerů nebo cookie lišt.
  • Touch targety: velikost a rozestupy mezi klikacími prvky.
  • Form interactions: kde uživatelé padají z formuláře nebo checkoutu.

Pokud web běží na WordPressu, pomohou nástroje jako Query Monitor, WP Rocket, Perfmatters nebo Asset CleanUp. U vlastního frontendu v Next.js nebo jiném moderním stacku je nutné hlídat hydrataci, přetížení JavaScriptem a zbytečné klientské komponenty. V obou případech platí stejné pravidlo: mobilní web musí být rychlý, čitelný a ovladatelný jedním prstem bez přemýšlení.

Největší ztráty většinou nevznikají na jedné velké chybě, ale v součtu drobných bariér. O něco pomalejší načtení, trochu menší tlačítko, o dvě pole delší formulář, nejasná landing page a nepřesný dotyk stačí k tomu, aby zákazník odešel jinam. Mobilní optimalizace proto není kosmetická úprava. Je to přímý zásah do toho, kolik návštěv se promění v objednávku, poptávku nebo kontakt.