Pracownia Geodezyjna - Strona internetowa dla geodety z interaktywną mapą

Wyzwanie

Strona pracowni wyglądała jak sprzed kilkunastu lat. Kto wchodził z telefonu, musiał przewijać ścianę tekstu, żeby znaleźć numer. Żeby sprawdzić, czy geodeta dojedzie do jego działki, musiał przeczytać całą listę miejscowości. Usługi, od map do celów projektowych po pomiary przemieszczeń, były opisane w jednym długim tekście, więc żadna z nich nie miała szans pojawić się osobno w wynikach wyszukiwania.

Projekt graficzny: strona, która wygląda jak praca geodety

Hero z mapą warstwicową

Zamiast zdjęcia ze stocka całe tło pierwszej sekcji to fragment mapy: warstwice, siatka współrzędnych z opisanymi stopniami i minutami, punkt osnowy oraz działka z ponumerowanymi punktami granicznymi i przerywaną linią podziału. Warstwice nie są obrazkiem. Generujemy je w kodzie, tak żeby każda kolejna linia była trochę większa i przesunięta jak zbocze wzniesienia, a linie nigdy się nie przecinały. Po lewej stronie mapa łagodnie się wygasza, więc nagłówek i przyciski pozostają czytelne.

Paleta i typografia

Kolory wzięliśmy z papierowych map: ciepły, papierowy beż jako tło, oliwkowy i zielony jako kolory marki oraz rdzawy akcent do wyróżnień. Ciemna zieleń domyka stronę w stopce. Treść składamy krojem IBM Plex Sans, a współrzędne, numery punktów i drobne etykiety krojem IBM Plex Mono. Ten techniczny, „pomiarowy” krój od razu kojarzy się z dokumentacją geodezyjną.

Logo i ikony

Logo dostało prosty znak w kwadracie z celownikiem i nazwę złożoną zwykłym tekstem, więc jest ostre na każdym ekranie. Ikony pochodzą z jednego spójnego zestawu (Tabler Icons) i są wstawiane jako wektory, bez dodatkowych plików.

Układ i rytm

Każda sekcja strony głównej zajmuje mniej więcej jeden ekran, a menu przewija do nich płynnie. Kluczowa liczba, rok rozpoczęcia działalności, jest duża, w kolorze marki. Kroki współpracy pojawiają się po kolei, raz, gdy sekcja wjeżdża na ekran, i pokazują przebieg zlecenia od telefonu do gotowej dokumentacji.

Funkcje, które skracają drogę do zlecenia

• Wyszukiwarka obszaru działania. Klient wpisuje miejscowość i od razu widzi, czy jest w zasięgu. Wyszukiwarka ignoruje polskie znaki i wielkość liter, więc „lesna” znajdzie „Gmina Leśna”.
• Kontakt w jednym widoku: telefony, adres, mapa dojazdu i krótki formularz zapytania. Mapa wczytuje się dopiero, gdy klient do niej przewinie, więc nie spowalnia strony.
• Przycisk „Zadzwoń” na telefonie zawsze pod kciukiem, niezależnie od tego, gdzie jest użytkownik.

SEO: każda usługa ma szansę na własne miejsce w Google

• Osobne podstrony usług geodezyjnych: mapy do celów projektowych, tyczenie budynków i inwentaryzacja, podziały działek, geodezja inżynieryjna i uzgodnienia sieci. Każda ma własny tytuł i opis pod frazy, które wpisują klienci, np. „mapa do celów projektowych” czy „podział działki”.
• Najczęstsze pytania na podstronach, oznaczone jako FAQ w danych strukturalnych, więc mogą trafić bezpośrednio do wyników wyszukiwania.
• Dane strukturalne firmy, usług i okruszków nawigacji, dzięki którym Google wie, kto świadczy usługi, jakie i na jakim obszarze.
• Lista obsługiwanych dzielnic i gmin jako zwykły tekst na stronie, która wzmacnia widoczność w lokalnych wyszukiwaniach.
• Mapa strony i lekki, statyczny kod, dzięki czemu strona szybko się wczytuje, także na telefonie.

Efekt

Strona w końcu odpowiada na pytania, z którymi klient przychodzi: co robicie, czy do mnie dojedziecie i jak się z wami skontaktować. Przy tym od pierwszego ekranu wygląda jak praca geodety, a nie jak kolejna firmowa wizytówka.