Jak wygląda proces tworzenia strony WWW?

Dlaczego strona internetowa za 500 zł to za mało?

Umówmy się strona za 500 zł to głównie zainstalowanie gotowego szablonu, instalacja podstawowych wtyczek i to wszystko na hosting. Jakoś działa, coś na niej jest, ale czy sprzedaje? Nie sądzę.

Profesjonalne tworzenie stron www to jest proces. Strona informacyjna, landing page sprzedażowy, czy portfolio fotografa to są całkowicie inne strony z innymi celami. Wyobraź sobie onet z dużymi pięknymi zdjęciami, małą ilością treści, ale z subtelnymi animacjami. Wszystko wygląda pięknie, atrakcyjnie. Strona jest dziełem sztuki… no raczej nie wyciągniesz z tego informacji o pogodzie.

Jak zaczyna się proces projektowania strony internetowej?

Jak już wiesz cel strony jest najważniejszy, bo strona www ma różne właściwości. Dlatego dzisiaj przejdziemy wspólnie przez proces projektowania strony www. Krok po kroku, abyś zrozumiał (zrozumiała) jak to na prawdę działa.

Krok 1: Konsultacja oraz ustalenie celu strony www

Moim zdaniem, krótka rozmowa to podstawa. W tym momencie nie rozmawiamy o pieniądzach tylko o potrzebach. Podczas takiej 10 minutowej rozmowy dowiadujemy się czego potrzebujesz. Jakie masz logo firmy, kolory. Poznajemy Twoją konkurencję, warto abyś miał(a) przygotowane kilka stron, które Ci się podobają oraz kilka takich, które absolutnie Ci nie pasują.

Oczywiście strona internetowa ma swój cel i budujemy ja dla klienta, aby konkretny cel wykonał, jednak to nie oznacza, że strona ma Ci się nie podobać. Uważamy, że argument: „Strona jest dla użytkownika, a nie dla właściciela” jest lekko przeraklamowane i trzeba zachować w nim umiar.

Dobrze, żeby nie lać wody. Przyjmijmy, że zgłosiła się do nas właścicielka salonu fryzjerskiego w Toruniu. Już wiemy, że korzysta z instagrama, facebooka, mapy google oraz booksy. Jednak klienta też wie, że najlepszym miejscem na pokazanie takiej skondensowanej oferty jest strona internetowa. W gąszczu realizacji zdjęć na IG w końcu giną informacje o przebytych szkoleniach i nowych umiejętnościach. Jednak zależy jej też na tym, aby łatwo umówić się na wizytę.

Także ustaliliśmy cel: Umówić się na wizytę oraz zaprezentować ofertę usług. Cel ustalony, wszystkie informacje zapisane w dokumencie to idziemy dalej.

Krok 2: Dobór narzędzi, układu oraz palety kolorów

Ustaliliśmy z klientka, że na stronę ruch będzie kierowany z mapy google oraz drobnych reklam i nie chcemy tworzyć rozbudowanej oferty wraz z opisami i blogiem pod SEO, aby nałapać treści. Dlatego wykorzystamy układ strony w stylu landing page.

Dostaliśmy logo i zapewniamy spójność wizualną salonu z stroną. Co to oznacza? W dużym skrócie dla salonu fryzjerskiego, który utrzymuje się w kolorach premium: czarny i złoty nie damy różowej strony. Chociaż róż pasuje do salonu kosmetycznego, bo jednak sugeruje taką delikatność, kobiecość. To nie, dla salonu premium w czerni i złocie nie da rady. Możesz sobie poszukać teraz narzędzia Adobe Color, która świetnie dobiera kolorystykę strony. Polecam się pobawić!

Krok 3: Projektowanie strony WWW

To co wiemy: Logo jest zawsze z lewej strony, menu na równi z logiem. Jeśli mówimy o stronie na telefon to wiemy, że jest tak zwany burger do otworzenia menu. Tutaj ciekawostka 80% użytkowników przegląda teraz internet przez telefon i to właśnie pod te urządzenia robimy strony. Jeśli musi być zoptymalizowan pod urządzenia mobilna – czyli responsywna.

No i dalej klasycznie wypracowanym modelem marketingowym AIDA:

• A – Attention (uwaga) – przyciągnięcie uwagi klienta do produktu
• I – Interest (zainteresowanie) – zainteresowanie klienta właściwościami produktu.
• D – Desire (pożądanie) – przekonanie klienta, że produkt jest mu potrzebny i może zaspokoić jego potrzeby.
• A – Action (działanie) – właściwe przekonywanie klienta do zakupu tego właśnie produktu.

I szczerze tutaj nie ma dużego pola do popisu, bo to są sprawdzone schematy i tutaj nie ma miejsca na kreatywność. Jeśli chcemy mieć kreatywną sprzedającą stronę to mówimy o wielomiesięcznej pracy, co w wypadku klasycznego landing page jest nieopłacalne.

Czyli jak działa ten model?

Działanie modelu jest bardzo proste. Ustalając wstępne treści wręcz automatycznie tworzy nam się wizualny układ strony.

Sekcja HERO – przyciągamy uwagę

To pierwsze, co widzi klientka. Musi być krótko i w punkt.

• Hasło: „Błyszczysz tam, gdzie inni tylko obserwują. Zarezerwuj wizytę teraz i bądź gotowa na niezapomniany wieczór.”
• Przycisk: „Zarezerwuj termin” – od razu dajemy jasny sygnał do działania.

W tem sposób mamy literkę A ogarniętą. Skierowaliśmy uwagę oraz od razu wezwaliśmy do działania – tak zwane CALL TO ACTION (CTA). Zdecydowane klientki, które wchodzą od razu sobie w to klikną, ale trzeba przekonać też inne.

Budujemy zaufanie i zainteresowanie

Jak zdobyć zaufanie? Pokażemy salon, Ciebie, Twoje certyfikaty. Zwykłe zdania na temat np miejsca. Jesteśmy salonem w sercu Torunia, przy starówce. Czekając, aż farba złapie, możesz podziwiać panoramę Wisły przy pysznej kawie. Czy O Twoje włosy zadbają certyfikowani specjaliści. Dobrze to akurat zabrzmiało bardziej po naszemu informatycznemu 😉 Jednak przedstawiamy się, pokazujemy że jesteśmy dobrzy w tym co robimy.

Czyli pokazaliśmy fajny lokal z fajnymi osobami, które robią fajne rzeczy – jest zainteresowanie!

Wzbudzamy pożądanie

Jeśli usług jest mało – stosujemy układ: obrazek + opis na przemian (lewa/prawa). Jeśli dużo – robimy czytelną listę z rozwijanym opisem, by nie przytłoczyć treścią.

To jest też dobre miejsce na wstawienie naszych dzieł – przed i po. Fajnie wygląda i pokazuje realne przykłady. To działa bardzo dobrze. Jeszcze, aby podkręcić to pożądanie wstawmy opinie (social prof), niech wyglądają jak posty z Instagrama. Czyli znowu sprawdzony utarty schemat, który każdy zna.

Oczywiście pod tymi sekcjami konsekwetnie powtarzamy przycisk „Zarezerwuj termin”. Pamiętajmy cały czas o naszym celu – rezerwacji. Unikamy przekierowania ludzi na instagrama, bo uciekną popatrzą na nasze filmiki, a po chwili zaczną oglądać pieski.

Czas na akcje (rezerwacje na stronie WWW)!

No klientki wytrwały aż do tego momentu, czyli już jesteśmy praktycznie w domu. Skupiamy się na integracji z Booksy. Żeby nieco zmotywować niezdecydowaną klientkę, możemy dodać informację: „Pospiesz się, ostatnie wolne terminy w grudniu!”. Świadomość, że miejsca znikają (zwłaszcza przed świętami), działa mobilizująco. Taka informacja oczywiście też ma swoją nazwę marketingową FOMO.

Teraz powiem Ci żart – jak Ci pokazałem ten model to będziesz go widzieć na każdej stronie internetowej

Stopka – czyli podsumowanie wszystkich informacji

No i tutaj robimy takie streszczenie podstawowych informacji: godziny otwarcia, dane kontaktowe, mapka, może wrzucimy tutaj też widget z aktualnościami z Instagrama? Tutaj jak uciekną to już nic się nie stanie. Ominęły nasze działanie i potrzebują więcej dowodów słuszności 😉

Gdzie ten grafik?

Opisując tą już jesteśmy w stanie stworzyć ładną stronę, która dowiezie cel. Jednak jest ona prosta i brakuje jej takiego efektu WOW. W tym miejscu dopiero my wpuszczamy grafika (no chyba, że akurat współpracujemy z grafikiem UX designerem, to dopiero on nas wpuszcza po tym kroku – no ale to detal). Grafik jak już zna układ, który prowadzi naszą klientkę przez cały proces od prezentacji oferty po rezerwację usługi – wieć też ma uproszczone zadanie. Układa te wszystkie elementy w idealnie skomponowaną całość, która przyciąga oko. Chociaż ostatnio nawet dałem taką stronę z tym układem klientowi i mu się na tyle spodobała, że dopieścilismy kilka detali i grafik nie miał co robić i go nie wpuściliśmy 😉

Krok 5: Wdrożenie

Tutaj już wchodzi bardzo dużo technikaliów, dlatego nie będę się rozpisywać. W dużym skrócie. Gdy nasza właścicielka salonu kosmetycznego z Torunia uznała, że projekt jej się podoba to wchodzą programiści, którzy z obrazka lub po prostu takiego prostego dokumentu z układem tworzą stronę internetową. W tym momencie trzeba sprawdzić sporo dodatkowych technikaliówtaki jak:

• Optymalizacja obrazków
• Podstawowe SEO strony
• Testy strony na różnych przeglądarkach i telefonach.
• Optymalizacje ładowania strony
• Zabezpieczenie systemu edycji treści

No i taką listę jeszcze można by długo robić. Następnie jest szkolenie i gotowe – Twoja wizytówka internetowa jest w internecie 😉 Teraz możemy robić różnego rodzaju automatyzacje, aby np zapytania z formularza kontaktowego automatycznie wpadały do systemu CRM. Jednak to nie wątek o tym.

Jak widzisz, stworzenie strony jest długim procesem, który tylko z wierzchu wygląda na prosty i szybki. Wymaga strategii, wyczucia i wiedzy technicznej. Jeśli potrzebujesz strony, która nie tylko „jest”, ale pracuje na Twój biznes – zapoznaj się z naszą ofertą na tworzenie stron i sklepów internetowych i skontaktuj się z nami. Wspólnie przejdziemy przez ten proces.