Formularze na stronie www

Istnieją dwa rodzaje stron docelowych: te z formularzami (lead capture) i te bez nich (click-through). Drugi rodzaj stron zamiast formularza wykorzystuje przycisk akcji (Call to Action CTA).

Jednak nawet jeśli nie ma formularza początkowego na stronach kliknięć
(click-through), jest prawdopodobne, że w końcu się pojawi w późniejszym czasie – na przykład podczas tworzenia konta lub rejestracji do newslettera.

Bez nich segmentacja (podział) klientów i dostosowywanie komunikatów do ich indywidualnych potrzeb byłyby niemożliwe.

Każdy zapewni Ci nieco inne korzyści. Wybór najlepszego z nich zależy od okoliczności.

Formularz wieloetapowy rozbija długą formę formularza jednoetapowego na wiele kroków, z których każdy zawiera od trzech do czterech pól.

Ta technika wykorzystuje psychologię behawioralną.

Sprowadza się do zadawania najpierw łatwych pytań i pozostawienia tych trudniejszych na koniec.

Jeśli skłonisz ich do wykonania pierwszego kroku, z dużym prawdopodobieństwem dotrą do końca i podadzą Ci tak onieśmielające i wywołujące zazwyczaj opór dane jak: numer telefonu, czy adres e-mail.

Jednak, jeśli oferujesz klientom coś o stosunkowo małej wartości, np. przewodnik lub ebook, lepiej sprawdzi Ci się formularz jednoetapowy.

Będziesz potrzebował wtedy małej ilości pól i bez sensu jest je dzielić na etapy.

W każdej innej standardowej stronie internetowej (np. oferującej darmowy okres próbny, konsultację, sprzedaż) formularze wieloetapowe konwertują lepiej.

Przy stosowaniu formularzy wieloetapowych pomocne jest dołączenie do nich wskaźników postępu.

Pomagają one odwiedzającym zrozumieć, w którym miejscu formularza się znajdują i ile czasu pozostało im do jego ukończenia.

Paski postępu mogą mieć różną formę.

1. Procenty.

2. Numerowane kroki.

3. Nieponumerowane etapy.

Wskaźniki postępu mogą odczuwalnie zwiększyć ilość dokończonych formularzy i zmniejszyć liczbę odrzuceń. Korzystaj z nich za każdym razem.

Istotne jest również maksymalne ułatwienie użytkownikom przełączania się między poszczególnymi etapami. Daj im możliwość pójścia dalej i powrotu bez wysiłku.

Nie musisz umieszczać formularza bezpośrednio na swojej stronie internetowej.

Masz jeszcze dwa wyjścia, które pomogą Ci zachęcić odwiedzających do wykonania pierwszego kroku. Wtedy zrobienie kolejnego stanie się łatwiejsze.

Możesz umieścić na stronie przycisk CTA, który po kliknięciu przekieruje Twoich odbiorców do formularza w wyskakującym okienku.

Jeżeli wyskakujące okienko nie jest szczytem Twoich marzeń i nie chcesz go na swojej stronie, masz jeszcze jedną opcję.

Możesz wysłać użytkowników po kliknięciu w przycisk CTA na dedykowaną stronę konwersji.

Jej skuteczność przebadał Hubspot.

Może się wydawać, że to niewiele, ale przy tysiącach wizyt to daje setki konwersji więcej.

Na bazie badań i własnych doświadczeń stworzyliśmy dla Ciebie szablon, z którym tworzenie formularza dla własnej firmy stanie się dużo prostsze.

Pokażemy Ci o czym pamiętać tworząc formularz kontaktowy WordPress i formularze w innych technologiach.

W FORMULARZU JEDNOKOLUMNOWYM wszystkie pola są ułożone w jednej linii prostej, od góry do dołu.

DWUKOLUMNOWY posiada dwie kolumny pól w rzędach od góry do dołu.

FORMULARZ HYBRYDOWY to taki, który posiada zarówno pojedyncze jak i podwójne kolumny.

Bardzo długo panowała opinia, że formularze jednokolumnowe są zawsze najkorzystniejszą opcją. Jednak nowsze badania pokazują, że wcale tak nie musi być.

Stało się tak dlatego, że testowany formularz składał się z wielu pól i w wersji jednokolumnowej był przytłaczający. Wydawał się bardzo długi. Za to w wersji dwukolumnowej był odbierany jako krótszy.

Zasada jest prosta:

Formularze z 10 i więcej polami zaserwuj użytkownikom w formie dwukolumnowej. A jeśli zależy Ci na jeszcze lepszych wynikach, przemyśl formularz wieloetapowy.

