Rychlost e-shopu: sedm věcí, které zkontrolovat dřív, než zaplatíte další doplněk

Rychlost e-shopu se dá změřit a většinou se dá výrazně zlepšit bez přestavby. Než ale začnete cokoli měnit, potřebujete vědět, kde se čas ztrácí. Tady je postup, který používám při auditu.

Nejdřív změřte

Otevřete si PageSpeed Insights a zadejte adresu úvodní stránky, kategorie a detailu produktu. Každý typ stránky má jiné slabiny. Zaměřte se na reálná data od uživatelů, pokud jsou k dispozici, a laboratorní test berte jako orientační. Skutečná data za celý web najdete také v Google Search Console ve zprávě Core Web Vitals.

Co znamenají Core Web Vitals

• LCP (Largest Contentful Paint): za jak dlouho se zobrazí největší prvek stránky, obvykle hlavní obrázek. Dobrá hodnota je do 2,5 sekundy.
• INP (Interaction to Next Paint): jak rychle stránka reaguje na kliknutí nebo klepnutí. Dobrá hodnota je do 200 milisekund.
• CLS (Cumulative Layout Shift): jak moc obsah „skáče“ při načítání. Dobrá hodnota je do 0,1.

Sedm věcí ke kontrole

1. Velké obrázky

Nejčastější důvod pomalého LCP. Fotky mají mít rozměr odpovídající zobrazení a rozumnou kompresi. Podrobnosti najdete v článku o zmenšování obrázků.

2. Skripty třetích stran

Měřicí kódy, chat, widgety s recenzemi, retargeting. Každý z nich stahuje další soubory a často blokuje vykreslení. Projděte si, které opravdu používáte, a zbytek odstraňte.

3. Doplňky a vlastní kód

Doplněk, který se načítá na každé stránce, ale potřebujete ho jen v košíku, zpomaluje celý web. Dobrý doplněk se načte jen tam, kde je potřeba.

4. Webová písma

Každá řezová varianta písma je další soubor. Používejte maximálně dva až tři řezy a nastavte font-display: swap, aby se text zobrazil hned, i když se písmo ještě stahuje.

5. Skákající rozvržení

Obrázky a bannery bez zadaného rozměru způsobují, že se obsah posune, jakmile se načtou. Vždy uvádějte šířku a výšku nebo poměr stran, ať má prohlížeč místo rezervované předem.

6. Počet požadavků a velikost stránky

Ve vývojářských nástrojích prohlížeče (záložka Síť) uvidíte, co všechno se stahuje. Překvapí vás, kolik souborů tam je, které jste nikdy nechtěli.

7. Mobilní zobrazení

Většina návštěv přichází z telefonů, které mají pomalejší procesor a často horší připojení. Testujte proto vždy mobilní verzi, ne jen počítač.

Kde začít

Postupujte od největšího zisku k nejmenšímu: nejdřív obrázky, potom skripty třetích stran a až nakonec ladění detailů. Po každé změně změřte znovu, ať víte, co skutečně pomohlo.