Redesign strony internetowej od kuchni: jak przebudowaliśmy zest.agency w miesiąc

Dlaczego zdecydowaliśmy się na redesign

Stara strona zest.agency była typową wizytówką swojej epoki: jeden długi one-pager w czerni i pomarańczu, napisany w czystym PHP, bez żadnego CMS-a. Kilka sekcji usługowych, podstrony z opisami klientów, formularz kontaktowy i w zasadzie nic więcej. Przez lata robiła swoje, ale w pewnym momencie przestała nadążać za firmą.

Powody redesignu były trzy. Po pierwsze, oferta uciekła treści: performance marketing to dziś u nas także kreacje generowane z pomocą AI, kampanie UGC czy content na LinkedIn, a na starej stronie tych usług w ogóle nie było. Po drugie, brakowało zaplecza do pozyskiwania klientów z ruchu organicznego: strona nie miała bloga ani wersji angielskiej, więc nie było ani czym rankować, ani czym rozmawiać z zagranicznym klientem. Po trzecie, technologia: strona bez CMS-a oznaczała, że każda, nawet kosmetyczna zmiana treści wymagała grzebania w kodzie.

Po

Przed

Nowa technologia: React na edge'u zamiast PHP

Nowa strona to aplikacja w React oparta o TanStack Start (framework z renderowaniem po stronie serwera), hostowana na Cloudflare Workers, czyli renderowana na serwerach brzegowych globalnej sieci Cloudflare możliwie blisko użytkownika, bez klasycznego „jednego serwera w jednej serwerowni". Zaplecze (formularze, rekrutacja, automatyzacje) obsługuje Supabase.

Najbardziej nieoczywista decyzja: świadomie nie wdrożyliśmy klasycznego CMS-a. Treści żyją w repozytorium kodu, a każda zmiana przechodzi przez ten sam proces co zmiany w kodzie: commit, review i automatyczny deploy na produkcję w kilka minut. Dla zespołu, w którym treści i tak piszą osoby techniczne (albo automat, o czym za chwilę), oznacza to brak kosztów utrzymania panelu, wtyczek i aktualizacji bezpieczeństwa, a przy okazji daje pełną historię każdej zmiany.

Miesiąc pracy: co naprawdę zajęło czas

Cały projekt zamknął się w miesiącu pracy w niepełnym wymiarze. Najciekawsze jest jednak to, na co ten czas poszedł. Sam kod nowej strony powstał szybko. Zdecydowaną większość czasu pochłonęły:

• copy: każda podstrona usługowa pisana od zera pod konkretną intencję klienta, nie „o nas",
• selekcja i przygotowanie kreacji klientów (wideo i statyki, kompresja, formaty),
• wersja angielska całego serwisu,
• refaktoryzacja kodu i praca nad szybkością ładowania,
• audyt SEO,
• analityka i Consent Mode v2,
• automatyzacje: blog publikowany z pomocą AI oraz moduł rekrutacyjny z automatyczną wstępną oceną zgłoszeń.

Tę lekcję zabierzesz z tego projektu niezależnie od technologii: redesign to projekt contentowy, nie graficzny. Zaczęliśmy od treści i oferty, makiety przyszły później. Mimo to treści były wąskim gardłem. Jeśli planujesz redesign i w harmonogramie masz „teksty: tydzień", pomnóż to razy trzy.

AI w procesie: od animacji hero po automat blogowy

Nowa strona miała pokazywać, jak pracujemy, a pracujemy dziś z dużym udziałem AI. Widać to w trzech miejscach. Pierwsze to animacja hero na stronie głównej: zamiast showreelu wideo zakodowaliśmy autorską animację całego procesu pracy agencji, od briefu po wynik finansowy. Drugie to podstrona kreacji AI z materiałami, które wyprodukowaliśmy dla klientów.

Trzecie, najbardziej wymierne, to automat blogowy. Dwa razy w tygodniu, bez udziału człowieka, przechodzi pełny cykl: analiza danych z Google Search Console i researchu fraz, wybór tematu, artykuł po polsku i angielsku, grafiki w spójnym stylu, kontrola jakości, publikacja i post na firmowym LinkedIn. Człowiek dostaje alert tylko wtedy, gdy coś pójdzie nie tak. Artykuł, który właśnie czytasz, jest akurat pisany „ręcznie", ale dwa sąsiednie na blogu najprawdopodobniej wyprodukował automat.

Czego nauczył nas własny redesign

Kilka wniosków, które przełożysz na własny projekt niezależnie od skali:

• Zacznij od treści, makiety zrób potem. Największym problemem starej strony była pustka treściowa, wygląd dopiero dalej.
• Zmierz starą stronę, zanim ją wyłączysz. Zrób pełny eksport danych z Google Search Console i GA4, zapisz wyniki PageSpeed i zrzuty ekranu: po redesignie posłużą Ci do porównań. Listę rzeczy do poprawienia w nowej wersji podpowie też audyt UX starej strony.
• Szybkość traktuj jako wymóg od pierwszego dnia. Render na edge'u, kompresja mediów i lazy loading to decyzje architektoniczne, które trudno „dokleić" później. Progi dobrego wyniku Google opisuje w dokumentacji Core Web Vitals: LCP do 2,5 s, a CLS do 0,1. Nasza strona główna ma po wdrożeniu LCP 0,7 s na desktopie.
• Wersje językowe planuj od pierwszego dnia. Dokładanie ich po fakcie podwaja pracę nad treścią.
• Automatyzuj publikację. Jeśli dodanie artykułu wymaga programisty albo walki z panelem, blog umrze śmiercią naturalną w miesiąc.

Redesign własnej strony to dla agencji test wiarygodności: jako agencja marketingu cyfrowego codziennie doradzamy klientom w sprawach stron, kampanii i analityki, więc własną stronę potraktowaliśmy jak projekt kliencki, z briefem, harmonogramem i kontrolą jakości. Efekty w liczbach (99/100 w PageSpeed Insights na desktopie, LCP 0,7 s, TBT 11 ms, CLS ~0, na mobile treść renderuje się w ~1,4 s) zebraliśmy w case study tego wdrożenia, a jeśli planujesz podobny projekt, zobacz, jak podchodzimy do projektowania stron internetowych. A skoro o analityce mowa: jeśli po swoim redesignie chcesz wiedzieć, ile danych naprawdę zbierasz, zajrzyj do artykułów o Consent Mode v2 i o dashboardzie marketingowym.