Strona internetowa szyta na miarę dla spółki miejskiej

Stara strona miejskiej spółki rzadko psuje się nagle. Częściej przez lata dokłada się do niej kolejne podstrony, pliki, komunikaty, linki i aktualności, aż w końcu przestaje być narzędziem dla mieszkańców, a zaczyna być nieuporządkowanym magazynem informacji, w którym trudno cokolwiek znaleźć.

Właśnie z takim wyzwaniem rozpoczął się projekt dla MZUK Wałbrzych. Miejski Zakład Usług Komunalnych w Wałbrzychu obsługuje wiele obszarów ważnych dla mieszkańców: odpady, komunikację miejską, parki, utrzymanie miasta, pogrzeby i cmentarze. Tu użytkownik często wchodzi po konkretną informację: harmonogram odbioru odpadów, zasady segregacji, cennik lub dostępność biletów, dokument, kontakt albo sprawdzić czy pojawił się nowy komunikat.

Dlatego w tym projekcie nie chodziło o lekkie odświeżenie wyglądu. Chodziło o modernizację strony internetowej, która ma działać jak uporządkowana infrastruktura informacyjna dla mieszkańców miasta.

Efekt: nowa strona mzuk.com.pl osiągnęła 96/100 PageSpeed Mobile, przechodzi Core Web Vitals, została przygotowana od podstaw z myślą o WCAG 2.2 i daje redakcji MZUK wygodne narzędzia do samodzielnego zarządzania treściami.

Zobacz zdjęcia i kartę realizacji

Punkt startowy: strona, która nie nadążała za skalą działania MZUK

Poprzednia strona MZUK była przestarzała, zaniedbana i technicznie problematyczna. Największy kłopot nie polegał jednak tylko na wyglądzie. Przy tak szerokim zakresie działalności sama struktura informacji zaczęła być problemem.

Mieszkaniec nie myśli kategoriami wewnętrznej struktury organizacyjnej spółki. Nie zastanawia się, który dział odpowiada za daną sprawę. Wchodzi na stronę i chce szybko sprawdzić, kiedy odbierane są odpady, gdzie zgłosić problem, co może oddać do pszok, gdzie znaleźć rozkład jazdy albo jakie atrakcje czekają na niego w konkretnym parku miejskim.

Jeśli taka strona jest wolna, nieużywalna na telefonie albo ma chaotyczną nawigację, problem jest bardzo praktyczny: użytkownik traci czas, telefonuje zamiast znaleźć informację samodzielnie, a pracownicy spółki obsługują pytania, które dobra strona powinna rozwiązywać automatycznie.

Wniosek: przy stronie dla spółki miejskiej design jest ważny, ale dopiero po uporządkowaniu informacji. Ładna strona bez dobrej struktury nadal będzie frustrować użytkowników.

Cyfrowy SPRINT dla MZUK: najpierw struktura, potem wygląd

Projekt realizowaliśmy w modelu sprintu (nastawiony na jak najszybsze wdrożenie, naprawę palących problemów), ale z bardzo indywidualnym podejściem. Przy stronie tego typu gotowy motyw WordPress zwykle szybko pokazuje ograniczenia, bo trzeba pogodzić kilka rzeczy naraz: wiele działów, dużo treści, częste aktualności, dostępność cyfrową, wydajność i prostą obsługę po stronie redakcji.

Pierwszym krokiem był audyt starej strony i potrzeb komunikacyjnych. Trzeba było odpowiedzieć na proste, ale kluczowe pytania: czego mieszkańcy szukają najczęściej, które ścieżki powinny być widoczne od razu, jak nazwać działy, żeby użytkownik nie musiał znać wewnętrznego języka organizacji, i jak zbudować stronę tak, żeby dało się ją rozwijać po publikacji.

Dopiero na tym fundamencie, wspólnie z zarządem opracowaliśmy nową architektura informacji. Następnie zaprezentowaliśmy projekt UX/UI, który po akceptacji wdrożyliśmy w WordPressie. To ważne, bo tworzenie stron WordPress nie powinno polegać na klikaniu kolejnych sekcji w builderze, aż coś zacznie wyglądać dobrze. Najpierw trzeba wiedzieć, jaki jest cel strony.

