Gdy piszesz e-maila, robisz zakupy internetowe czy rejestrujesz się na jakiejś stronie internetowej, uzupełniasz formularz. Okazuje się, że ten niepozorny detal może wpłynąć na wyniki sprzedaży i wskaźnik konwersji. Poznaj 11 dobrych praktyk i przekonaj się, jak zaprojektować formularz, aby był prosty, czytelny i zapewniał wysoki wskaźnik konwersji.

Kontakt Efectownia

Zwiększ swoją widoczność w sieci

Darmowa konsultacja z nami ⤵

Kontakt

Jak zaprojektować formularz? 11 dobrych praktyk

Razem z naszymi praktycznymi poradami dowiesz się, jak prawidłowo zaprojektować formularz UX i zwiększyć jego skuteczność.

Mniej znaczy więcej

Projektując formularz, pamiętaj o najważniejszej zasadzie – im mniej pól w formularzu, tym lepiej. Użytkownik, który zobaczy, że ma do uzupełnienia zbyt wiele informacji szybko się zniechęci i być może nawet całkowicie zrezygnuje – z zakupu, napisania wiadomości, rejestracji czy wypełniania ankiety. 

Główną funkcją formularza jest pomoc w realizacji konkretnego celu biznesowego, a nie zbieranie jak najwięcej różnych informacji. Dlatego zastanów się, jakie dane są absolutnie konieczne i tylko takie pola dodaj do formularza.

Zastosowanie tylko jednej kolumny

Jak zaprojektować formularz zgodnie z UX? Kolejną zasadą jest stworzenie jednego bloku z polami formularza. Tak zwane jednokolumnowe formularze zapewniają największą przejrzystość informacji i są znacznie bardziej intuicyjne podczas wypełnienia. Poza tym sprawiają, że użytkownik na pewno nie pominie żadnej ważnej części. Dodatkową zaletą tworzenia jednej kolumny w formularzu, jest również to, że takie rozwiązanie doskonale sprawdza się na urządzeniach mobilnych. 

Wyjątek – nazwę ulicy i numer domu lub mieszkania warto dodać w tej samej linii.

Dodawanie informacji zwrotnej

Formularz to forma komunikacji z klientem lub potencjalnym klientem. Dlatego też kolejna zasada projektowania formularza wiąże się z dodaniem informacji zwrotnej. Użytkownik, który wypełni cały formularz i kliknie przycisk „Wyślij”, powinien uzyskać informację na temat tego, czy dane zostały poprawnie przesłane.

Wystarczy, że dodasz krótki tekst np. „Wiadomość przesłana prawidłowo. Odpowiemy najszybciej jak to możliwe”, czy też „Dziękujemy za prawidłowe wypełnienie ankiety”. Informacja zwrotna sprawi, że użytkownik zyska pewność, że prawidłowo wypełnił pola formularza, a wiadomość faktycznie została wysłana.

Pogrupowanie bloków

Co zrobić, gdy nie możesz skrócić formularza i z różnych powodów po prostu musi być długi? W takim razie zdecyduj się na grupowanie danych według kategorii. Podział może dotyczyć np. danych osobowych, danych teleadresowych, usługi itd.

W czytelny sposób pogrupuj bloki i opisz je nazwą kategorii, aby formularz nadal pozostał czytelny, a natłok pól do uzupełnienia nie był zbyt przytłaczający dla odbiorcy.

Proste i czytelne etykiety

Formularz powinien składać się z pól, etykiet i przycisku. Czym są etykiety formularza? To krótkie komunikaty wskazujące, czego dotyczy pole i jakie dane należy wpisać. Twoim zdaniem podczas projektowania formularza jest zapisanie prostych etykiet, które nie wprowadzają użytkownika w błąd. 

Najlepiej umieścić etykiety nad polami formularza. Alternatywnym rozwiązaniem może być dodawanie etykiety obok okienka lub w okienku. Zwróć uwagę na kwestie techniczne – odstępy, rodzaj fonta i jego wielkość. Kieruj się zasadą, aby formularz był maksymalnie czytelny.

Jasne komunikowanie o błędnym wypełnieniu formularza

