Z Martinem Michálkem o szybkości sklepów internetowych na Shoptet

Jaki wpływ ma wybór szablonów i dodatków na szybkość strony? Jaka jest optymalna równowaga między atrakcyjnością wizualną a wydajnością e-sklepu? I jak rozpoznać dobrego dostawcę zmian?

W naszej rozmowie Martin dokładnie opisuje najczęstsze błędy, zwraca uwagę na znaczenie jakościowej implementacji zmian graficznych i przybliża przykład udanej optymalizacji e-sklepuDenatura.cz.

Odkryj również, jak monitoring szybkości może zasadniczo wpłynąć na wydajność twojego e-sklepu oraz dlaczego komunikacja przy wyborze partnerów jest ważniejsza niż szczegóły techniczne.

Jeśli chodzi o Shoptet, sam w sobie jest on bardzo dobrze przygotowany pod względem szybkości. Szablony jako takie zazwyczaj nie powodują większych problemów. Jednak tam, gdzie często widzimy problem na PageSpeed.cz, jest wdrażanie bardziej radykalnych zmian w designie. 

Pierwszym problemem jest to, że klienci i projektanci często nie zdają sobie sprawy, że na klasycznym Shoptet koderzy będą musieli przepisywać oryginalny wygląd szablonu dużą ilością JavaScriptu, co samo w sobie jest komplikacją dla wydajności e-sklepu. Myślę, że już na tym etapie operatorzy e-sklepów powinni się zatrzymać i porozmawiać o tym, jaki wybrać oryginalny szablon i jak bardzo zmieniać jego wygląd.

Kolejnym problemem jest sama implementacja tych zmian. Jakość kodowania na Shoptet jest bardzo różnorodna, od wysokiej jakości ludzi po tych, którzy utknęli w 2010 roku i dokonują na szablonach naprawdę poważnych błędów. 

Na pewno warto ocenić ich jakość na podstawie rekomendacji od znajomych, a nie tylko na liczbie gwiazdek w ofercie partnerów Shoptet. My mamy lepsze doświadczenia zawsze z większymi dostawcami takimi jak Mime Digital, Able lub dkLab. 

A co z dodatkami?

One również nie pogarszają automatycznie szybkości.

Podczas ładowania witryny na telefonie komórkowym możliwe jest osiągnięcie czasu ładowania (LCP) poniżej 1 s, co jest już doskonałym wynikiem.

Nie w każdym przypadku szybkość automatycznie się poprawia. Często spotykamy pogorszenie z powodu różnych dodatkowych javascriptów. Jednak zwykłe GTM ani Google Analytics nie mają negatywnego wpływu, ale należy uważać na dodatki personalizacyjne, reklamowe, A/B testowe lub te, które dodają sugerowanie adresów do procesu zakupowego.

Należy jednak powiedzieć, że w PageSpeed.cz współpracujemy z wieloma e-sklepami korzystającymi z Shoptet i pomimo ograniczeń platformy, dotychczas poradziliśmy sobie z prawie wszystkim. Zielone Core Web Vitals potrafimy nawet na Shoptet.

Jeśli mogę polecić jedną zasadniczą rzecz, którą wszyscy właściciele e-sklepów w kontekście szybkości powinni zrobić, to monitoring szybkości strony. Powiem o tym więcej później.

Optymalizowaliśmy szybkość dla około 10-15 stron na Shoptet. Obecnie przygotowujemy studium przypadku dla strony Denatura.cz.

Na Denaturze najpierw zoptymalizowaliśmy metryki stabilności układu (CLS) i szybkości ładowania (LCP), obie z sukcesem. 

W momencie, gdy Google wprowadził nową metrykę INP do pomiaru szybkości interakcji, zaczęliśmy jej optymalizację. Odnotowaliśmy częściowe sukcesy w optymalizacji JavaScriptu bezpośrednio na stronie Denatury, ale z czasem doszliśmy do wniosku, że musimy współpracować bezpośrednio z Shoptet.

Nasza współpraca z deweloperami Shoptet doprowadziła do poprawy INP dla wszystkich e-sklepów, wprowadzenia większości z nich do zielonej skali ocen Core Web Vitals oraz prawdopodobnie także lepszych pozycji w kontekście SEO.

Mam nadzieję, że będziemy kontynuować tę współpracę, ponieważ wpływ optymalizacji szybkości na 40 tysięcy e-sklepów jest ogromny, a misją PageSpeed.cz jest przyspieszenie stron dla wszystkich. Na Denaturze na razie nie mamy liczb, ale myślę, że optymalizacja szybkości przyczyniła się do ich dużego wzrostu rok do roku. Myślę, że wszystkie trzy strony mogą być zadowolone.

Jak już napisałem wcześniej. Wybierałbym większe studia, unikając tanich freelancerkoderów. Może cię to zaskoczyć, ale nie jest konieczne koncentrowanie się na wiedzy technicznej danej osoby lub firmy.

Podstawą jest komunikacja. Bardzo często zdarza się, że optymalizacja nie przebiega według oczekiwań, właśnie z powodu braku komunikacji ze strony deweloperów.

Wybieraj ludzi, którzy są komunikatywni, otwarci i proaktywni. Można to zauważyć już na wczesnym etapie rozwoju.

Jako właściciel e-sklepu na Shoptet powinieneś zawsze dążyć do zielonych wartości metryk Core Web Vitals na poziomie całej domeny. Zielony to znak, że wszystko jest przynajmniej podstawowo w porządku.

Kolejnym celem jest następnie zobaczenie w Google Search Console zielonych wartości we wszystkich grupach URL. Te dwa źródła trzeba połączyć.

Na poniższym obrazku widać, jakie wartości są uznawane za optymalne dla poszczególnych metryk.

Jakie wartości osiągają strony na Shoptet? W naszym monitoringu śledzimy niektóre z nich i wygląda to następująco:

Co właściciel e-sklepu może zrobić sam w celu poprawy szybkości, nawet bez wiedzy technicznej? Jakie są pierwsze kroki do optymalizacji?

Jest tego zaskakująco dużo, często na poziomie "miękkiej" wiedzy.

Odpowiem od razu checklistą:

1. Mierzenie szybkości stron. Jednorazowe testy za pomocą PageSpeed Insights nie są tak dobre, dlatego wprowadziliśmy monitoring PLUS, który monitoruje wartości metryk od Google, ale także każdego dnia odpala syntyczne testy twoich ważnych stron. Obowiązuje zasada, że nawet niewielka zmiana, jak dodanie dodatku, może zepsuć szybkość, dlatego monitoring jest kluczowy. Monitoring służy także do kontroli koderów i innych dostawców.
2. Wybieraj dobrego dostawcę zmian na stronie. Szukaj wiarygodnych, dobrze komunikujących się partnerów z dobrze rekomendowanymi referencjami. Patrz wcześniejsze odpowiedzi. Ale i tak kontroluj jego pracę za pomocą monitoringu.
3. Rozważ każdą implementację nowej komponenty javascriptowej. Znów patrz wyżej. Nie jest źle wdrażać na stronę cokolwiek nowego, ale upewnij się, że mierzysz i dowiesz się, gdy nowa komponenta psuje jakąś z metryk szybkości.
4. Pozostawaj w kontakcie z obsługą Shoptet. Poproś ich o uruchomienie zapisu obrazów do formatu WebP, który jest znacznie bardziej efektywny pod względem danych.

Jeśli szybkość się nie poprawia, zatrudnij fachowców.

W PageSpeed.cz możemy dostarczyć wyniki już kilka godzin doradztwa.