STRONY WWW · IDMAG.PL

idmag.pl — katalog produktów na Astro ze 100/100 w Lighthouse.

Szybki katalog sprzętu Auto-ID z własnym asystentem AI i kreatorem doboru urządzeń. Komplet punktów w wydajności, dostępności, dobrych praktykach i SEO.

Szybka strona to nie „miły dodatek”. To pierwsze wrażenie, pozycja w Google i to, czy klient w ogóle doczeka do formularza. Na przykładzie idmag.pl, katalogu sprzętu Auto-ID, pokazujemy, jak budujemy strony, które w audycie Google Lighthouse dostają komplet punktów w każdej kategorii, a przy tym nie są pustą wizytówką: mają blisko tysiąc pozycji katalogowych, własnego asystenta AI i kreator, który pomaga dobrać urządzenie do zadania.

100Performance
100Accessibility
100Best Practices
100SEO
Raport Google Lighthouse dla strony głównej idmag.pl: 100 punktów w kategoriach Performance, Accessibility, Best Practices i SEO
Lighthouse · idmag.pl — strona główna · pomiar 16.09.2026

Wynik strony głównej łatwo „wypolerować”. Dlatego mierzymy też zwykłą kartę produktu: tę z galerią, specyfikacją, tabelą wariantów, akcesoriami i filmem. Karta Zebra ET401 też dostaje 100 w każdej kategorii.

Raport Google Lighthouse dla karty produktu Zebra ET401 na idmag.pl: 100 punktów w czterech kategoriach
Lighthouse · idmag.pl/zebra-et401 — karta produktu · pomiar 16.09.2026

Kontekst projektu. idmag.pl to katalog sprzętu do automatycznej identyfikacji: drukarki etykiet, terminale mobilne, czytniki kodów, RFID, urządzenia do znakowania. 175 rodzin produktów, blisko 1000 part numberów, 12 kategorii i ponad 270 stron. Strona nie sprzedaje wprost, tylko zbiera zapytania ofertowe. Każda sekunda ładowania i każde niejasne pytanie klienta to utracony lead.

Architektura

Astro: klient dostaje gotowy HTML, nie aplikację do uruchomienia

Większość stron katalogowych każe przeglądarce pobrać duży pakiet JavaScriptu i dopiero wtedy złożyć widok. My odwracamy tę kolejność. idmag.pl jest zbudowany w Astro jako strona w pełni statyczna: każda karta produktu, kategoria i krok kreatora powstają raz, w czasie budowania, jako gotowy plik HTML. Serwer niczego nie liczy przy wejściu użytkownika, więc nie ma na co czekać.

01
Treść jako kod
Dane katalogu żyją w repozytorium — rodziny, konfiguracje i part numbery są wersjonowane jak kod. Bez CMS-a w tle, bez zapytań do bazy przy każdym wejściu.

02
Zero frameworka w przeglądarce
JavaScript tylko tam, gdzie coś robi — filtry, porównywarka i wyszukiwarka to lekkie skrypty doładowywane wtedy, gdy są potrzebne.

03
Obrazy skrojone pod ekran
Kilka szerokości każdego zdjęcia w srcset, WebP serwowany automatycznie przeglądarkom, które go obsługują, i priorytet tylko dla zdjęcia w pierwszym widoku.

04
CSS i fonty bez opóźnień
Style wbudowane w HTML, fonty hostowane u siebie i przycięte do polskich znaków. Strona rysuje się od pierwszego pakietu danych.

05
Cięższe elementy na żądanie
Model 3D, film i analityka czekają — interaktywny model urządzenia ładuje się po kliknięciu, a skrypty pomiarowe dopiero po zgodzie i po wczytaniu strony.

06
Własny serwer, twarde cache
Docker + Caddy na własnym VPS — automatyczny HTTPS, kompresja zstd/gzip, roczne cache dla zasobów z hashem w nazwie i restrykcyjna polityka CSP.

SEO

SEO wbudowane w architekturę, nie doklejone wtyczką

Wynik 100 w kategorii SEO to dopiero próg wejścia. Ważniejsze jest to, co wyszukiwarka rozumie ze strony. Każda karta produktu opisuje się sama w danych strukturalnych schema.org: rodzina produktów jako ProductGroup, a każdy part number jako osobny wariant z własnym SKU i kodem GTIN. Do tego okruszki, FAQ, filmy, listy produktów w kategoriach, kanoniczne adresy, mapa witryny i przemyślane przekierowania 301 ze starej wersji serwisu, żeby migracja nie kosztowała pozycji.

