Alquis przeprojektował stronę B2B Hartpak, wdrożył ją w Astro i uruchomił dystrybucję przez Cloudflare. Nowy serwis uporządkował szeroką ofertę, skrócił drogę do kontaktu i według Hartpak podwoił liczbę leadów ze strony w pierwszych dwóch tygodniach po uruchomieniu.
Redesign strony oparty na intencji kupującego
Hartpak działa w segmencie, w którym szerokość asortymentu jest jednocześnie atutem i wyzwaniem. Firma dostarcza opakowania, chemię profesjonalną oraz artykuły higieniczne restauracjom, pizzeriom, firmom cateringowym, hotelom, biurom i instytucjom w Polsce. Ta różnorodność ma wysoką wartość, gdy kupujący rozumie zakres oferty. Na stronie internetowej szerokość bez struktury zamienia się jednak w szum.
Poprzedni serwis odzwierciedlał logikę katalogu, a nie logikę decyzji zakupowej. Właściciel restauracji szukający pojemników na wynos i osoba odpowiedzialna za zaopatrzenie hotelu w produkty higieniczne trafiali do oferty podobnymi ścieżkami. Brakowało wskazówek, która kategoria pasuje do konkretnego typu działalności. Odwiedzający musieli najpierw zinterpretować katalog, a dopiero później mogli ocenić, czy Hartpak odpowiada na ich potrzeby.
To tarcie miało bezpośredni skutek biznesowy. Stronę, która wymaga wysiłku podczas nawigacji, trudno też polecić z przekonaniem. Gdy zespół Hartpak odsyłał potencjalnego klienta do serwisu, oferta często wymagała wcześniejszego objaśnienia, ponieważ witryna nie wykonywała tej pracy samodzielnie. Problem nie był kosmetyczny, lecz strukturalny. Jego rozwiązanie wymagało połączenia designu, architektury treści, developmentu frontendowego i hostingu w jeden system.
Od logiki katalogu do czytelnych ścieżek zakupowych
Pracę rozpoczęliśmy od audytu architektury informacji z perspektywy sposobu myślenia kupującego. Najważniejsze pytanie było praktyczne: czy klient szuka według formatu produktu, zastosowania, czy typu firmy, w której będzie go używać? Odpowiedź wyznaczyła nową hierarchię stron jeszcze przed rozpoczęciem projektu wizualnego.
Przebudowana strona główna od razu określa pozycję Hartpak: opakowania dla gastronomii dostarczane bez chaosu. Następnie pokazuje najczęściej zamawiane grupy produktów i prowadzi bezpośrednio do pełnego katalogu, opakowań dla gastronomii, chemii profesjonalnej, artykułów higienicznych oraz kartonów do pizzy z indywidualnym nadrukiem. Osobne ścieżki dla pizzerii, restauracji i cateringu, a także hoteli, biur i instytucji stanowią drugi sposób wejścia do tej samej oferty. Kupujący może zacząć od konkretnej potrzeby albo od kontekstu, w którym wykorzysta produkt.
Taka podwójna struktura upraszcza odbiór szerokiego asortymentu bez spłycania informacji. Strony kategorii najpierw tłumaczą przeznaczenie danej grupy, a następnie prezentują należące do niej produkty. Wyszukiwarka wspiera osoby, które znają już nazwę lub frazę. Przewidywalna nawigacja pomaga użytkownikom, którzy dopiero porównują opcje. Informacje o dostawie, nadrukach i kontakcie są widoczne jako elementy decyzji zakupowej, nie ukryte jako drugorzędne dane o firmie.
W ten sam strukturalny sposób potraktowaliśmy wiarygodność. Dane rejestrowe Hartpak, adres, kanały kontaktu, obszar dostaw i znajomość branży są jasno przedstawione. Opisowe teksty alternatywne obrazów oraz semantyczna hierarchia nagłówków poprawiają dostępność i pomagają systemom wyszukiwania interpretować treść. Dane strukturalne identyfikują organizację, witrynę i poszczególne strony, dzięki czemu warstwa techniczna wzmacnia zaufanie budowane przez design i copywriting.
Dlaczego wdrożyliśmy stronę Hartpak w Astro
Astro odpowiadało potrzebom Hartpak, ponieważ jest to serwis oparty na treści i katalogu, w którym kluczowe informacje muszą ładować się szybko i pozostawać łatwe do indeksowania. Architektura zorientowana na renderowanie po stronie serwera generuje HTML dla przeglądarki, a JavaScript dodaje tylko tam, gdzie wymaga go konkretna interakcja. Kategorie produktów, strony branżowe, dane firmy i ścieżki kontaktu są więc dostępne bez pobierania przez każdego użytkownika rozbudowanej aplikacji.
Pierwszą korzyścią jest wydajność. Mniejsza ilość JavaScriptu oznacza mniej pracy dla urządzeń mobilnych, a wcześniej wygenerowane strony i zoptymalizowane zasoby skracają czas od żądania do użytecznej treści. Serwis nadal obsługuje potrzebne interakcje, między innymi wyszukiwanie, ustawienia zgód, zakładki i slidery. Główna ścieżka zakupowa nie zależy jednak od ciężkiej aplikacji w przeglądarce. Ma to znaczenie dla potencjalnych klientów korzystających z sieci mobilnych, gdzie każde zbędne żądanie opóźnia zrozumienie oferty.
Drugą korzyścią jest bezpieczeństwo. Żaden framework nie zabezpiecza strony automatycznie, ale Astro pozwoliło utrzymać większość publicznego serwisu w formie statycznej i zrezygnować z klasycznego CMS opartego na bazie danych podczas każdego wyświetlenia. Oznacza to mniej usług działających w czasie rzeczywistym, wtyczek i publicznych punktów dostępu, które wymagają stałej ochrony. Mniejszy pakiet ogranicza też zbędne wykonywanie kodu po stronie użytkownika. Bezpieczeństwo pozostaje wielowarstwowym zadaniem obejmującym kontrolę zależności, HTTPS, bezpieczne nagłówki i warstwę Cloudflare.
Trzecią korzyścią jest skalowalność. Hartpak może dodawać grupy produktów, strony branżowe i treści wspierające za pomocą powtarzalnych komponentów, bez projektowania serwisu od nowa przy każdej zmianie katalogu. Ponieważ strony mogą powstawać przed ich dostarczeniem, wzrost ruchu nie generuje takiego samego obciążenia renderowaniem przy każdej wizycie jak w rozwiązaniu zależnym od bazy danych. Architektura skaluje się redakcyjnie wraz z ofertą i operacyjnie wraz z liczbą odwiedzających.
Jak Cloudflare wzmacnia wydajność, bezpieczeństwo i skalę
Gotową stronę Hartpak udostępniamy przez globalną sieć Cloudflare. CDN może przechowywać często pobierane zasoby bliżej odwiedzających, co skraca drogę treści i zmniejsza obciążenie hostingu źródłowego. W przypadku katalogu z dużą liczbą zdjęć przekłada się to na bardziej stabilne doświadczenie, a platforma hostingowa zachowuje większy zapas podczas skoków ruchu.
Cloudflare działa również jako reverse proxy przed serwerem źródłowym. Żądania przechodzą przez jego sieć, zanim dotrą do hosta, dzięki czemu publiczna warstwa dostępu jest oddzielona od właściwej infrastruktury. Zapewnia to standardową ochronę przed rozproszonymi atakami odmowy usługi. HTTPS i Strict Transport Security zabezpieczają połączenie, a caching oraz nowoczesne protokoły HTTP zwiększają niezawodność. Nie zastępuje to bezpiecznego developmentu, lecz daje wdrożeniu Astro mocniejszą warstwę sieciową.
Znaczenie ma połączenie obu technologii. Astro zmniejsza ilość pracy potrzebnej do dostarczenia każdej strony, a Cloudflare skutecznie ją rozprasza. Statyczny HTML i wersjonowane zasoby dobrze nadają się do dystrybucji na brzegu sieci. Serwis może obsłużyć wzrost ruchu bez zamiany każdego dodatkowego odwiedzającego w nowe obciążenie aplikacji. Aktualizacje nadal można publikować szybko, ponieważ nowe pliki zastępują zapisane wersje w kontrolowanym procesie wdrożenia.
Efekt: dwa razy więcej leadów ze strony w dwa tygodnie
Pierwszy sygnał biznesowy pojawił się szybko. Hartpak odnotował dwukrotny wzrost liczby leadów ze strony w pierwszych dwóch tygodniach po uruchomieniu. Przedstawiamy ten wskaźnik jako zaobserwowany wynik z bezpośredniego okresu po publikacji, a nie jako prognozę ani uniwersalny benchmark dla każdego redesignu.
Efekt jest spójny ze zmianami w całej ścieżce zakupowej. Odwiedzający wcześniej rozpoznają ofertę, podejmują mniej decyzji przed dotarciem do właściwej kategorii i mogą skontaktować się z Hartpak bez utraty kontekstu oglądanej strony. Użytkownicy z wyszukiwarki trafiają na podstrony, które tłumaczą produkt i jego zastosowanie. Potencjalni klienci z polecenia nie potrzebują już tak rozbudowanego wprowadzenia przed otwarciem serwisu.
Redesign tworzy również mocniejszą cyfrową podstawę utrzymania klientów. Powracający kupujący mogą odnaleźć znane kategorie, wyszukać produkty i sprawdzić informacje o dostawie lub kontakcie bez ponownej nauki interfejsu. Ta spójność zwiększa użyteczność strony po pierwszym zapytaniu. Czytelna struktura branżowa daje też Hartpak stabilną bazę do publikacji kolejnych produktów i usług.
Wewnątrz firmy rozmowa sprzedażowa może zaczynać się na wyższym poziomie. Mniej czasu zajmuje tłumaczenie struktury katalogu, a więcej pozostaje na ilości, warunki dostawy, indywidualne nadruki i konkretne potrzeby zakupowe. Strona wykonuje dziś pracę związaną z pozycjonowaniem oferty, nie tylko jej wyliczaniem, i robi to podczas każdej wizyty.
Zobacz gotową stronę Hartpak
Odwiedź hartpak.pl, aby zobaczyć redesign w Astro w działaniu, w tym katalog, ścieżki branżowe, wyszukiwarkę i bezpośrednie drogi do zapytania. Jeśli obecna strona Państwa firmy przestała odpowiadać potrzebom nawigacji, technologii lub hostingu, warto umówić bezpłatną konsultację z Alquis. Przeanalizujemy ścieżkę kupującego, ryzyka techniczne i ograniczenia wydajności przed określeniem właściwego zakresu redesignu.
Pytania o redesign strony Hartpak
Dlaczego Astro było dobrym wyborem dla Hartpak?
Hartpak potrzebował szybkiej, przeszukiwalnej i bogatej w treść strony B2B, a nie ciężkiej aplikacji w przeglądarce. Astro dostarcza główny katalog i informacje o firmie jako HTML, pozostawiając JavaScript tylko dla interakcji, które rzeczywiście go wymagają.
Czy strona w Astro jest automatycznie bezpieczniejsza?
Żaden framework nie gwarantuje bezpieczeństwa. W tym projekcie Astro pomogło ograniczyć powierzchnię ataku, ponieważ publiczne treści nie wymagają CMS opartego na bazie danych przy każdym żądaniu. Nadal niezbędne są bezpieczne zależności, nagłówki, HTTPS, kontrola wdrożeń i ochrona Cloudflare.
Co Cloudflare wnosi do serwisu?
Cloudflare tworzy publiczną warstwę dostarczania przed hostingiem. Jego sieć wspiera caching bliżej odwiedzających, ogranicza obciążenie źródła, obsługuje szyfrowane połączenia i zapewnia standardową ochronę DDoS. Wydajność i odporność poprawiają się dzięki temu wspólnie.
Czy strona może rosnąć wraz z katalogiem Hartpak?
Tak. Powtarzalne layouty i komponenty utrzymują spójność nowych kategorii oraz stron branżowych. Wcześniej generowane strony zapobiegają jednocześnie sytuacji, w której wzrost katalogu powoduje zbędną pracę przeglądarki lub serwera przy każdej wizycie.
Co doprowadziło do wzrostu liczby leadów?
Wyniku nie stworzył jeden element wizualny. Zadziałało połączenie pozycjonowania, hierarchii kategorii, ścieżek branżowych, kontekstu produktowego, wyszukiwarki i kontaktu. Razem te elementy ograniczyły niepewność między wejściem na stronę a wysłaniem zapytania.
Jak szybko redesign przyniósł efekt biznesowy?
Hartpak zgłosił dwa razy więcej leadów ze strony w pierwszych dwóch tygodniach po uruchomieniu. Wpływ długoterminowy należy dalej oceniać na podstawie jakości leadów, trendów konwersji, zachowania powracających użytkowników i udziału ruchu organicznego w dłuższym okresie.
