Rok 2024: Mobilní návštěvnost českých e-shopů dosahuje 65 % – Čas na nové rychlé šablony
23. 10. 2024 | Ing. Tomáš Hojgr, MBA | majitel
- Od roku 1990 do přibližně 2007 byla většina internetové návštěvnosti ze stolních počítačů, protože mobilní internet prakticky neexistoval.
- Po roce 2007, kdy byly uvedeny chytré telefony (např. iPhone), začal podíl mobilů růst.
- Od roku 2010 rostl trh s tablety, ale jejich podíl na celkové návštěvnosti byl vždy menší než u mobilů a počítačů.
- V posledních letech (2020-2024) mobilní zařízení přebírají vedoucí roli a tvoří většinu návštěvnosti.
V roce 2024 je 60-65% návštěvnosti českých eshopů z mobilních telefonů. Jen 30-35% ze stolních počítačů. A zbytek připadá na tablety, tedy formu mobilní návštěvnosti. Celkem s tablety tedy tvoří mobilní návštěvnost 70-75%.
Proč je přesun od stolní k mobilní návštěvnosti pro české eshopy klíčový?
Přestože většina eshopů má mobilní verzi vyladěnou, tak je většinou tvořena jako úpravy verze stolní. Došlo k tomu aktualizací původních šablon. Vypadá to hezky, je fo funkční.
Jenže protože ty šablony jsou původně navrženy pro stolní počítače, tak se nejprve načítá všechno co potřebuje stolní počítač. A až potom následuje přeformátování pro mobil. Mobil ale zdaleka nepotřebuje tolik zdrojů k načítání grafiky. A tak je většina těch zdrojů načítaná zbytečně.
A právě vykreslování grafiky je na dnešních eshopech, plných javascriptu, ajaxu, responzivity, přístupnosti, to časově nejnáročnější. A proto se vyplatí s těmito operacemi šetřit.
V roce 2024 je trend návrhu šablon "mobile first"
Rychlost načítání webu je klíčová. Jak by to mělo být?
| Označení | Ideální doba načtení | Co se načítá |
|---|---|---|
| TTFB - Time to first byte | 200 - 500 ms | Čas na reakci serveru, než na požadavek odpoví prvními daty |
| Načtení HTML | neuvádí se | Tato metrika přestala být se složitostí grafik dnešních webů měřena a měří se nadřazenejší celky, viz níže. Ale čím rychleji se načte, tím dříve se začnou stahovat a vykreslovat ostatní zdroje. |
| FCP - First Contentful Paint | < 1,8s | Jak rychle se na obrazovce objeví první kus viditelného obsahu |
| LCP - Largest Contentful Paint | < 2,5s | Jak rychle se načte největší viditelný prvek na stránce, např. hlavní obrázek, odstavec textu. |
| TTI - Time to Interactive | < 3,8s | Kdy se stránka stane plně interaktivní. Lze kliknout na tlačítka, vyplnit pole, atp. |
| CLS - Cumulative Layout Shift | < 0,1s | Tato metrika sleduje stabilitu obsahu během načítání. Čím nižší hodnota, tím méně se prvky na stránce posouvají při načítání. Toto je jedna z nejvíce problémových metrik na šablonách, které byly původně navrženy pro stolní počítač. |
| Celkem | až 9s | 9 sekund je stále považováno za přijatelné. Ale vám osobně, chce se čekat na každou stránku 10s? Jde to výrazně rychleji. |
A pokud se na více než dvou třetinách návštěv web nejdřív načte pro počítač, a pak se osekává pro mobil, jednak se zbytečně načítaly nepotřebné zdroje. Jednak se ty nepotřebné zdroje zbytečně vykreslovaly. A jednak se pak zbytečně překreslují do podoby pro mobil.
Proto je nezbytné mít v roce 2024 šablony navržené mobile first.
Co to pro většinu eshopů znamená?
Nechat si eshop, který už existuje. Ten je vyladěný, obsahuje data, obsluha je na něj zvyklá, vyhledávače znají strukturu jeho obsahu a URL adres. A není důvod jej měnit.
Je ale potřeba nechat vyrobit novou "košilku". Kabát, obličej, prostě šablonu. Novou vizuální podobu. Může vypadat stejně, nebo velmi podobně, jako dosud. Ale místo plného vykreslení např. za 10s bude schopen být plně vykreslen už za 3 sekundy.
Přínosy nových rychlých šablon
Mobile first šablony znamenají rychlost, a tím
- zvýšení konverzního poměru a
- zlepšení pozic ve vyhledávačích.
Hlavně Google si weby osahává a kontroluje jejich kvalitu pro stolní počítač, ale hlavně pro mobilní zařízení. Krom zpětných odkazů, obsahu, klikanosti, doby návštěvníků na stránce atp. je pro něj klíčový právě uživatelský prožitek a ten interně měří nástroji jako lighthouse.
Dalším obrovským přínosem je zvýšení konverzního poměru. Zákazník toho stihne více, je méně frustrován načítáním, tak jich větší procento nákup dokončí.
Můžeme-li vám s šablonou pomoci, neváhejte nás kontaktovat.