W przypadku MZUK celem było stworzenie serwisu, który działa dobrze dla dwóch grup jednocześnie: mieszkańców, którzy potrzebują szybkich odpowiedzi, oraz pracowników, którzy muszą regularnie publikować i aktualizować treści.

Co zrobiliśmy na stronie MZUK

Nowa strona została zbudowana w WordPressie z wykorzystaniem Bricks, ACF, usług Cloudflare i dodatkowych modułów dopasowanych do potrzeb projektu. Piszę o tym ogólnie, bo szczegóły techniczne tego typu wdrożeń nie powinny trafiać do publicznego case study.

Na stronie głównej pojawiły się szybkie ścieżki do najważniejszych podstron: harmonogramu odbioru odpadów, zasad segregacji i kontaktu. To drobiazg tylko z pozoru. Przy miejskim serwisie użytkownik nie powinien przekopywać się przez menu czy mapę strony, jeśli najczęstsze zadania da się pokazać od razu.

Powstała też wyszukiwarka „Gdzie to wyrzucić?”, która pomaga mieszkańcom sprawdzić, do jakiego kosza (lub miejsca) powinien trafić konkretny odpad. Brzmi technicznie, ale efekt jest prosty: zamiast czytać długie artykuły, użytkownik wpisuje ogólną nazwę przedmiotu i dostaje odpowiedź.

Drugim ważnym elementem był system ogłoszeń i komunikatów. Strona spółki miejskiej musi szybko reagować na zmiany: awarie, terminy, ważne informacje dla mieszkańców. Dlatego wdrożyliśmy mechanizm, który pozwala publikować widoczne komunikaty bez przebudowywania strony i bez angażowania programisty w każdą najmniejszą zmianę.

Do tego dochodzi rozbudowana struktura usług: odpady, komunikacja miejska, parki, utrzymanie miasta, pogrzeby i cmentarze, aktualności, FAQ oraz strony prawne. Każda z tych sekcji musiała być częścią jednego spójnego systemu.

Dostępność WCAG: obowiązek, który realnie poprawia stronę

Przy projektach publicznych dostępność cyfrowa nie jest dodatkiem na końcu. To jeden z fundamentów pracy. Strona powinna być możliwa do obsłużenia przez osoby korzystające z klawiatury czy czytników ekranu, oraz przyjazna dla małych ekranów i znacznego powiększenia w przeglądarce.

W praktyce oznacza to wiele decyzji projektowych, które nie zawsze są efektowne na screenshocie, ale mają ogromne znaczenie w korzystaniu ze strony: czytelne nagłówki, logiczna kolejność treści, poprawne teksty alternatywne, kontrasty kolorów, przyjazne przyciski, widoczny fokus i brak elementów, które wyglądają dobrze tylko dla osoby korzystającej z dużego monitora.

W tym projekcie strona została przygotowana z myślą o WCAG 2.2. Jeśli ktoś chce wejść głębiej w temat, oficjalna specyfikacja jest dostępna na stronie W3C WCAG 2.2, ale dla większości właścicieli stron najważniejszy jest prostszy wniosek: dostępność poprawia jakość strony dla wszystkich, nie tylko dla małej grupy użytkowników.

Dobrze opisany link, wyraźny kontrast i logiczna struktura pomagają osobie niewidomej, ale pomagają też komuś, kto wchodzi na stronę w słońcu, na telefonie, w pośpiechu albo po prostu nie chce się domyślać, gdzie kliknąć.

Szybkość: 96/100 PageSpeed Mobile

Rozbudowane strony często kończą jako ciężkie, wolne serwisy. Szczególnie kiedy mają dużo obrazów, skryptów, sekcji i integracji. Problem w tym, że użytkownika nie interesuje, ile pracy było pod spodem. Strona ma się po prostu szybko otworzyć, szczególnie na telefonie.

W Cyfrowym Sprincie dla MZUK wynik Google PageSpeed Insights dla urządzeń mobilnych wyniósł 96/100, a strona przeszła Core Web Vitals. To ma znaczenie, bo Google coraz mocniej patrzy na realne doświadczenie użytkownika: czas ładowania, stabilność układu i szybkość reakcji strony. Więcej o tych metrykach można przeczytać w dokumentacji Core Web Vitals.

