Srovname.cz: o 25 % více konverzí na mobilech díky zrychlení
Srovname.cz je český cenový srovnávač, který pomáhá uživatelům najít nejvýhodnější nabídky napříč e-shopy.
Mobilní web Srovname.cz jsme v roce 2016 zrychlili tak, že se konverzní poměr na mobilech zvedl o čtvrtinu. To nejsou jen čísla v reportech, ale skutečné peníze na účtu.
Rychlost webu přímo ovlivňuje příjmy firmy. Není to jen technická vychytávka, ale obchodní nutnost. Rychlejší web vám přinese vyšší konverze, levnější PPC, vyšší šance v SEO a spokojenější návštěvníky.
Konkrétní úpravy: chirurgické zásahy místo revoluce
Srovname.cz jsme rozebrali na součástky a zaměřili se na nízko visící ovoce. Například to následující:
- Štíhlejší CSS: méně souborů, vyšší rychlost
Spojili jsme všechny styly do jednoho souboru a zmenšili ho. Kritické CSS (styly potřebné pro zobrazení první obrazovky) jsme vložili přímo do HTML kódu stránky. - Paralelní zpracování díky asynchronnímu JavaScriptu
Problém byl, že se veškerý JavaScript načítal postupně a blokoval zobrazení obsahu. Změnili jsme to na asynchronní načítání, takže se důležitý obsah zobrazí hned a méně důležité skripty se načtou na pozadí. Uživatel vidí stránku okamžitě, interaktivní prvky se doladí později. - SVG grafika: Vektorové ikony místo pixelových obrázků
Hlavní ikony a komponenty jsme převedli na SVG a vložili přímo do HTML kódu. Prohlížeč tak nemusel stahovat desítky malých obrázků zvlášť.
Spolupráce s týmem Srovname.cz byla perfektní. Úpravy probíhaly hladce a v reálném čase.
Měřitelné výsledky: stránky rychlejší až o 80 %
Optimalizace bez měření je jen střelba naslepo. Pro měření jsme tehdy používali hlavně WebPageTest.org a metriku Speed Index.
Speed Index (SI) měří, jak rychle se obsah stránky postupně zobrazoval uživateli. Čím nižší číslo, tím rychlejší načítání. Tato metrika byla důležitá v roce 2016, dnes už je zastaralá – místo ní používáme modernější indikátory rychlosti načtení jako je Largest Contentful Paint (LCP).
Jak dopadly optimalizace Srovname.cz?
| Stránka | Speed Index před | Speed Index po | Zlepšení |
|---|---|---|---|
| Úvodní stránka | 6 664 ms | 1 340 ms | 80 % rychleji |
| Seznam produktů | 3 654 ms | 2 275 ms | 38 % rychleji |
| Detail produktu | 4 001 ms | 1 506 ms | 62 % rychleji |
Obsah se na mobilu začal zobrazovat pod 1,5 vteřiny místo původních šesti sekund. To je rozdíl, který uživatel pozná na první pohled.
Syntetické metriky tedy ukázaly dramatické zlepšení. Ale co na to řekli uživatelé?
Konverze: kde se ukáže skutečná hodnota
Konverzní poměr na webu Srovname.cz ukazuje, kolik lidí ze srovnávače proklikne na detail e-shopu. Jak se po optimalizaci změnil?
L7iT1J