Strona internetowa NEW MBK – transport jachtów i ładunków ponadnormatywnych
To realizacja strony internetowej dla NEW MBK sp. z o.o. z Olecka, firmy transportowej specjalizującej się w transporcie jachtów oraz ładunków ponadnormatywnych. Zaprojektowaliśmy i wdrożyliśmy serwis WordPress, który prezentuje ponad 25 lat doświadczenia firmy i zakres transportów realizowanych w Polsce, Unii Europejskiej oraz Skandynawii.
Projekt i wdrożenie strony internetowej
Celem było uporządkowanie informacji o usługach i ułatwienie kontaktu w sprawie wyceny transportu. Struktura obejmuje stronę główną oraz podstrony usług, realizacji, o firmie, kontaktu i zapytania o wycenę. Przygotowaliśmy indywidualny projekt graficzny w Figmie, a następnie zbudowaliśmy na jego podstawie autorski motyw WordPress, wykorzystując Tailwind CSS oraz czysty JavaScript bez zewnętrznych bibliotek.
Prezentacja usług transportowych
Na stronie pokazaliśmy cztery obszary działalności NEW MBK: transport jachtów, transport ponadnormatywny, spedycję i logistykę oraz produkcję naczep Krollseg w Olecku. Główną częścią serwisu jest transport jachtów żaglowych i motorowych dla producentów, stoczni, dealerów, klientów prywatnych oraz na targi i wystawy. Podstrony usług zawierają m.in. listę marek jachtów, rodzaje ładunków ponadnormatywnych, oś czasu historii firmy i karuzelę wybranych realizacji.
Kreator zapytania o wycenę transportu
Najważniejszą funkcją serwisu jest kreator zapytania o wycenę. Formularz podzieliliśmy na kroki, dodaliśmy pasek postępu i walidację pól. Użytkownik wybiera na początku „Jachty i łodzie” albo „Inne ładunki”, a następnie otrzymuje właściwy zestaw pytań. Dla jachtów są to m.in. model, wymiary, waga, długość masztu i rodzaj kilu. Dalsze kroki obejmują trasę, planowany termin oraz do trzech załączników. Obok formularza dodaliśmy podpowiedź, jak mierzyć wymiary jachtu.
Wersja polska i angielska
Serwis działa w dwóch wersjach językowych, przygotowanych w Polylang. Wdrożyliśmy przełącznik języka, znaczniki hreflang oraz unikalne opisy meta dla każdej podstrony w obu językach.
Pozycjonowanie SEO i dostępność
Przy wdrożeniu zadbaliśmy o elementy ważne dla pozycjonowania: jeden nagłówek H1 na stronę, poprawną hierarchię nagłówków, semantyczny HTML5, okruszki nawigacyjne i dane strukturalne JSON-LD dla LocalBusiness, Service oraz BreadcrumbList. Dodaliśmy też link „Przejdź do treści”, menu mobilne obsługiwane klawiaturą, teksty alternatywne obrazów i komunikaty formularza czytelne dla czytników ekranu.
WordPress
Treści sekcji są edytowalne z panelu dzięki ACF Pro, a formularze obsługuje Contact Form 7. Przygotowaliśmy responsywny układ dla telefonów, pływający przycisk „Zadzwoń”, szybki dostęp do zapytania o wycenę, mapę Google na stronie kontaktowej, animacje sekcji oraz baner zgód cookie z podziałem na kategorie. To przykład tego, jak realizujemy strony internetowe dla firm z rozbudowaną ofertą usług.
Zakres prac przy tworzeniu strony internetowej
- przygotowanie indywidualnego projektu graficznego w Figmie,
- wdrożenie autorskiego motywu WordPress na podstawie tego projektu,
- programowanie widoków w Tailwind CSS,
- przygotowanie czystego JavaScript bez zewnętrznych bibliotek,
- konfiguracja ACF Pro do edycji treści sekcji,
- wdrożenie wersji polskiej i angielskiej w Polylang,
- budowa kreatora zapytania o wycenę transportu,
- konfiguracja formularzy Contact Form 7,
- przygotowanie podstron usług, realizacji, o firmie i kontaktu,
- optymalizacja SEO on-site i wdrożenie danych JSON-LD,
- wdrożenie elementów dostępności i responsywnego menu,
- wdrożenie banera cookie z podziałem na kategorie,
- dodanie mapy Google, animacji sekcji i pływającego przycisku „Zadzwoń”.