Należy pamiętać, że częścią komunikacji jest także informowanie o błędach w formularzu. Nie popełniaj błędu i nie zostawiaj użytkownika z komunikatem typu „Błąd”, „Coś poszło nie tak” lub „W formularzu są błędy”. Tego typu komunikaty są zbyt ogólne, dlatego bardziej irytują użytkowników, niż faktycznie im pomagają. Znacznie lepszym pomysłem będzie dodanie informacji o błędzie bezpośrednio pod polem formularza. Do tego kluczowe jest umieszczenie wskazówki, w czym tkwi błąd, np. „Kod pocztowy jest nieprawidłowy” czy „Hasło nie zawiera cyfr i znaku specjalnego”.

Zachęcające CTA i wyróżniający przycisk

Skoro jednym z elementów formularza są przyciski, to warto poświęcić im nieco uwagi. Dobry formularz powinien zawierać przycisk z zachęcającym i jasnym CTA, czyli wezwaniem do działania. Nie musisz odkrywać koła od nowa, świetnie sprawdzają się CTA takie jak – zaloguj się, zarejestruj się, wyślij czy kontynuuj. Najważniejsze jest to, aby wezwanie do działania jasno informowało, jaki będzie efekt po kliknięciu przycisku.

Poświęć także swój czas na zaprojektowanie odpowiedniego wyglądu przycisku, czyli buttona. Wybieraj kontrastujące fonty i tło, a do tego spraw, aby przycisk od razu rzucał się w oczy. Button powinien wyglądać jak obiekt, w który faktycznie można kliknąć. Wykorzystaj do tego lekkie cienie, które skutecznie stworzą efekt 3D. 

Kontakt Efectownia

Zwiększ swoją widoczność w sieci

Darmowa konsultacja z nami ⤵

Kontakt

Dopasowanie formularza do urządzeń mobilnych

Nie zapomnij także tym, że użytkownicy coraz częściej korzystają z urządzeń mobilnych, także podczas wypełniania formularzy. Dlatego też dopasuj formularz do urządzeń mobilnych – smartfonów i tabletów.

Najlepiej, aby pola formularza wyświetlały się jeden pod drugim, a etykiety były czytelne, żeby każdy mógł je bez problemu rozczytać. Responsywne formularze doskonale prezentują się również na urządzeniach mobilnych.

Zastosowanie różnych formatów

Standardowe pole formularza, które wymaga wpisania tekstu, nie zawsze będzie dobrym wyborem. Podczas projektowania formularza zastanów się nad wykorzystaniem również innych rodzajów pól. Jednym z praktycznych rodzajów jest radio button. To rodzaj pola, który jest stosowany, gdy użytkownik musi wybrać jedną z wymienionych opcji. 

Jeśli dotąd stosowałeś lub stosowałaś w takiej sytuacji rozwijane menu i kazałeś użytkownikowi samodzielnie wpisywać odpowiedź, to zdecydowanie lepszą opcją zgodną z UX będzie właśnie radio button. Jest estetyczny, a do tego oszczędza czas podczas wypełniania formularza. Najczęściej taka opcja stosowana jest, gdy użytkownik ma do wyboru mniej niż 5 opcji. Rozwijane menu lepiej sprawdzi się np. do daty urodzenia.

Dopasowanie długości i szerokości pola formularza

Dobrą praktyką podczas projektowania formularza jest również zwrócenie uwagi na rozmiar pola formularza. Kluczowe jest to, aby dopasować go do ilości treści, która będzie tam wpisywana. Na przykład do wpisania numeru domu wystarczy małe pole, natomiast do wpisania pełnego adresu niezbędne będzie pole o większej szerokości niż standardowa.

Zaletą dopasowania długości i szerokości pól formularza jest także to, że dzięki temu zaoszczędzisz sporo miejsca, a formularz nie będzie przytłaczający.

Monitorowanie, testowanie i ulepszanie formularza

Nie spoczywaj na laurach! Gdy już stworzysz formularz UX, musisz monitorować, czy pozwala realizować Twoje cele, czyli prowadzi do rejestracji, przesłania wiadomości, zapisu do newslettera lub zakupu.