Gotowe na wyszukiwanie z AI

Poza klasycznym SEO serwis publikuje plik llms.txt — uporządkowany opis całego katalogu dla modeli językowych. Kiedy klient pyta ChatGPT, Gemini czy Perplexity o drukarkę etykiet, asystent ma z czego rzetelnie skorzystać.

Asystent AI

Asystent, który zna katalog, a nie tylko „rozmawia”

W prawym dolnym rogu każdej strony czeka asystent AI, którego zbudowaliśmy dla tego katalogu. Nie jest to ogólny chatbot z doklejonym logo. Asystent zna indeks całego katalogu i korzysta z narzędzi: wyszukuje urządzenia, sięga po szczegóły konkretnej rodziny, pokazuje rekomendacje w formie kart produktów i na koniec przygotowuje zapytanie ofertowe.

1
pytanie Klient opisuje zadanie własnymi słowami: „potrzebuję drukarki do etykiet wysyłkowych w chłodni”.

2
katalog Asystent przeszukuje katalog i sprawdza parametry pasujących rodzin, zamiast zgadywać.

3
rekomendacja W oknie rozmowy pojawiają się karty konkretnych urządzeń z linkami do ich stron.

4
zapytanie Asystent przygotowuje zapytanie ofertowe, a handlowiec dostaje lead z pełnym kontekstem rozmowy.

Asystent nie obciąża strony: widżet to jeden niewielki skrypt bez zależności, a połączenie z serwerem nawiązuje dopiero po otwarciu okna czatu. Dlatego wyniki Lighthouse się nie zmieniają. Odpowiedzi są przesyłane strumieniowo, koszty pilnują limity dzienne i limity na adres IP, a zgodnie z AI Act rozmówca już w pierwszej wiadomości wie, że rozmawia z asystentem AI.

Kreator doboru

„Dobierz sprzęt do swojego zadania”: konfigurator, który zaczyna od problemu

Klient rzadko wie, że potrzebuje „drukarki termotransferowej 300 dpi”. Wie, że musi znakować palety albo skanować kody w magazynie. Kreator na idmag.pl zaczyna więc od zadania i prowadzi przez kilka pytań — znakowanie, odczyt kodów, RFID — aż do listy pasujących urządzeń i przycisku „Poproś o ofertę”.

Pod spodem to 69 osobnych, indeksowalnych stron. Każdy krok ma własny adres, działa nawet bez JavaScriptu i może trafić do Google jako odpowiedź na konkretne pytanie. Gdy JavaScript jest dostępny, przejścia między krokami odbywają się płynnie, bez przeładowania strony.

Stack

Z czego to jest zbudowane

FrontendAstro 5 · statyczny build · czysty JS
Katalog175 rodzin · ~1000 part numberów · 12 kategorii
WyszukiwarkaPagefind · indeks statyczny · ładowanie przy pierwszym użyciu
Asystent AImodel językowy · Node.js · SSE · 4 narzędzia katalogowe
SEOschema.org ProductGroup · sitemap · 301 · llms.txt
InfrastrukturaVPS · Docker Compose · Caddy · HTTPS · zstd
PrywatnośćConsent Mode v2 · własny baner zgód · fonty lokalne

Co z tego ma właściciel strony

Więcej zapytań z tego samego ruchu
Strona otwiera się od razu, a asystent i kreator prowadzą klienta aż do formularza, zamiast zostawiać go z tabelą parametrów.

Lepsza widoczność
Szybkość, dane strukturalne i setki indeksowalnych stron to przewaga w Google i w wyszukiwarkach AI.

Niski koszt utrzymania
Statyczny HTML nie ma wtyczek do łatania ani bazy do atakowania. Hosting jest prosty, a awarii mniej.

Wyniki Lighthouse to pomiary laboratoryjne i mogą się nieznacznie różnić między przebiegami. Właśnie dlatego projektujemy z zapasem: gdy strona startuje z pełną pulą punktów, pojedynczy ciężki baner czy nowy skrypt marketingowy nie zamieniają jej w wolną stronę.

Twoja strona

Chcesz stronę, która jest szybka i sama pracuje na sprzedaż?

Projektujemy i budujemy strony, katalogi produktów i asystentów AI dopasowanych do Twojej oferty. Zacznijmy od krótkiej rozmowy i audytu obecnej strony.

Porozmawiajmy o projekcie →