Tu pojawia się kluczowe pytanie: Ile pól formularza powinieneś zawrzeć na swojej stronie?

Większość formularzy ma od trzech do sześciu pól.

To, ile pól powinien liczyć Twój, zależy od kontekstu.

To prawda, że krótsze formularze zazwyczaj prowadzą do wyższych konwersji – ale nie zawsze.

Skracanie na siłę swoich formularzy bywa niebezpieczne.

Postępując w ten sposób zostawisz same “niewygodne” pytania o wrażliwe dane typu: adres e-mail, numer telefonu, imię i nazwisko. Opór przed ich podaniem może skutecznie pozbawić Cię konwersji.

W najlepszym wypadku ryzykujesz, że użytkownik uzna dane, o jakie go prosisz za niewystarczające, żeby otrzymać od Ciebie coś dla niego prawdziwie wartościowego.

Co masz więc zrobić ze swoim formularzem, dodać pola czy je usunąć?

Dodatkowo weź pod uwagę jeszcze 2 kryteria.

KRYTERIUM 1. Cel formularza.

Subskrypcja newslettera lub rejestracja na webinar wymaga mniejszej ilości pól niż formularz generowania leadów. Bierz pod uwagę cel konwersji.

KRYTERIUM 2. Jakość kontaktów.

Prawda jest taka, że dłuższy formularz jest w stanie dostarczyć Ci kontakty do lepszych potencjalnych klientów (leadów). Lepszych to znaczy bardziej gotowych i zmotywowanych do kupowania.

Pola wymagane i opcjonalne.

Jeśli nie – wyeliminuj je.

Jeżeli tak – zadbaj, aby były jak najmniej obciążające dla użytkowników i nie sprawiały, że formularz zacznie przytłaczać swoim wyglądem i objętością.

Wystarczy, że zastosujesz się do kilku zasad.

Odwiedzający oczekują, że Twoja strona będzie przestrzegać tych samych podstawowych reguł, co inne witryny.

Każde odstępstwo może zakłócić model mentalny, który zdążyli już sobie wypracować Twoi odbiorcy.

Etykiety przy każdym polu informują użytkownika, jakie informacje powinny znaleźć się w danym okienku. Mogą być umieszczone nad, obok lub wewnątrz pól formularza.

Pozwala to na łatwe i szybkie wypełnienie formularza. Takie etykiety konwertują lepiej.

Tego typu etykiety sprawdzają się bardzo dobrze w krótkich formularzach, a szczególnie kiedy prosisz tylko o podstawowe dane typu: imię i adres e-mail.

W dłuższych i bardziej złożonych formularzach etykiety wewnątrz pól mogą być utrudnieniem dla użytkowników.

Po kliknięciu na pole, te etykiety znikają i aby sprawdzić, o czym dokładnie informowały, trzeba usunąć cały wpis.

Etykiety z lewej strony, podobnie jak te umieszczane u góry, nie wymagają od użytkowników zbyt wiele wysiłku.

Bez względu na to, który układ etykiet wybierzesz musisz pamiętać jeszcze o kilku kwestiach.

Po pierwsze, pogrubienia w etykietach utrudniają czytanie, nie stosuj ich.

Po drugie, upewnij się, że pomiędzy polami formularza a etykietami jest wystarczająco dużo białej przestrzeni.

Po trzecie, etykiety umieszczaj blisko pól, aby nie było wątpliwości, do których z nich się odnoszą.

Pamiętaj też o odpowiednim wyrównaniu tekstu, żeby odwiedzający nie męczyli się uzupełnianiem Twojego formularza.

Jeśli etykiety są umieszczone po lewej stronie, wyrównaj je do prawej, a jeśli są na górze lub wewnątrz pól, wyrównaj je do strony lewej.

Tekst zastępczy to podpowiedź, opis lub przykład umieszczony w polu formularza (zwykle w kolorze jasnoszarym), który znika, gdy ktoś zacznie pisać.

Faktycznie, często dodatkowe instrukcje są pomocne, jednak nie w formie tekstu zastępczego. W takich sytuacjach lepiej sprawdza się umieszczenie podpowiedzi pod górną etykietą.

Jak zawsze są jednak wyjątki od tej reguły. Jeżeli Twój formularz oferuje dziesiątki opcji do wyboru (np. wybór kraju), nie ma sensu umieszczać ich w formie przycisków opcji. To z pewnością nie odciąży użytkowników. Wręcz przeciwnie!

W tym konkretnym przypadku przyciski rozwijane działają zdecydowanie lepiej.

Upewnij się, że wykorzystywane przez Ciebie CTA oferuje użytkownikom KORZYŚĆ.