Jeśli dostrzeżesz niskie wyniki formularza, to znaczy, że wymaga modyfikacji, bo nie spełnia oczekiwań użytkowników. Popraw błędy, np. sprawdź, czy popełniasz któreś ze wskazanych poniżej błędów. Być może właśnie nasze uwagi pomogą Ci osiągnąć założone efekty dzięki formularzowi UX.

Popularne błędy podczas projektowania formularza

Jak zaprojektować dobry formularz? Konieczne jest przestrzeganie zasad, które wskazaliśmy powyżej. Jednak to nie wszystko. Zamiast uczyć się na błędach, możesz przeczytać nasze spostrzeżenia na temat najczęstszych błędów, jakie można znaleźć w formularzach. Zapoznaj się z nimi i wystrzegaj się ich lub sprawdź, czy je popełniasz.

  • Używasz gwiazdki przy obowiązkowych polach? Pamiętaj o dodaniu legendy! Znacznie lepszym rozwiązaniem będzie dodanie przy najważniejszych polach, takich jak np. e-mail, napisu „obowiązkowe”. Możesz też postąpić zupełnie odwrotnie i przy polach nieobowiązkowych (jeśli jest ich mniej) dodać przypis „opcjonalnie”.
  • Robienie długich formularzy. Jak już wcześniej wskazaliśmy, mniej znaczy więcej, bo pomaga w osiągnięciu wyższego wskaźnika konwersji.
  • Niewidoczne przyciski do wysyłania formularza. To błąd, który może już właściwie na mecie doprowadzić do porzucenia formularza. Minimalizm i estetyka to jedno, ale pamiętaj, że równie ważne są też dobre praktyki UX w projektowaniu formularzy.
  • Zbyt wąskie pola formularza, w których ma znaleźć się więcej informacji np. adres.
  • Brak przycisku „wyczyść” to kolejny częsty błąd, jaki można spotkać przy formularzach. Warto go dodać, aby przyspieszyć proces wypełniania pól tekstowych po tym, jak użytkownik popełnił błąd i chce go naprawić.
  • Mało opcji do wyboru. Duża liczba pól tekstowych to błąd lub ryzyko, że użytkownik zrezygnuje z dalszego wypełniania formularza, ale warto zdawać sobie sprawę z tego, że błędem może być też mała liczba opcji w polach do wyboru. Przez to użytkownik może mieć problem z wybraniem odpowiedniego pola, które jest zgodne z jego oczekiwaniami.
  • Innym błędem w projektowaniu formularzy jest zmuszanie użytkowników do tworzenia zbyt trudnych haseł. To częsty problem podczas rejestracji. Użytkownicy mają wtedy problem z zapamiętaniem takiego hasła. Znajdź kompromis między bezpieczeństwem a wygodą użytkownika.

🚀 Stosuj się do dobrych praktyk w projektowaniu formularzy i osiągaj wzrosty konwersji!

Projektowanie formularza UX wymaga zwrócenia uwagi na szereg zasad, takich jak m.in.:

  • zastosowanie tylko jednej kolumny,
  • ograniczenie liczby pól w formularzu,
  • pogrupowanie bloków,
  • umieszczenie prostych etykiet,
  • jasne komunikowanie o błędach w formularzu,
  • dopasowanie formularza do urządzeń mobilnych,
  • monitorowanie, testowanie i ulepszanie formularza.

Jeśli masz już jakieś formularze na swojej stronie, upewnij się też, czy nie popełniasz częstych błędów podczas projektowania formularza, takich jak robienie długich formularzy czy dodawanie nieczytelnych przycisków z CTA.

Wszystkie nasze wskazówki pozwolą Ci stworzyć dobry formularz, który spowoduje wzrost konwersji.

Przeczytaj również:

Kontakt Efectownia

Zwiększ swoją widoczność w sieci

Darmowa konsultacja z nami ⤵

Kontakt

Autor

Michał Kukliński

Założyciel agencji marketingowej efectownia.pl. W swoich działaniach stawia na kompleksowość, oferując swoim klientom pozycjonowanie stron www, prowadzenie profili w social mediach, płatnych kampanii reklamowych, audytów, usługi copywritingu. Zaimplementowanie systemu pracy z książki „Praca głęboka” Cala Newporta” stanowiło jeden z ważnych kroków w jego karierze.

Napisz komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *