Strona dla pedagoga wokalnego: jak powstało mimusiq.com

Mi Musiq to pracownia pedagoga wokalnego z Poznania, prowadzona przez nauczycielkę, która łączy lekcje śpiewu dla dzieci i dorosłych z logopedią i sesjami metodą Yagera. Klientka miała już swoją stronę, ale nie była ona przystosowana pod SEO i wizualnie odbiegała od aktualnych standardów. Zgłosiła się do nas z konkretnym celem: nowoczesny design, szybsze wczytywanie strony i lepsza widoczność w wyszukiwarce.

Czego potrzebowała strona

Punktem wyjścia było jasne przedstawienie trzech różnych usług, które na pierwszy rzut oka mogą się mylić: lekcji śpiewu dla dzieci i dorosłych, zajęć logopedycznych oraz sesji prowadzonych metodą Yagera. Każda z nich ma inną grupę odbiorców i inny sposób pracy, więc strona musiała je rozdzielić, zamiast wrzucać wszystko na jedną listę, w której trudno się połapać, czym jedna usługa różni się od drugiej.

Drugim wymaganiem był czytelny kontakt: odwiedzający miał od razu widzieć, jak umówić się na zajęcia, bez przeszukiwania całej strony w poszukiwaniu numeru telefonu czy adresu. Trzecim, równie ważnym punktem, był nowoczesny design w miejsce starej strony, razem z szybkim wczytywaniem i podstawami pod lepsze SEO, czyli dokładnie tym, czego brakowało w poprzedniej wersji.

Ostatnim elementem zakresu była samodzielna edycja treści: dedykowany panel CMS, w którym klientka sama zmienia opisy zajęć, godziny i inne informacje, bez znajomości kodu, bez czekania na naszą odpowiedź i bez pisania do nas za każdą drobną poprawką.

Jak to rozwiązaliśmy

Układ strony zbudowaliśmy wokół trzech usług jako osobnych sekcji, z krótkim opisem i osobnym wezwaniem do kontaktu przy każdej z nich. Strona główna prowadzi odwiedzającego od razu do tego, czego szuka, zamiast zmuszać go do przewijania długiego tekstu w poszukiwaniu odpowiedzi.

W górnym menu, widocznym na pierwszym zrzucie, są wszystkie kluczowe miejsca: strona główna, oferta i cennik, sekcja o pedagożce, blog i kontakt. Dzięki temu odwiedzający nie musi szukać, gdzie kliknąć, żeby dowiedzieć się więcej albo zapisać się na zajęcia.

Sekcja usług pokazuje lekcje śpiewu, logopedię i metodę Yagera obok siebie, z osobnym opisem dla każdej z nich. Dzięki temu osoba, która szuka konkretnie logopedy, nie musi czytać o metodzie Yagera, żeby trafić do właściwej informacji. Pod usługami są kafelki z orientacyjnym cennikiem i linkiem „Dowiedz się więcej" przy każdej z nich, a niżej przycisk prowadzący do pełnej oferty oraz sekcja „O mnie" z opisem wykształcenia i doświadczenia pedagożki.

Na wersji mobilnej ten sam układ zwija się do jednej kolumny: logo i menu w formie rozwijanej listy na górze, potem nagłówek „Odkryj piękno swojego głosu" z krótkim opisem oferty, a pod nim dwa przyciski: „Wybierz zajęcia dopasowane do Twoich potrzeb" i „Zobacz ofertę".

Dzięki takiemu układowi na telefonie najważniejsza informacja i wezwanie do działania są widoczne od razu, bez przewijania całej strony głównej w poszukiwaniu przycisku kontaktu.

Nad szybkością wczytywania i SEO pracowaliśmy równolegle z warstwą wizualną, bo to był drugi zgłoszony problem starej strony. Stronę zbudowaliśmy w Next.js i TypeScript, tej samej technologii, w której stawiamy większość naszych realizacji.

Dane kontaktowe i formularz zapisu umieściliśmy w miejscu, do którego prowadzą wszystkie sekcje usług, więc niezależnie od tego, którą ofertę odwiedzający przeczyta jako pierwszą, ścieżka do zapisu jest ta sama.

Za edycję treści odpowiada panel CMS. Klientka loguje się do niego samodzielnie i zmienia opisy zajęć, godziny albo dodaje nową usługę bez naszej pomocy i bez znajomości programowania, bez limitu zmian i bez dodatkowych opłat za każdą edycję. Do tego dochodzi opieka techniczna: hosting, certyfikat SSL, kopie zapasowe i bieżące aktualizacje są częścią abonamentu, więc klientka nie musi się nimi zajmować sama.

Efekt

Strona działa pod adresem mimusiq.com i każdy może ją zobaczyć na żywo. Od przekazania materiałów do publikacji minęło około 3 dni robocze. Klientka ma teraz nowoczesny design w miejsce starej strony, podstawy pod lepsze SEO i szybsze wczytywanie, wersję mobilną działającą tak samo dobrze jak wersja na komputer oraz panel CMS, w którym samodzielnie aktualizuje treści bez naszej pomocy.

Ile kosztuje taka strona

Strona w podobnym zakresie, wizytówka z opisem usług i kontaktem albo wersja z dodatkowymi podstronami i blogiem, mieści się zwykle w pakiecie START lub FIRMA z naszej standardowej oferty abonamentowej. Dokładne ceny i to, co obejmuje każdy pakiet, w tym hosting, panel CMS i opiekę techniczną, znajdziesz na stronie ile kosztuje strona internetowa oraz przy opisie stron internetowych w abonamencie.