Wdrożenie strony internetowej i kod

Masz zatwierdzony projekt w Figmie i strona ma w końcu wylądować pod Twoją domeną. To etap, na którym najczęściej ucieka jakość: odstępy się rozjeżdżają, animacje z makiety znikają, a strona, która na ekranie projektanta wyglądała świetnie, na telefonie ładuje się kilka sekund. Twój klient nigdy nie zobaczy pliku projektowego. Zobaczy to, co załaduje mu się w przeglądarce, i po tym oceni Twoją firmę.

Każdy widok kodujemy od zera według zatwierdzonego projektu UX/UI, z wymiarami, stanami i ruchem z makiety. Gotowych motywów nie przerabiamy, więc strona nie dźwiga funkcji, których nikt nie używa, i ładuje tylko to, co jest w projekcie.

Projekt może pochodzić od innego projektanta albo z Twojego zespołu. Zanim go wycenimy, sprawdzamy pliki: czy są wszystkie stany przycisków i formularzy, widoki na telefon i tablet, treści do każdej podstrony. Jeśli czegoś brakuje, dostajesz listę braków i propozycję, kto je uzupełni: my albo Twój projektant. Wycena kodu powstaje dopiero po tym przeglądzie, więc w trakcie pracy nie dochodzą pozycje, o których nie było mowy.

Od zatwierdzonego projektu do strony pod Twoją domeną dzielą Cię cztery etapy: kod front-endu, panel treści, testy na urządzeniach i publikacja. Każdy z nich sprawdzamy przed odbiorem, zanim stronę zobaczą Twoi klienci.

Kodujemy tak, żeby stronę dało się później rozbudować. Blog, drugą wersję językową, sklep albo rezerwacje dołożysz bez przepisywania całości, bo komponenty i struktura treści są na to przygotowane. Te etapy wyceniamy wtedy, gdy będą potrzebne, więc pierwsza faktura obejmuje to, co zamawiasz teraz. W standardowym wdrożeniu znajdziesz:

• Front-end w semantycznym HTML, Tailwind CSS i TypeScript, czytelny dla przeglądarek, wyszukiwarek i czytników ekranu.

• Headless CMS (Sanity albo Storyblok), w którym teksty, zdjęcia i nowe podstrony zmieniasz bez programisty.

• Układ mobile-first, testowany na prawdziwych telefonach i tabletach, zanim zobaczysz wersję do odbioru.

• Optymalizację pod Core Web Vitals

  obrazy w odpowiednim rozmiarze, leniwe ładowanie i podział skryptów (code splitting).

• Dostępność WCAG 2.2 AA, czyli kontrast, obsługę klawiaturą i czytniki ekranu, sprawdzoną przed oddaniem.

• Publikację pod Twoją domeną, z konfiguracją serwera, domeny i hostingu na kontach, które należą do Ciebie.

Strona firmowa albo prezentacyjna, która ma przedstawić ofertę i zbierać zapytania, najczęściej powstaje u nas na Astro: daje lekkie strony, które ładują się szybko także na słabszym telefonie. Gdy strona ma więcej logiki (panel klienta, kalkulator, logowanie), sięgamy po Next.js i React. Sposób renderowania zależy od treści: strony, które zmieniają się rzadko, generujemy statycznie (SSG), a tam, gdzie dane muszą być świeże, używamy SSR lub ISR.

Panelem treści jest zwykle Sanity albo Storyblok, czyli headless CMS. Na Sanity działa również ta strona. Publikujemy na Vercelu albo na hostingu, który już masz. Sklepy budujemy na Shopify lub w modelu headless, a aplikacje na React, Next.js lub Laravel; ten zakres opisujemy osobno przy aplikacjach webowych i PWA.

O technologii decydujemy na etapie strategii, kiedy już wiadomo, kto będzie edytował treści, jak często strona ma się zmieniać, z jakimi systemami ma się łączyć i jaki ruch obsłużyć. Jeśli masz hosting, panel albo platformę, do której przywykł Twój zespół, bierzemy to pod uwagę. Gdyby ten wybór miał zaszkodzić szybkości albo kosztom utrzymania, usłyszysz o tym na pierwszej rozmowie razem z propozycją alternatywy.

Szybkość na telefonie jest jednym z naszych warunków odbioru. Jeśli strona ma mniej niż 85 punktów w PageSpeed Mobile, wraca do nas i poprawiamy ją, aż ten próg osiągnie. Pracujemy według Core Web Vitals: obrazy ładują się leniwie i w rozmiarze dopasowanym do ekranu, skrypty dzielimy na mniejsze części, a układ nie przeskakuje w trakcie ładowania.

