Formularz się wysyła, a strona robi się pusta. Nic się nie dzieje. Osoba zastanawia się, czy zgłoszenie się udało. Czy serwer je odebrał? Czy formularz nadal przetwarza dane? Czy wysłać jeszcze raz? Ta chwila między kliknięciem "wyślij" a pewnością, że akcja się powiodła, to czas wysokiego niepokoju. Doświadczenie z formularzem nie kończy się, gdy ktoś kliknie "wyślij". Kończy się, gdy wie, że się udało. To, co dzieje się w tych chwilach, decyduje o tym, czy zaufa Twojej marce i czy zebrane dane są naprawdę użyteczne.
Tę ostatnią chwilę kontrolują trzy elementy. Stan ładowania pokazuje, że coś się dzieje, gdy formularz jest przetwarzany. Komunikat o sukcesie potwierdza, że zgłoszenie się udało. Strona z podziękowaniem wskazuje, co dalej. Dobrze zrobione, sprawiają, że ktoś czuje pewność, że zrobił właściwą rzecz. Źle zrobione, wprowadzają zamęt i nieufność. Ten artykuł opisuje, co robi każdy z nich, kiedy ich używać, co napisać i jak je zbudować, nie psując doświadczenia z formularzem.
Dlaczego stany ładowania mają znaczenie, zanim formularz się zakończy
Wysyłanie formularza odbywa się na serwerze. Gdy ktoś kliknie "wyślij", jego dane lecą do jakiegoś komputera, są przetwarzane, a odpowiedź wraca. Cała ta droga zwykle trwa od jednej do pięciu sekund. Jedna sekunda wydaje się natychmiastowa. Pięć sekund wydaje się wiecznością. W tym czasie osoba stoi w miejscu. Widzi formularz i nie wie, co robić. Wysłać jeszcze raz? Czekać? Odświeżyć stronę?
Stan ładowania usuwa tę niepewność. Po kliknięciu "wyślij" coś widocznego się zmienia. Przycisk się wyłącza i zmienia tekst. Pojawia się animacja ładowania. Wskaźnik postępu pokazuje ruch. Coś mówi osobie: "Twoja akcja została zarejestrowana i coś się dzieje".
Najważniejsza zasada dla stanów ładowania to zasada jednej sekundy. Jeśli wysyłanie formularza trwa dłużej niż sekundę, pokaż wskaźnik ładowania. Jeśli krócej, możesz pominąć wizualny stan ładowania, bo dzieje się to tak szybko, że ludzie ledwo to zauważają. Prawie we wszystkich formularzach łączących się z serwerem wysyłanie trwa dłużej niż sekundę. Pokaż stan ładowania.
Bez stanu ładowania ludzie często klikają "wyślij" wielokrotnie. Niepokój każe im zakładać, że pierwsze kliknięcie nie zadziałało. Wielokrotne wysłania tworzą zduplikowane dane, marnują zasoby serwera i frustrują użytkowników. Wskaźnik ładowania temu zapobiega, jasno sygnalizując, że akcja trwa.
Jak zaprojektować stan ładowania, który buduje pewność
Najprostszy stan ładowania to wyłączenie przycisku wysyłania i zmiana jego tekstu. Przycisk normalnie brzmi "Wyślij". Po kliknięciu zmienia się na "Wysyłanie..." i robi się szary lub wyblakły. Osoba widzi, że nie można już w niego kliknąć. Wie, że coś się dzieje. To działa w większości formularzy.
Krok dalej to dodanie ruchu wizualnego. Mała ikona animacji pojawia się obok tekstu przycisku lub wewnątrz niego. Animacja obraca się nieprzerwanie. Daje to poczucie aktywności i postępu. Znaczenie ma prędkość obrotu. Jeden pełny obrót na sekundę wydaje się stabilny. Szybciej wygląda nerwowo. Wolniej wygląda na zawieszone. Trzymaj się tempa jednego obrotu na sekundę.
Przy dłuższych procesach lepiej sprawdza się pasek postępu niż animacja. Poziomy pasek na górze formularza wypełnia się w miarę przetwarzania. Jeśli formularz wie, ile kroków ma wykonać, może pokazać realistyczny postęp. Jeśli nie zna całkowitego czasu, użyj paska procentowego, który wypełnia się do 90% i kończy się po sukcesie. Dzięki temu osoba wie dokładnie, jak daleko jest proces.
Kolor wskaźnika ładowania powinien się wyróżniać, ale nie kłócić z projektem formularza. Użyj koloru marki albo neutralnego niebieskiego lub szarego. Czerwony czy pomarańczowy może wyglądać jak błąd, choć nim nie jest. Zielony może wprowadzić w błąd, sugerując, że formularz już się udał.
Stany ładowania powinny być minimalne. Przycisk się zmienia. Pojawia się animacja. Formularz nie musi blednąć, pola nie muszą się wyłączać, a nowy tekst nie musi wjeżdżać z boku. Prostota buduje zaufanie. Złożoność budzi podejrzenia.
Różnica między komunikatem o sukcesie a stroną z podziękowaniem
Po pomyślnym wysłaniu formularza użytkownik potrzebuje potwierdzenia. Potwierdzenie może wyglądać na dwa sposoby. Komunikat o sukcesie na tej samej stronie, na której był formularz. Albo przekierowanie na nową stronę z podziękowaniem i komunikatem o sukcesie. Oba działają. Wybór zależy od Twojego celu.
Komunikat o sukcesie na stronie zostawia użytkownika na tej samej stronie. Formularz znika lub zmienia się, by pokazać "Mamy Twoje zgłoszenie". Proste, jasne potwierdzenie. Dobrze sprawdza się w małych formularzach albo gdy chcesz, żeby użytkownik został na stronie i przeglądał więcej treści. Formularze kontaktowe często używają komunikatów na stronie. Zapisy do newslettera też. Szybko, prosto, gotowe.
Strona z podziękowaniem to osobna strona, na którą użytkownik trafia po wysłaniu. Istnieje tylko po pomyślnym wysłaniu formularza. Ma własny adres URL. Przydaje się, gdy musisz osobno śledzić konwersję w analityce, gdy chcesz pokazać dodatkową treść po wysłaniu albo poprowadzić użytkownika do kolejnego kroku w lejku sprzedaży. Formularze zamówień w sklepach przekierowują na strony z podziękowaniem. Formularze pozyskiwania leadów też. Osobna strona daje więcej miejsca do pracy.
Różnica techniczna ma znaczenie dla śledzenia. Komunikat na stronie pokazuje konwersję na tej samej stronie co formularz. Strona z podziękowaniem pokazuje osobne wyświetlenie strony i osobny adres URL. Z perspektywy śledzenia strona z podziękowaniem jest czystsza. To odrębne zdarzenie, które narzędzia analityczne mogą zmierzyć precyzyjnie.
Co powinien mówić komunikat o sukcesie
Komunikat o sukcesie ma jedno zadanie: powiedzieć osobie, że zgłoszenie się udało. To wszystko. Nie dodawaj tekstów marketingowych, nie proponuj dodatkowych produktów, nie komplikuj.
Zacznij od jasnego potwierdzenia. "Dziękujemy. Mamy Twoje zgłoszenie." Nie "Twoje zgłoszenie zostało pomyślnie odebrane przez nasz zautomatyzowany system." Pierwsze brzmi po ludzku. Drugie brzmi jak robot z korporacji. Potwierdzenie powinno być osobiste i bezpośrednie.
Od razu dodaj następny krok. Jeśli formularz był prośbą o kontakt, powiedz, kiedy osoba usłyszy odpowiedź. "Odpowiemy w ciągu dwóch godzin roboczych." Nie "Odezwiemy się wkrótce." Konkretne terminy budują zaufanie. Wkrótce jest niejasne. Dwie godziny są konkretne.
Jeśli zgłoszenie uruchamia automatyczną odpowiedź, wspomnij o tym. "Sprawdź e-mail, czeka tam link potwierdzający." Albo "Link do resetu hasła jest w drodze do Twojej skrzynki." To wyjaśnia, co dalej, bez kazania osobie zgadywać ani martwić się, że coś umknęło.
Opcjonalne, ale skuteczne: nawiąż do czegoś, co osoba wpisała. "Dostaliśmy Twoją wiadomość o optymalizacji strony. Przyjrzymy się i wrócimy do Ciebie." Użycie jej własnych słów daje poczucie bycia zauważonym i zrozumianym. Potwierdza, że dane faktycznie dotarły i zostały zarejestrowane.
Pisz krótko. Jedno lub dwa zdania dla komunikatu na stronie. Od trzech do pięciu zdań dla komunikatu na stronie z podziękowaniem. Długie komunikaty o sukcesie wyglądają jak spam albo dodatkowa oferta sprzedażowa.
Używaj ciepłego, rozmownego języka. "Dziękujemy za wiadomość." brzmi lepiej niż "Dziękujemy za wypełnienie i wysłanie formularza." Rozmowny język sprawia, że ta chwila jest ludzka, a nie zautomatyzowana.
Strona z podziękowaniem, która konwertuje, a nie jest ślepym zaułkiem
Strona z podziękowaniem to chwila o wysokiej wartości. Osoba właśnie skonwertowała. Jest w dobrym nastroju. Podjęła działanie i zrobiła to, o co ją prosisz. To moment tuż po tym, jak powiedziała "tak". To moment, by prowadzić ją dalej, a nie odsyłać.
Na górze strony z podziękowaniem powtórz potwierdzenie. "Dziękujemy. Mamy Twoje zgłoszenie." Krótko. Osoba już wie, że się udało. Potwierdzenie jest tylko po to, by to uwiarygodnić.
Pod potwierdzeniem dodaj treść pasującą do tego, co właśnie zrobiła. Jeśli zapisała się do newslettera, pokaż, co będzie dostawać. Jeśli poprosiła o demo, pokaż kolejne kroki. Jeśli kupiła, pokaż szczegóły zamówienia i czas dostawy. Treść powinna wydawać się naturalną kontynuacją tego, co właśnie wysłała.
Dodaj jedną opcjonalną akcję. Nie pięć. Nie trzy. Jedną. Co osoba powinna zrobić dalej? Przejrzeć stronę? Przeczytać pomocne materiały? Obserwować Cię w mediach społecznościowych? Umówić rozmowę? Wybierz jedną i uczyń ją głównym punktem strony. Wiele konkurujących wezwań do działania wprowadza zamęt. Osoba właśnie powiedziała "tak". Poprowadź ją dalej jednym jasnym krokiem.
Jeśli chcesz zebrać dodatkowe informacje, strona z podziękowaniem to dobre miejsce. Nie pytaj o nie w samym formularzu. Zapytaj po tym, jak osoba już się zaangażowała pierwszym wysłaniem. Drugi, lżejszy formularz na stronie z podziękowaniem często konwertuje lepiej niż upchnięcie wszystkiego w pierwszym.
Dodaj dowód społeczny, jeśli ma sens. Opinię zadowolonego klienta. Statystykę o osobach, które podjęły to samo działanie. Coś, co utwierdza w przekonaniu, że decyzja była dobra. Nie chodzi o przekonywanie do konwersji. Osoba już skonwertowała. Chodzi o wzmocnienie jej pewności co do tego, co właśnie zrobiła.
Zadbaj, by projekt strony pasował do całej witryny. Strona z podziękowaniem, która wygląda inaczej, używa innych czcionek albo rażącej kolorystyki, sprawia, że użytkownik czuje, że opuścił stronę Twojej marki. Spójność buduje zaufanie. Strona z podziękowaniem powinna wyglądać, jakby należała do Twojej witryny.
Czas przejścia od formularza do stanu sukcesu
Gdy ktoś kliknie "wyślij", jak długo stan ładowania powinien być widoczny, zanim pojawi się komunikat o sukcesie lub strona z podziękowaniem? Odpowiedź brzmi: tak długo, jak formularz faktycznie jest przetwarzany.
Przy formularzach, które wysyłają się bardzo szybko, poniżej sekundy, i tak utrzymaj stan ładowania widoczny przez co najmniej sekundę. Jeśli wysłanie trwa w rzeczywistości 300 milisekund, ale animacja znika po 400 milisekundach, ludzie mogą pomyśleć, że coś się zepsuło. Przejście powinno wyglądać na zamierzone, a nie pośpieszne.
Przy formularzach trwających od dwóch do pięciu sekund pokazuj stan ładowania przez cały czas. Pozwól ludziom zobaczyć oczekiwanie. Nie ukrywaj, jak długo trwa proces. Przejrzystość buduje pewność.
Nigdy nie pokazuj stanu ładowania, który znika i pojawia się znowu. To wprowadza zamęt. Pokaż go raz i utrzymaj do sukcesu. Jeśli musisz ponowić próbę po błędzie, całkowicie wyczyść stan ładowania i pokaż komunikat o błędzie przed kolejną próbą.
Przy bardzo długich procesach, ponad dziesięć sekund, rozważ pokazywanie aktualizacji postępu. Nie tylko animację. Komunikat, który się zmienia. "Sprawdzamy Twoje dane." Potem "Przetwarzamy Twoje zgłoszenie." Potem "Finalizujemy wysyłkę." Trzy lub cztery krótkie komunikaty w trakcie długiego procesu utrzymują zaangażowanie i świadomość, że wciąż coś się dzieje.
Uwagi dotyczące telefonów: stany ładowania i komunikaty o sukcesie
Na ekranie telefonu miejsca jest mało. Wskaźnik ładowania, który dobrze działa na komputerze, może zajmować zbyt dużo miejsca na telefonie. Strona z podziękowaniem, która jest długa na komputerze, na telefonie staje się bardzo długa.
Przy stanach ładowania na telefonie ogranicz tekst. "Wysyłanie..." zamiast "Poczekaj, aż przetworzymy Twoje zgłoszenie." Animacja zajmuje mniej miejsca niż pasek postępu. Umieść wskaźnik ładowania wewnątrz przycisku wysyłania albo tuż nad nim lub pod nim, a nie pływający na środku strony.
Komunikaty o sukcesie na telefonie niech będą krótkie. Idealne jest jedno zdanie. Dwa są akceptowalne. Dłuższy komunikat wysunie się poza ekran.
Na stronach z podziękowaniem na telefonie umieść główne potwierdzenie w pierwszych dwóch akapitach. Nie każ ludziom przewijać strony, by dowiedzieć się, czy formularz faktycznie się wysłał. Podziękowanie powinno być od razu widoczne na początku strony.
Testuj stany ładowania i sukcesu na prawdziwych telefonach, a nie tylko w emulacji przeglądarki. Rozmiar ekranu telefonu i sposób renderowania mogą wpływać na to, jak wszystko wygląda.
Analityka i śledzenie ostatnich chwil formularza
Strona lub komunikat o sukcesie to miejsce, w którym mierzysz, czy formularz faktycznie skonwertował. Platformy analityczne, takie jak Google Analytics, Meta Pixel i platformy e-mail, mogą precyzyjnie śledzić moment sukcesu.
Jeśli używasz komunikatu o sukcesie na tej samej stronie co formularz, ustaw wyzwalacz konwersji na pojawienie się tego komunikatu. Użyj JavaScript, by śledzić, kiedy komunikat się pojawia, a nie tylko kiedy strona się wczytuje. Dzięki temu wiesz dokładnie, kto pomyślnie wysłał formularz, a nie tylko kto odwiedził stronę.
Jeśli przekierowujesz na stronę z podziękowaniem, śledzenie jest automatyczne. Każde wyświetlenie tej strony to konwersja. Dlatego wiele formularzy używa stron z podziękowaniem. Adres URL jest unikalny. Narzędzia analityczne rozumieją go doskonale. Jedno wyświetlenie strony równa się jednemu udanemu wysłaniu.
Dodaj adres URL strony z podziękowaniem do celów konwersji w analityce. W Google Analytics utwórz cel, który uruchamia się, gdy ktoś trafi na yourdomain.com/thank-you. Automatycznie zlicza to każde udane wysłanie formularza.
Jeśli na stronie jest kilka formularzy, utwórz dla każdego osobną stronę z podziękowaniem albo użyj parametrów URL, by je odróżnić. contact-form.com/thank-you a demo-form.com/thank-you. Albo parametrów takich jak /thank-you?form=contact. Dzięki temu śledzisz, które formularze konwertują.
Częste błędy, które psują moment sukcesu
Komunikat o sukcesie, który nie potwierdza, że akcja się udała, nie jest komunikatem o sukcesie. To ślepy zaułek. "Dziękujemy." I nic więcej. Co osoba ma zrobić dalej? Gdzie jest jej potwierdzenie? Brak jasności budzi nieufność.
Stany ładowania zbyt długie lub zbyt krótkie wyglądają na zepsute. Animacja kręcąca się 20 sekund sprawia, że ludzie myślą, że coś poszło nie tak. Animacja, która pojawia się i znika w 100 milisekund, może pozostać niezauważona.
Strony z podziękowaniem, które próbują sprzedawać zamiast potwierdzać. Tuż po konwersji to nie czas na proponowanie czegoś innego. Potwierdź, co osoba zrobiła. Poprowadź ją dalej. Sprzedaż może przyjść później.
Komunikat o sukcesie lub strona z podziękowaniem, które powtarzają informacje, o które formularz już pytał. Osoba już podała imię i e-mail. Nie każ jej czytać tego z powrotem na stronie sukcesu. Użyj tych danych do personalizacji komunikatu, nie powtarzaj tego, co zebrano.
Formularze mobilne ze zbyt dużymi stanami ładowania. Animacja zajmująca pół ekranu telefonu przytłacza. Utrzymuj wskaźniki wizualne proporcjonalne do rozmiaru ekranu.
Zapomnienie o jasnym następnym kroku. "Dziękujemy za wysłanie." I nic więcej. Co osoba ma zrobić? Bez wskazówek odchodzi. Jedna jasna następna akcja utrzymuje zaangażowanie.
Jak WEMASY pomaga projektować stany ładowania i doświadczenia sukcesu
Kreator formularzy WEMASY zawiera wbudowane stany ładowania, które wyświetlają się automatycznie po wysłaniu formularza. Możesz dostosować styl wskaźnika ładowania do swojej marki. Wybierz komunikat tekstowy, animację lub pasek postępu. Ustaw kolor zgodny z motywem marki. Stan ładowania pojawia się w trakcie przetwarzania danych formularza i znika po zakończeniu wysyłania.
Komunikaty o sukcesie są w pełni konfigurowalne w kreatorze formularzy. Napisz własny komunikat. Wybierz, czy ma się wyświetlać na stronie, czy przekierowywać na stronę z podziękowaniem. Jeśli przekierowujesz, WEMASY pozwala podać adres URL Twojej strony z podziękowaniem. Formularz automatycznie przekierowuje po udanym wysłaniu.
Stronę z podziękowaniem utwórz w kreatorze stron WEMASY jak każdą inną stronę. Dopasuj jej projekt do swojej marki. Dodaj tekst potwierdzenia, kolejne kroki, dowód społeczny lub dodatkowe wezwania do działania. Po zakończeniu konfiguracji formularza wklej adres URL strony z podziękowaniem w ustawieniach przekierowania formularza. WEMASY obsługuje przekierowanie automatycznie.
Walidacja w czasie rzeczywistym zapobiega wielu błędom wysyłania, zanim wystąpią. Gdy dane formularza docierają bez błędów, wysyłanie przebiega gładko. Stan ładowania pojawia się krótko, a stan sukcesu uruchamia się szybciej. Mniej błędów oznacza szybsze wysyłanie i mniej czasu pokazywania stanów ładowania.
Integracja z analityką jest wbudowana. WEMASY śledzi wysłania formularzy i może automatycznie uruchamiać cele analityczne. Gdy formularz zostanie pomyślnie wysłany, możesz ustawić zdarzenia w Google Analytics lub Meta Pixel. Zobacz, które pola formularza mają najlepszą konwersję, które formularze konwertują najczęściej i w którym miejscu ludzie rezygnują.
Sprawdź, jakie funkcje formularzy zawiera Twój pakiet WEMASY.