Unikaj ogólnych sformułowań, takich jak: "Prześlij" lub "Rozpocznij". One sugerują wysiłek, a to zniechęca do podjęcia działania.

Przycisk CTA powinien kontrastować z kolorem tła, aby przyciągnąć uwagę i zwiększyć konwersję.

Jest ważny, ponieważ zwiększa prawdopodobieństwo, że klienci kupią Twój produkt lub usługę.

Działa on tak dobrze, ponieważ ludzie często szukają inspiracji u innych, gdy są niepewni swojego wyboru.

Możesz wykorzystać dowód społeczny na swojej stronie w różnych miejscach, m.in. w formularzu, w sekcji z opiniami, w górnej części strony (above the fold), w pobliżu przycisku CTA i wszędzie tam, gdzie uznasz, że jest potrzebny.

Zazwyczaj social proof ma formę: referencji, ocen gwiazdkowych, loga klientów, nagród, ilości zrealizowanych projektów etc.

Wyzwalacze umieszcza się pod lub wokół formularza i przycisku CTA.

Przykładowo, ContentVerve odnotował 87% wzrost liczby subskrypcji newslettera dzięki dodaniu do formularza wyzwalaczy, w formie punktów z korzyściami.

Mamy dla Ciebie jeszcze kilka wskazówek na to, co zrobić, żeby wszystkie elementy formularza na stronie www były na tyle mocne, by dostarczyć Ci wielu potencjalnych klientów.

Microcopy to małe fragmenty treści, używane do instruowania lub informowania odwiedzających w obrębie Twojego formularza.

Mogą mieć ogromny wpływ na konwersję formularzy.

Microcopy obejmuje m.in. takie elementy jak: wyzwalacze kliknięć, etykiety pól, komunikaty o błędach.

Przykładowo, jeśli prosisz o podanie numeru telefonu, możesz w microcopy wyjaśnić, po Ci on. Wielu użytkowników może uznać tę informację za zbędną i porzucić formularz kontaktowy, a tego nie chcesz.

Powiedz im o tym, aby uniknąć nieufności i rezygnacji.

Formularz automatycznego wypełniania wykorzystuje dane z przeglądarki odwiedzających w automatycznym wypełnieniu pól. Zazwyczaj obejmuje taki dane jak: imię i nazwisko, numer telefonu, dane karty kredytowej i adres.

Takie ułatwienia dobrze działają na konwersję.

Stosując autoformatowanie zmniejszasz szansę na błędy. Nie każ odbiorcom domyślać się, czy powinni dodać przecinek, kropkę, ukośnik lub myślnik. Zrób to za nich.

Oszczędzisz ich zasoby poznawcze, a oni to docenią i chętniej wypełnią Twój formularz.

Dzięki temu nie tylko zwiększysz konwersję, ale także zapewnisz spójność wszystkich danych kontaktowych dostarczanych przez formularz.

O ile po większym, komputerowym ekranie da się łatwo nawigować i niektóre wpadki ujdą Ci na sucho, o tyle mały wyświetlacz mobilny nie wybacza.

Tak naprawdę te same zasady, które dotyczą projektowania stron internetowych dla komputerów stacjonarnych, mają również zastosowanie w projektowaniu mobilnym. Trzeba tylko dostosować je do mniejszego ekranu.

Formularze mobilne powinny być łatwe do wypełnienia przy użyciu jak najmniejszej ilości stuknięć i ruchów.

Jak to zrobić?

Dzięki logice warunkowej formularze są krótsze, wymagają od użytkowników dokonania mniejszej ilości wyborów i są silniej spersonalizowane. To z kolei przekłada się na większą konwersję.

Każdy odwiedzający zaczyna wypełnianie Twojego formularza w tym samym miejscu. Jednak jego droga i punkt, w którym ostatecznie wyląduje zależy już konkretnie od jego odpowiedzi.

Logika warunkowa ma zastosowanie wszędzie tam, gdzie potrzebujesz mocno spersonalizowanych informacji, np. w długich formularzach aplikacyjnych, czy kwalifikacyjnych.

Pomocne jest użycie narzędzi analitycznych do mierzenia zachowań użytkowników, którzy przechodzą przez Twoje formularze. Korzystaj z Google Analytics, Hotjar i innych tego typu ułatwień.

Następnie użyj analityki formularzy, aby zidentyfikować wszelkie problemy
i przetestować różne rozwiązania. Wybierz te najlepsze i gotowe.

Jeśli mimo wszystko wolisz, żeby to zadanie zdjęli z Twoich barków specjaliści marketingu internetowego, wyślij nam wiadomość. W odpowiedzi otrzymasz niezobowiązującą ofertę na projekt strony internetowej, która realnie zwiększa zyski firmy. Powodzenia!