Nowy cech i nazwa, którą łatwo pomylić
Cech Rzemieślników i Przedsiębiorców w Radomiu to samorząd rzemiosła działający w Domu Rzemiosła przy ulicy Kilińskiego. Zrzesza rzemieślników, prowadzi sprawy nauki zawodu i egzaminów, działa w strukturach Izby Rzemiosła. Stronę zbudowaliśmy od zera, łącznie z treścią.
Do tego w Radomiu działa drugi cech o bardzo podobnej nazwie, z własną stroną i własnym adresem. Rzemieślnik albo pracodawca szukający informacji o nauce zawodu łatwo może pomylić jeden z drugim. Strona musiała więc nie tylko informować, ale też jednoznacznie odpowiadać na pytanie: czy jestem we właściwym miejscu.
Treść zbudowana na faktach, nie na ogólnikach
Instytucja nie potrzebuje haseł marketingowych. Potrzebuje odpowiedzi na konkretne pytania: ile zarabia uczeń w drugiej klasie, ile wynosi dofinansowanie dla pracodawcy, jak zgłosić się na egzamin czeladniczy, gdzie jest biuro i w którym pokoju. Dlatego treść powstała ze źródeł, a nie z wyobraźni.
- Cele statutowe w brzmieniu z Krajowego Rejestru Sądowego, nie w parafrazie
- Pięć aktualności startowych opartych na wpisie w KRS i komunikatach Izby Rzemiosła
- Stawki wynagrodzenia ucznia w kolejnych latach nauki, refundacja i dofinansowanie dla pracodawcy z aktualnymi kwotami na 2026 rok
- Wykaz wzorów dokumentów z łączami do plików Izby, każde łącze sprawdzone przed startem
- Struktura samorządu rzemiosła wyjaśniona wprost: cech, izba, związek ogólnopolski
- Pytania i odpowiedzi przy członkostwie i nauce zawodu, z podstawą prawną
Adres, piętro, numer pokoju, dane rejestrowe, telefon Izby i skład Zarządu pojawiają się na stronie w wielu miejscach: w nagłówku, stopce, na stronie kontaktu, w danych dla Google. Wszystkie pochodzą z jednego pliku. Gdy w trakcie prac okazało się, że numer pokoju biura był inny, niż wynikało z pierwszych materiałów, poprawka w jednym miejscu zmieniła go na całej stronie i w danych strukturalnych jednocześnie.
Pierwsza wersja do kosza
Pierwszy projekt wyglądu powstał z kolorów budynku Domu Rzemiosła, z krojem szeryfowym i układem w stylu magazynu. Był poprawny technicznie i nie przeszedł przeglądu. Werdykt: zbyt szablonowy, za mało w nim cechu i brakuje zieleni z logo.
Zamiast poprawiać kosmetycznie, zaczęliśmy od materiału, który należy do klienta. Projektant cechu przysłał logo w formacie wektorowym. Z tego pliku wzięliśmy kolory, czyli zieleń i czerń konturów, a koło zębate z młotkiem i wagą wycięliśmy z logo jako ikonę strony i favicon.
Paleta z elewacji budynku
Krój szeryfowy, układ jak w magazynie
Kafle z ikonami i karty z dużymi liczbami
Nadtytuły, kursywy, numerowane sekcje
Zieleń i czerń wzięte wprost z logo
Barlow Condensed, krój bliski literom z logo, i Source Sans 3 do tekstu
Lista spraw, ramka „W skrócie" i tabela egzaminów
Zwykłe nagłówki, bez ozdobników
Usunięcie typowych wzorców automatycznego projektowania nie było kwestią gustu, tylko punktem kontroli. Gradienty, zaokrąglone paski przy krawędzi, nadtytuły, kolorowe kursywy, pasy z liczbami i siatki kart z ikonami sprawdzaliśmy przeszukaniem kodu, a nie tylko na oko.
Przebieg prac
Ustalenie, który to cech
Weryfikacja w KRS i rozróżnienie od cechu o podobnej nazwie, który od 2024 roku działa poza radomską Izbą Rzemiosła. Wybór WordPressa, bo biuro ma samo dodawać aktualności
Treść i struktura
Strona główna, sześć podstron tematycznych, aktualności i polityka prywatności. Treści oparte na KRS, materiałach Izby i aktualnych przepisach o nauce zawodu
Wersja 1.0 na serwerze testowym
Działająca strona z formularzem, danymi strukturalnymi i zgodami. Odrzucona w przeglądzie wyglądu
Nowy wygląd z logo cechu
Kolory, kroje, ikony, favicon i obraz do udostępnień zbudowane z pliku wektorowego od projektanta. Prostszy, urzędowy układ
Przeniesienie na domenę cechu
Hosting cechu, certyfikat SSL, przekierowania na jeden adres z HTTPS, nagłówek HSTS, skrzynka biura. Indeksowanie włączone dopiero po potwierdzeniu treści przez cech
Dwa przeglądy kodu
Osobno bezpieczeństwo, osobno zgodność ze standardami. Poprawki do strony wdrożone przed oddaniem, łącznie z drobnymi uwagami
Lekko, bez wtyczek, na lata
Strona instytucji, która nie ma działu IT, musi działać bez opieki. Każda wtyczka to kolejna rzecz do aktualizowania i kolejne miejsce, przez które ktoś może się włamać. Dlatego motyw powstał od zera i nie korzysta z żadnej wtyczki: formularz, zgody, SEO, dane strukturalne, mapa i wykaz dokumentów są w kodzie.
Bez kroku budowania, bez frameworka CSS, bez bibliotek JavaScript. Za kilka lat dowolny programista WordPressa otworzy ten kod i zrozumie go bez dokumentacji. A dokumentacja i tak jest: opis architektury, instrukcja dla biura i raport zgodności ze standardami.
Mapa, która nie śledzi przed zgodą
Mapa Google na stronie kontaktu to typowy przeciek danych: osadzona wprost ustawia pliki cookies Google, zanim odwiedzający cokolwiek zaakceptuje. Tutaj mapa ładuje się dopiero po kliknięciu, a do tego czasu obok niej jest opis dojazdu: gdzie stoi budynek, jak go rozpoznać i na którym piętrze jest biuro.
Zgody i pomiar jak w dużym serwisie
Mała instytucja dostała ten sam model zgód, który stosujemy na własnej stronie. Consent Mode w wersji drugiej ustawia odmowę dla wszystkich kategorii jako pierwszy skrypt na stronie, zanim załaduje się jakikolwiek tag. Zapisany wybór odwiedzającego jest odtwarzany natychmiast, przy każdej kolejnej podstronie.
- Siedem sygnałów zgody w trzech kategoriach: niezbędne, statystyczne i marketingowe
- Przycisk „Tylko niezbędne" równorzędny z akceptacją, ustawienia dostępne z każdej strony w stopce
- Obsługa tagu Google albo kontenera GTM; gdy wpisane są oba, ładuje się tylko kontener, żeby statystyki nie liczyły się podwójnie
- Zdarzenia gotowe do pomiaru: kliknięcie w telefon, e-mail, media społecznościowe, przyciski i wysłanie formularza
- Zgłoszenie z formularza liczone dopiero po prawdziwej wysyłce, a nie po trafieniu robota w pułapkę
Formularz, który nie wpuszcza spamu ani bałaganu
Formularz prośby o kontakt ma dwa pola: e-mail i telefon, oba obowiązkowe. Tyle wystarczy, żeby biuro mogło oddzwonić, i nic ponad to, czego nie trzeba przetwarzać.
- Walidacja po stronie serwera: format adresu, długość, od 9 do 15 cyfr w numerze
- Limit pięciu wysyłek i dwudziestu błędnych prób na godzinę z jednego adresu, liczony na skrócie adresu, bez zapisywania go w bazie
- Pole-pułapka na roboty i jednorazowy klucz zabezpieczający; błędny klucz nie zostawia w bazie żadnego śladu
- Odpowiedź z poczty biura trafia wprost do nadawcy
Dwa przeglądy kodu, osobno pod kątem bezpieczeństwa i standardów, wskazały między innymi, że błędne zgłoszenia mogły zapisywać stan w bazie ponad limit, że kontrast obrysu pól formularza był za niski dla osób słabowidzących i że kolejne strony aktualności nie miały poprawnego adresu kanonicznego. Wszystkie uwagi dotyczące strony zostały wdrożone przed oddaniem, a kontrast obrysu pól wynosi teraz 4,9 do 1.
Bezpieczeństwo i widoczność w wyszukiwarce
Nagłówki bezpieczeństwa łącznie z polityką treści, wymuszone HTTPS z HSTS, zablokowany interfejs XML-RPC i publiczne pliki zdradzające wersję WordPressa, ukryte strony i mapa autorów. Plik security.txt mówi badaczom bezpieczeństwa, gdzie zgłosić problem.
Dla wyszukiwarki cech jest opisany jako organizacja i lokalna instytucja: z adresem, współrzędnymi, numerami KRS, NIP i REGON oraz przynależnością do Izby Rzemiosła. Do tego okruszki nawigacji, aktualności opisane jako wiadomości i sekcje pytań. Dane adresowe są wszędzie identyczne, bo pochodzą z jednego pliku, a to podstawa lokalnego SEO.
- Asystenci AI cytujący strony na żywo wpuszczeni, roboty hurtowo pobierające treści zablokowane
- Pozostałe roboty uczące modele wpuszczone świadomie: treść jest informacyjna, a cechowi zależy na zasięgu
- Plik
llms.txtz opisem strony dla modeli językowych, manifest i komplet ikon - Zdjęcia Domu Rzemiosła z Wikimedia Commons na wolnych licencjach, z wymaganym podpisem autora pod każdym
Technologie
PHP
Własny motyw klasyczny
CSS bez frameworka
JavaScript bez zależności
Consent Mode v2
Google Tag Manager / gtag.js
Schema.org JSON-LD
Content Security Policy
axe-core
Lighthouse
WP-CLI
Rezultaty
Czego ten projekt uczy
Mała strona nie usprawiedliwia niższego standardu. Cech dostał dokładnie to, co stosujemy przy większych wdrożeniach: zgody zgodne z RODO, dwa przeglądy kodu, testy dostępności i układu, dokumentację i instrukcję. Różnica polegała na skali, nie na staranności. Projekt zrobiliśmy pro bono, jako wsparcie samorządu rzemiosła, i właśnie dlatego nie było w nim taryfy ulgowej.
Drugi wniosek dotyczy wyglądu. Wersja, która „wyglądała ładnie", przegrała z wersją zbudowaną z materiału klienta. Logo cechu powiedziało o jego tożsamości więcej niż jakakolwiek paleta wymyślona od zera, a prosty, urzędowy układ okazał się lepszy dla instytucji, do której przychodzi się po konkretną informację.