Jeśli w projekcie są animacje i elementy 3D, optymalizację ich ładowania wliczamy we wdrożenie. Modele i skrypty pobierają się dopiero wtedy, gdy użytkownik przewija stronę do sekcji, w której są potrzebne, a przy włączonym w systemie ograniczeniu ruchu strona zostaje statyczna. Efekt ma robić wrażenie, gdy już się załaduje, i nie może opóźniać pierwszego ekranu.

Dostępność WCAG 2.2 AA sprawdzamy w tym samym przeglądzie: kontrast, obsługę klawiaturą, czytniki ekranu i ograniczenie ruchu. Testujemy też na różnych urządzeniach i przeglądarkach, bo układ, który działa w Chrome na komputerze, potrafi rozjechać się w Safari na iPhonie. Wersję testową dostajesz pod roboczym adresem i masz czas na uwagi, zanim strona trafi pod docelową domenę i zobaczą ją Twoi klienci.

Cena wdrożenia zależy od liczby widoków i szablonów podstron, wybranego CMS-a, integracji oraz tego, czy przenosimy treści ze starej strony. Prosty formularz kontaktowy to godzina pracy; rezerwacje, kalkulator wyceny albo synchronizacja z CRM to osobny etap z własną wyceną. Jeśli zamawiasz u nas całość, projekt i kod mieszczą się w jednej cenie pakietu z cennika: strona wizytówka od 3 000 zł netto, strona z panelem treści od 4 500 zł netto, sklep od 8 000 zł netto. Bezpłatną wycenę z rozpisanym zakresem i harmonogramem dostajesz do 48 godzin od rozmowy.

Wdrożenie jest częścią harmonogramu całego projektu: strona firmowa powstaje zwykle w 2–6 tygodni, sklep internetowy w 3–12 tygodni. Daty etapów dostajesz razem z wyceną, więc wiesz, kiedy zobaczysz pierwszą wersję, a kiedy stronę pod swoją domeną. Jeśli zależy Ci na krótszym terminie, sprawdzamy kalendarz i proponujemy tryb ekspresowy za dopłatą. Do wdrożenia możesz dołożyć trzy osobne pozycje:

• Migracja treści ze starej strony. Przenosimy teksty, obrazy i strukturę adresów URL, ustawiamy przekierowania, żeby strona nie straciła pozycji w wyszukiwarce, a po migracji sprawdzamy poprawność danych. Od 600 zł netto.

• Testy wydajności i optymalizacja. Po wdrożeniu przeprowadzamy pełne testy Core Web Vitals i ręcznie usuwamy wąskie gardła, zamiast dokładać kolejną warstwę cache. Cel: 90+ punktów w PageSpeed na telefonach. Od 1 000 zł netto.

• Szkolenie z obsługi CMS. Dwugodzinna sesja wideo z Twoim zespołem: jak edytować treści i dodawać podstrony, żeby niczego nie zepsuć. Nagranie zostaje u Ciebie. Od 600 zł netto.

Po odbiorze masz dostęp do repozytorium kodu, panelu hostingu i CMS-a, a domena, hosting, panel treści i kod należą do Ciebie. Niestandardowe rozwiązania opisujemy w README. Jeśli Twój zespół ma utrzymywać stronę samodzielnie, dokładamy dokumentację techniczną napisaną na jego poziomie: inaczej dla programisty, inaczej dla osoby od marketingu.

Przez 30 dni od odbioru błędy wynikające z naszego kodu naprawiamy bezpłatnie. Co jest błędem, a co nową funkcją, zapisujemy w umowie, żeby po drodze nie było o to sporu. Gdy ten czas minie, możesz przejść na stałe wsparcie i rozwój strony: aktualizacje, kopie zapasowe, monitoring i nowe funkcje bez zakładania projektu od nowa.

Projekt prowadzi osobiście Kacper Baranowski, więc z pytaniem o kod wracasz do osoby, która go pisała. Na każdą wiadomość odpowiadamy do końca następnego dnia roboczego. A jeśli kiedyś zdecydujesz się na innego wykonawcę, dokumentacja i dostępy pozwolą mu przejąć stronę bez przepisywania jej od zera.

Wdrożenie i kod wchodzi w zakres trzech ofert: stron internetowych dla firm, sklepów internetowych i stron branżowych. Jeśli zamawiasz całą stronę, cenę projektu razem z kodem znajdziesz na stronie oferty. Przy każdym wdrożeniu konfigurujemy też SEO techniczne i analitykę: strukturę nagłówków, metadane, mapę strony i pomiar konwersji, bo to z kodu wyszukiwarka dowiaduje się, o czym jest Twoja strona.

Masz gotowy projekt, stronę do przepisania albo motyw, z którego firma wyrosła? Opisz sytuację w formularzu na dole strony. Odpiszemy najpóźniej następnego dnia roboczego, umówimy krótką rozmowę online, a do 48 godzin po niej dostaniesz wycenę z zakresem i harmonogramem. Decyzję podejmujesz dopiero wtedy.