Efekt jest praktyczny: Mieszkaniec, który chce sprawdzić harmonogram odbioru albo znaleźć kontakt, nie powinien czekać kilku sekund, aż strona łaskawie pokaże treść. Przy serwisie miejskim, szybkość to element użyteczności.

WordPress do samodzielnej obsługi

Jednym z ważnych założeń wdrożenia była samodzielna obsługa treści po stronie MZUK. Strona miejska żyje tylko wtedy, gdy można ją aktualizować bez stresu i bez angażowania wykonawcy.

Dlatego wdrożenie nie kończyło się na publikacji. Przygotowaliśmy strukturę, która pozwala pracownikom zarządzać aktualnościami, pilnymi ogłoszeniami, bazą odpadów do segregacji, treściami statycznymi, mediami i podstawowymi ustawieniami SEO. To jest często niedoceniany element projektu.

W tym projekcie WordPress został wykorzystany dokładnie tam, gdzie ma sens: jako system do wygodnego zarządzania treścią, a nie jako przypadkowy zestaw wtyczek do wszystkiego.

SEO techniczne i przekierowania: żeby nowa strona nie zgubiła starego ruchu

Modernizacja strony internetowej to moment, w którym łatwo narobić szkód w Google. Zmieniają się adresy URL, struktura menu, nagłówki, treści, linkowanie wewnętrzne i układ podstron. Jeśli zrobi się to bez planu, nowa strona może wyglądać lepiej, ale stracić widoczność, którą miała wcześniej.

Dlatego w projekcie MZUK ważną częścią prac było SEO techniczne: uporządkowanie struktury, metadanych, mapy strony, przekierowań 301 i analityki. Nie chodziło o agresywne pozycjonowanie pod przypadkowe frazy, tylko o to, żeby serwis był poprawnie zrozumiały dla Google i nie gubił użytkowników trafiających jeszcze ze starych adresów.

Rezultat: szybki, dostępny i uporządkowany serwis miejski

Po wdrożeniu, MZUK otrzymał stronę, która jest znacznie bliżej realnych potrzeb mieszkańców. Najważniejsze informacje są łatwiejsze do znalezienia, struktura usług jest czytelniejsza, a redakcja ma narzędzia do publikowania aktualności i komunikatów bez walki z technologią.

Najważniejsze efekty projektu:

• 96/100 PageSpeed Mobile
• zaliczone Core Web Vitals
• Dostępność WCAG 2.2 od podstaw
• rozbudowana struktura treści dla wielu działów
• wyszukiwarka segregacji odpadów
• system ogłoszeń i komunikatów
• harmonogram odbioru i szybkie ścieżki kontaktu
• WordPress przygotowany do samodzielnej obsługi przez redakcję

Największa zmiana polegała na tym, że serwis zaczął lepiej odpowiadać na konkretne potrzeby mieszkańców.

Czego uczy ten projekt?

Cyfrowy Sprint dla MZUK dobrze pokazuje, że strona instytucji albo spółki miejskiej nie może być traktowana jak zwykła wizytówka dla mikroprzedsiębiorcy. Tu nie wystarczy strona główna, kilka zdjęć i formularz kontaktowy. Potrzebna jest architektura informacji, dostępność, wydajność, zgodność z przepisami i prosta redakcja treści i sensowne ścieżki dla użytkowników, którzy często przychodzą po jedną konkretną rzecz.

Właśnie dlatego projektowanie stron WordPress dla takich organizacji wymaga innego podejścia niż prosta strona firmowa. Trzeba myśleć nie tylko o tym, jak strona wygląda dzisiaj, ale też o tym, jak będzie działać po kilku latach publikowania aktualności, ogłoszeń, dokumentów i kolejnych podstron.

Masz stronę, która nie nadąża za Twoją organizacją?

Jeśli Twoja strona jest wolna, chaotyczna, trudna do edycji albo użytkownicy ciągle pytają o rzeczy, które powinny być jasne po wejściu na stronę, warto zacząć od audytu.

Sprawdzimy gdzie faktycznie ucieka użyteczność, szybkość i widoczność. Potem można zdecydować, czy wystarczy uporządkowanie obecnej strony, czy potrzebna jest pełna modernizacja.

Napisz do BezLaga i opowiedz, co nie działa na Twojej stronie – a My zajmiemy się resztą.