MediaVision

Firma potrzebowała dwujęzycznej (polsko-angielskiej) strony marketingowej z podstronami produktów i usług oraz portfolio realizacji. Treści miały być edytowane samodzielnie przez klienta, bez udziału programisty, a strona miała działać szybko i być dobrze indeksowana przez wyszukiwarki.

Stronę oparłem na architekturze headless. WordPress pełni rolę panelu administracyjnego: grupy pól ACF są zdefiniowane w kodzie jako lokalny JSON, Polylang łączy polskie i angielskie wersje treści, Yoast dostarcza metadane SEO i dane strukturalne (schema), a zgłoszenia z Contact Form 7 trafiają przez REST API.

Front-end działa na Next.js 16 z App Routerem i jest budowany z opcją output: 'export', która generuje statyczny HTML. Każda podstrona ma w kodzie pełne domyślne treści po polsku i po angielsku, dzięki czemu renderuje się poprawnie nawet bez danych z CMS-a. Jedynym źródłem prawdy dla zlokalizowanych ścieżek jest plik routes.ts.

Kod znajduje się w monorepo na GitHubie. Gałąź staging trafia na środowisko stagingowe, a gałąź main na mediavision.pl. GitHub Actions buduje statyczny eksport i przesyła go przez rsync po SSH na hosting współdzielony, z pominięciem pliku .htaccess.

Niewielka wtyczka do WordPressa przy każdym zapisie treści przez redaktora wysyła zdarzenie repository_dispatch, które automatycznie uruchamia przebudowę stagingu i produkcji. Ustawienia robots i indeksowania zależą od zmiennej środowiskowej, dzięki czemu jedna instancja WordPressa bezpiecznie zasila zarówno staging wyłączony z indeksowania (noindex), jak i indeksowaną produkcję.

Wideo w sekcji hero przekodowałem z 22 MB do 4 MB w wersji desktopowej i z 28 MB do 3 MB w wersji mobilnej. Grafiki zostały przeniesione do formatu WebP z jawnie ustawionymi atrybutami loading, decoding i fetchpriority, a klatka startowa wideo (poster) jest wczytywana z wyprzedzeniem.

Mapa witryny (sitemap) jest generowana po zbudowaniu strony. Tagi hreflang i canonical oraz dane JSON-LD pochodzą z Yoast, a sekcje z canvasem i wideo zawierają tekst czytelny dla robotów wyszukiwarek. Adres główny przekierowuje na /pl/ (301), a wersja z www na domenę bez www.

Redaktorzy publikują treści samodzielnie, bez udziału programisty, a każda publikacja uruchamia nowy statyczny build. Strona działa w dwóch środowiskach, stagingowym i produkcyjnym, a sam front-end jest w pełni statyczny, więc obsłuży go dowolny hosting.

W pomiarze Lighthouse z 27 października 2026 strona główna uzyskała 98 punktów za wydajność na telefonie i 99 na komputerze, a na obu po 100 punktów za dostępność, dobre praktyki i SEO.