Zmień obraz na pierwszym ekranie lub „dostosuj” korzyści do klienta, ale jaki jest sens, jeśli nie ma interakcji z formularzem?
Statystyki pokazują, że w 20% przypadków przyczyną niewystarczającej konwersji strony docelowej jest nie tyle zły USP lub brak docelowego ruchu, ile nieostrożny i nieprzemyślany projekt formularza zgłoszeniowego.
Gość nie chce zostawić swoich danych kontaktowych, „opuszcza” formularz i wychodzi. Tracisz potencjalnych klientów, a tym samym dochód.
Dlaczego tak się dzieje i jak zwiększyć konwersję formularza aplikacyjnego?

2 powody złego „wypełnienia” formy:

• nieprawidłowy formularz wniosku
• jego nieprzemyślana funkcjonalność

W artykule zawarto prostą checklistę, dzięki której w łatwy sposób przeanalizujesz formularze znajdujące się na stronie docelowej. Do pracy polecam korzystanie z 4 narzędzi: kliknij mapę, przewiń mapę, analitykę formularzy i .

Formularz zgłoszeniowy musi być widoczny na pierwszym ekranie bez „przewijania”

Sprawdź mapę przewijania. Sprawdź, czy główne elementy konwersji mieszczą się w oglądanych częściach strony. Sprawdź swoją stronę na urządzeniach o różnych rozmiarach ekranów. Zwróć szczególną uwagę na wersję mobilną!

Sprawdź wszystkie przeglądarki

Trzeba sprawdzić jak działa formularz zgłoszeniowy we wszystkich przeglądarkach i warto przetestować osobno! Jeżeli funkcjonalność będzie wadliwa, nie będzie wyniku, danych do analizy i rekomendacji.

Liczba pól musi odpowiadać zadaniu

Rys. 2 Przykład dodatkowego pola rozwiązującego problem klienta

Zasada jest prosta – zwróć uwagę na wygodę wypełniania tych formularzy:

• używaj podpowiedzi (na przykład „maski” numerów telefonów);
• umożliwić przesłanie formularza bez wypełniania wszystkich dostępnych pól;
• wyznaczaj odpowiednie cele – na przykład nie proś o numer telefonu kontaktowego na stronie subskrypcji, jeśli . Odwiedzający nie będą wypełniać 5 pól tylko po to, aby otrzymać demo lub katalog.

Korzystaj z różnych sposobów uzyskiwania informacji kontaktowych

Zacznij od cech produktu lub niszy. Daj możliwość skontaktowania się z Tobą telefonicznie, e-mailem lub czatem w celu konsultacji. Weź pod uwagę zachowanie klientów – łatwiej jest komuś od razu zadzwonić i omówić warunki, w niektórych przypadkach (uzyskanie wyceny) nie da się obejść bez interakcji z formularzem.

Formularz zamknięty czy otwarty?

Pracując z zagranicznymi stronami coraz częściej mamy do czynienia z zamkniętym formularzem zgłoszeniowym - prostym i zrozumiałym przyciskiem w stylu „Rozpocznij teraz”. Nie ma jednak jednoznacznej odpowiedzi, która forma sprawdzi się najlepiej. Ostatecznie wszystko zależy od tego, jak kompetentnie zbudowałeś logiczny „eyeliner” do cennego przycisku.

Zasady projektowania pól w pop-upie będą takie same:

• Bądź konsekwentny. Wypełnienie formularza powinno być możliwie proste.
• Trzymaj się porządku. Najpierw umieść pola, które najłatwiej wypełnić (np. „nazwa”).
• Sformułuj wyraźną korzyść. Wyjaśnić dlaczego odwiedzający musi wypełnić formularz I co dostanie.

Rys. 3 Przykład dobrego „leadu” do zamkniętego formularza aplikacyjnego

Nie używaj wyrażeń szablonowych!

Podobnie jak skorzystanie z bezpłatnej konsultacji. Pomyśl o kilku opcjach „łatwego kroku”, który może zainteresować użytkownika i skłonić go do interakcji z formularzem.

Dobrym przykładem jest nisza sprzedaży samochodów. Zamiast standardowego „Uzyskaj poradę w sprawie sprzedaży samochodu” zastosowano fajny trik: odwiedzający jest proszony o natychmiastowe oszacowanie kwoty, jaką może otrzymać.

Wezwij do konkretnych działań

Odejdź od sformułowania „złóż wniosek”. Znacznie lepiej jest zrobić przycisk z opisem konkretnego wyniku (np. „zdobądź CP” lub „oblicz koszt”). W idealnym przypadku tekst przycisku powinien częściowo powielać „eyeliner”.

Przyciągnij dodatkową uwagę

Skorzystaj z przewodników graficznych. Najłatwiej jest „zwolnić” przestrzeń wokół formy i skierować wzrok odwiedzającego za pomocą wskaźnika lub strzałki. Dzięki temu forma stanie się bardziej zauważalna i mocniej przyciągnie uwagę.

Spraw, aby obraz (baner ze zdjęciem na pierwszym ekranie) działał dla CTA

W przypadku, gdy nie da się podkreślić formy elementami graficznymi lub sprawić, że przycisk będzie większy i bardziej kontrastowy, „zwróć” na niego uwagę użytkownika poprzez obraz. Odpowiednio dobierz zdjęcie i skieruj wzrok odwiedzającego w odpowiednią stronę.

Ryc. 7 Wzrok dziewczyny zwraca uwagę na formę

Dowiedz się, jak użytkownicy korzystają z formularzy

Analityka formularzy zgłoszeniowych pokazuje, które pola są wypełnione, a które nie, przez użytkowników. A Webvisor, ze względu na swoją funkcjonalność, pełni rolę „starszego brata”, który monitoruje zachowanie odwiedzającego. Jeśli doszło do interakcji z formularzem, ale z jakiegoś powodu dane nie zostały przesłane, wyświetli się informacja o problemie. Innymi słowy, pomoże zrozumieć, na jakich etapach wypełniania użytkownicy mają trudności, które pola można usunąć, a które należy uzupełnić podpowiedzią prawidłowego wypełnienia.

Podziękuj klientowi – to ważne

Pomyśl o szczegółach! Dobrze zaprojektowana strona z podziękowaniami to nie tylko przejaw szacunku do klienta, ale także narzędzie zwiększające konwersję. Jeszcze raz - odejdź od schematów! Wykaż się kreatywnością – zamiast standardowego sformułowania „Twoja aplikacja została przyjęta” napisz o sobie i swojej firmie coś bardziej osobistego. Strona z podziękowaniami, jeśli zostanie wykonana prawidłowo, może być dobrym miejscem do eksperymentowania.

wnioski

Interakcja z formularzem to szczyt komunikacji pomiędzy stroną docelową a klientem. Zanim przetestujesz elementy konwersji na swojej stronie docelowej, przeanalizuj swoje formularze CTA pod kątem naszej listy kontrolnej.

Sprawdź wysyłanie danych z różnych urządzeń i różnych przeglądarek. Lokalne błędy poszczególnych wersji zdarzają się znacznie częściej, niż mogłoby się wydawać.

Pamiętaj, aby przeprowadzić analizę formularzy, aby zidentyfikować pola opuszczane przez klientów, aby zrozumieć, dlaczego odchodzą i jak możesz to naprawić.

Przed wprowadzeniem zmian i przetestowaniem formularzy policz liczbę otrzymanych już wniosków, aby uzyskać realny obraz wyników osiągniętych po wprowadzeniu ulepszeń.

Bądź w pełni wyposażony i wyprzedź konkurencję. Strony docelowe konwersji dla Ciebie!

Pozdrawiam moich czytelników, zdobyłem doświadczenie i opowiem o zasadach formularza opinii w php. Pokażę Ci na ilustrujących przykładach, abyś zrozumiał, jak wszystko działa i jak interakcja pomiędzy samym formularzem wejściowym (jego polami wejściowymi) a plikiem obsługi napisanym w php. Ponadto możesz bezpłatnie pobrać kod źródłowy wraz z rozszerzeniem .

Oczywiście będzie świetnie, jeśli choć trochę rozumiesz HTML/CSS. Będziesz musiał przeciągnąć kod na swoją stronę analogicznie. Nie będzie to miało wpływu na język PHP, pokażę wszystkie niezbędne zmiany, które należy wykonać samodzielnie.

AKTUALIZACJA: Bazując na opiniach czytelników, zdałem sobie sprawę, że potrzebne jest coś piękniejszego i funkcjonalnego, spotkajcie się, sprawdźcie i obejrzyjcie. Wybierz, który najbardziej Ci się podoba)

AKTUALIZACJA 2: Wersja 3.0 Responsive Landing + formularz ajax z przekazywanymi tagami UTM, sprawdź i spójrz. Spodoba Ci się

Przypomniałem sobie siebie, kiedy po raz pierwszy próbowałem stworzyć własny formularz opinii w PHP i szczerze mówiąc, było to pracochłonne, ponieważ. Nie rozumiałem, co się dzieje i jak. Cierpliwości i wytrwałości przyjaciele, a odniesiesz sukces.

formularz kontaktowy php - struktura

Analizę samego formularza informacji zwrotnej przeanalizujemy na przykładzie strony docelowej (Landing Page), przy okazji jest o tym osobny artykuł. Możesz zobaczyć jak to działa w akcji za pomocą poniższych przycisków, załączam kody źródłowe tego one-pagera i główny plik obsługi php (ten plik przetworzy i wyśle ​​e-mail na e-mail)

Po pobraniu źródeł i rozpakowaniu archiwum zobaczysz następującą strukturę plików:

• image - wszystkie obrazy, które wykorzystywane są na sam Landing Page, przyciski itp.
• js – skrypty javascript udostępniające np. wyskakujące okienko modalne na stronie i inne efekty wizualne
• indeks.html - plik indeksowy naszego one-pagera
• indeks1.php to plik obsługi, do którego przekazywane są wartości z formularza, następnie z otrzymanych zmiennych tworzona jest litera i wysyłana na podany adres e-mail. Ponadto plik Index1.php będzie pełnił funkcję strony pośredniej powiadamiającej o pomyślnym przesłaniu danych z automatycznym przekierowaniem z powrotem do pliku Index.html (tj. naszego jednostronicowego narzędzia)

Ważne jest, aby Twój hosting, na którym znajdują się pliki witryny, obsługiwał przetwarzanie php, w przeciwnym razie plik indeks1.php nie zostanie wykonany i nie będzie działać. Aby wyjaśnić ten niuans, skontaktuj się z kampanią, w której zarejestrowany jest Twój hosting lub po prostu go przetestuj - działa, co oznacza, że ​​​​istnieje wsparcie. Jeśli nie, włącz opcję obsługi języka PHP

Przyjrzyj się jak działa interakcja wszystkich elementów (strona, formularz, handler).

Kod źródłowy do wywoływania formularza i procedury obsługi

Przyjrzyjmy się działaniu jednego z przycisków wywołujących modalne wyskakujące okienko zawierające formularz opinii. Ten podany kod źródłowy jest wstawiany na stronę więcej niż raz, dwa razy i zadziała, będziesz musiał go dostosować do swojego projektu i potrzeb.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

Poproś o oddzwonienie Poproś o oddzwonienie

Poproś o oddzwonienie Poproś o oddzwonienie

Poniżej znajduje się pełny kod źródłowy modułu obsługi indeks1.php, aby skonfigurować wysyłanie na swoją skrzynkę pocztową, zmień „ [e-mail chroniony]» samodzielnie, resztę w zasadzie można pozostawić bez zmian

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42

Skontaktujemy się z Tobą

Skontaktujemy się z Tobą body ( tło: #22BFF7 url(img/zakaz.jpg) góra -70% środkowa bez powtórzeń; ) setTimeout("location.replace("/index.html"), 3000); /*Zmień adres bieżącej strony po 3 sekundach (3000 milisekund)*/

Sprawdzam czy formularz działa

Wywołujemy okno i wprowadzamy dane do testowego sprawdzenia naszego formularza

Przypominam jeszcze raz, że Twój hosting musi obsługiwać przetwarzanie plików php, w przeciwnym razie nasz moduł obsługi po prostu nie zostanie wykonany i żaden list nie zostanie wysłany na podany adres e-mail. Wynik pomyślnie wypełnionego formularza opinii

To tyle z mojej strony, starałem się jak najlepiej oddać sens i dzieło scenariusza. W razie pytań proszę o kontakt w komentarzach lub kontakt na VK (zobacz dane kontaktowe). Życzę łatwej i produktywnej pracy.

Cześć przyjaciele! Chcę zwrócić uwagę na uniwersalny skrypt do przesyłania danych z formularzy na e-mail. Skrypt jest idealny dla witryn typu Landing Page, witryn z wizytówkami itp. Nasz skrypt Contact Forms wyróżnia się spośród masy innych skryptów w Internecie tym, że ma możliwość łączenia nieograniczonej liczby formularzy z różnymi polami na jednej stronie i jest w stanie wysyłać listy do wielu odbiorców.

Więc. Zacznijmy. Zacznijmy od możliwości skryptu.

Połączenie nieograniczonej liczby formularzy na jednej stronie.

Sprawdzenie poprawności wypełnienia pól.

Ustawienia powiadomień.

Możliwość użycia liter w każdym formularzu.

Typ listu - (jeśli używane są znaczniki HTML)

Wysyłanie na nieograniczoną liczbę adresów.

Indywidualna personalizacja każdej formy.

Skrypt działa bez konieczności ponownego ładowania strony.

Ochrona przed spamerami.

Początkowe ustawienia.
Skrypt bazuje na bibliotece, więc pierwszą rzeczą, którą musimy zrobić, to ją podłączyć. W tym celu polecam korzystanie z bibliotek hostowanych przez Google.

Porozmawiajmy o innych plikach bardziej szczegółowo:

feedback.js - główny plik skryptu odpowiedzialny za przesyłanie formularzy AJAX.
jquery.arcticmodal.js,
jquery arcticmodal. - zapewniają możliwość wyświetlania formularzy w oknie modalnym.
jquery.jgrowl.js
jquery.jgrowl.css - umożliwia wyświetlanie powiadomień na stronie (bloki w górnym rogu strony).

HTML i wymagane atrybuty.
Obowiązkowym atrybutem wszystkich elementów formularza jest atrybut name="" - niezbędny do późniejszej konfiguracji formularza.
W przypadku przycisku (type="button") musisz określić class="feedback" . Chcę także zwrócić uwagę na fakt, że rolę przycisku może pełnić dowolny znacznik HTML z klasą „feedback” Wywołanie formularza w oknie modalnym Aby wywołać formularz w oknie modalnym należy najpierw zdefiniować akcję poprzez kliknięcie tagu, na przykład elementu div z klasą modal_btn
Wywołanie formularza w oknie modalnym $(dokument).ready(function() ( $(document).on("click", ".modal_btn",function()( $("#small-modal").arcticmodal( ); )); ));
Ponieważ formularz powinien być widoczny tylko w oknie modalnym, należy go ukryć, umieszczając go w elemencie div z atrybutem style="display: none;" i zawinąć w kilka standardowych elementów div, aby nadać styl oknie modalnemu.
X

Opracowaliśmy więc podstawowe ustawienia podłączenia naszego skryptu do wysyłania formularzy na pocztę e-mail. Zajrzyjmy teraz do środka i zajmijmy się konfiguracją pól, powiadomień i wszystkiego innego, co tam jest.

Przykład ustawień dla jednego formularza Ustawienia dla wszystkich formularzy zapisane są w pliku feedback\index.php
$form["form-1"] = array("fields" => array("name" => array("title" => "Nazwa", "validate" => array("preg" => "%% ", "minlength" => "3", "maxlength" => "35", "messages" => array("preg" => "Pole [%1$s ] może zawierać błąd", "minlength " => "Minimalna długość pola [ %1$s ] jest mniejsza niż dozwolona długość - %2$s", "maxlength" => "Maksymalna długość pola [ %1$s ] jest większa niż dozwolona długość - %2$s",)), "tell " => array("title" => "Telefon", "validate" => array("preg" => "/^((8|\+ )[\- ]?)?(\(?\d( 3)\)?[\- ]?)?[\d\- ](5,10)$/", "minlength" => "5" ,), "messages" => array("preg" => "Pole [%1$s] może zawierać błąd", "minlength" => "Minimalna długość pola [%1$s] jest mniejsza niż dozwolone - %2$s",)))), "cfg" => array(" zestaw znaków" => "utf-8", "temat" => "Temat", "tytuł" => "Tytuł w treść wiadomości e-mail", "ajax" => prawda, "validate" => prawda, "from_email" = >" [e-mail chroniony]", "from_name" => "noreply", "to_email" => " [e-mail chroniony], [e-mail chroniony]", "to_name" => "noreply1, noreply2", "geoip" => true, "referer" => true, "type" => "html", "tpl" => true, "antisspam" => "email77 ", "antisspamjs" => "address77", "okay" => "Wiadomość wysłana - OK", "fuck" => "Wiadomość wysłana - BŁĄD", "spam" => "Spambot", "powiadom" => " color-modal-textbox", "usepresuf" => false)); // Następna forma $form["form-2"] = array("fields" => array(.....
Aby dodać ustawienia dla nowego formularza należy utworzyć nową tablicę $form[""] na wzór tablicy $form["form-1"]

Pamiętasz, jak mówiłem o wymaganym atrybucie name="" ?

Obowiązkowym atrybutem wszystkich elementów formularza jest atrybut name="" - niezbędny do późniejszej konfiguracji formularza.
Czas więc powiedzieć, dlaczego nadal był potrzebny.
nazwa="" jest kluczem alfanumerycznym tablicy, musi być unikalny dla tablicy $form[""]

Przykład kodu HTML dla przejrzystości

Teraz zrozumiemy tablice i do czego służą.

$formularz["formularz-1"] = tablica();
$formularz["formularz-2"] = tablica(); itp.
Oto główne tablice dla każdego nowego formularza, zawierające:

"pola" => tablica(); - Tablica ustawień elementów formularza.

• "nazwa" => tablica(); - Tablica ustawień elementów formularza (np. input name="name" type="text" ), która ma wiele ustawień.
  • "title" => "Twoje imię" - nazwa elementu formularza, będzie wyświetlana na błędach lub w szablonie
  • "validate" => tablica(); - tablica zawierająca reguły walidacji elementu formularza
    • "preg" => "%%" - wyrażenie regularne
    • "minlength" => "3" - minimalny rozmiar pola
    • "maxlength" => "35" - maksymalny rozmiar pola
    • "substr" => "35" - zawsze obcinane do N znaków
  • "wiadomości" => tablica(); - tablica zawierająca komunikaty walidacyjne, a mianowicie:
    • "preg" => "Element formularza nie pasuje do wyrażenia regularnego"
    • "minlength" => "Minimalna długość pola [%1$s] jest mniejsza niż dozwolona - %2$s" - błąd walidacji, klucz(preg) nie pasuje do klucza walidacji
    • "maxlength" => "Maksymalna długość pola [ %1$s ] przekracza dozwoloną - %2$s" - błąd walidacji, klucz(preg) nie pasuje do klucza walidacji

"cfg" => tablica(); - Szereg ustawień formularzy.

• "charset" => "utf-8" - kodowanie
• "subject" => "Temat wiadomości e-mail", - Temat wiadomości e-mail
• "title" => "Tytuł w treści listu", - Tytuł w treści listu
• "ajax" => true, - jest to formularz TODO ajaxowy (jeśli nie jest potrzebny, wstaw - false)
• "validate" => true, - (true) jeśli chcemy sprawdzać poprawność formularzy na serwerze, zamień walidację js na "ajax" => true. Jeśli opcja jest wyłączona (fałsz), nie można sprawdzić ustawień pola. DO ZROBIENIA
• "from_email" => "myemail", - nadawca, podaj nazwę pola (name="myemail"), a jeśli nie potrzebujesz wiadomości e-mail od użytkownika, to skrót [e-mail chroniony]
• "from_name" => "myname", - nadawca, podaj nazwę pola (name="myname"), a jeśli nie potrzebujesz nazwy użytkownika, to odcinek Brak odpowiedzi
• "do_e-maila" => " [e-mail chroniony]", - adres e-mail odbiorcy. Aby wysłać na wiele adresów, podaj je oddzielone przecinkami. Przykład („to_email” => „ [e-mail chroniony], [e-mail chroniony], [e-mail chroniony]",)
• "to_name" => "noreply1", - Nazwa odbiorcy. W przypadku wysyłania na wiele adresów podaj nazwy odbiorców oddzielonych przecinkami. Przykład („to_name” => „noreply1, noreply2, noreply3”,)
• "geoip" => true, - pobierz lokalizację według typu TODO
• "referer" => false, - dodaj adres URL strony, z której wysłano formularz
• "type" => "plain", - rodzaj litery - zwykły, html (jeśli używane są znaczniki HTML)
• "tpl" => false, - użyj szablonu wiadomości e-mail. Jeśli true to plik szablonu zostanie podłączony zgodnie z nazwą formularza (nazwa="form-1") z folderu i plik (feedback/tpl/form-1.tpl) zostanie przetworzony, w przeciwnym wypadku wszystko zostanie wysłany bez zmian, każde pole w nowej linii
• "antispam" => "email77", - Ochrona przed spamem, metoda opiera się na ukrytym (display:none) polu, które jest automatycznie wypełniane tylko przez robota, podszywając się tym samym pod siebie.
• "antispamjs" => "address77", - Antyspam, metoda bazująca na ukrytym (display:none), początkowo wypełnionym polu, które automatycznie czyści JavaScript przy ładowaniu strony, nawet inteligentny robot nie jest w stanie tego przewidzieć i wtedy tak się dzieje zablokowany.
• "okay" => "Wiadomość do użytkownika", - Wiadomość do użytkownika wyświetlana w przypadku pomyślnego przesłania formularza, można skorzystać ze znaczników HTML.
• "fuck" => "Wiadomość do użytkownika", - Wiadomość do użytkownika wyświetlana w przypadku wystąpienia błędu przy wysyłaniu formularza, można skorzystać ze znaczników HTML.
• "spam" => "Wiadomość do użytkownika", - Wiadomość do użytkownika wyświetlana w przypadku podejrzenia robota spamującego. Można użyć znaczników HTML.
• "notify" => "color-modal", - jaki rodzaj powiadomień wyświetlać, textbox - bloki w górnym rogu strony, color - podświetlenie koloru w formularzu, modal - okno modalne na środku strony, brak - wyłączyć. Można łączyć np. kolor-modalny - błędy w wypełnianiu pól z podświetleniem oraz status tekstowy wysłania w oknie modalnym TODO
• "usepresuf" => false - Niezależnie od tego, czy w temacie czy w tytule listu ma być zastosowany niestandardowy dodatek, w przypadku niewielkiej zmiany możesz określić w tym celu na przykład %%cfg.title.suffix%% w formularzu musi być ukryte pole, więcej szczegółów znajdziesz w f -qiu presuf()

Konfigurowanie szablonów wiadomości e-mailSo. Zajmijmy się teraz tematyką naszych przesłań.
Po pierwsze, aby formularz został wysłany w szablonie należy w ustawieniach formularza włączyć możliwość korzystania z pliku szablonu - "tpl" => true ,
Po drugie należy utworzyć plik szablonu z rozszerzeniem *.tpl w folderze (feedback/tpl/ ), zgodnie z nazwą formularza (name="form-1" ).

Przykład: (feedback/tpl/form-1.tpl )

Nagłówek w treści wiadomości e-mail
%%Nazwa tytułu%%	%%nazwa.wartość%%
%%tell.title%%	%%powiedz wartość%%

nazwać, powiedzieć itp. - Są to atrybuty (name="") pól, które wypełnia użytkownik.
title - Nazwa elementu formularza, która jest ustawiana w tablicy ustawień elementu formularza.
wartość - Wartość elementu formularza.

Na razie to wszystko, ale skrypt z pewnością nie jest doskonały, dlatego komentarze i opisy błędów są mile widziane i zostaną poprawione w przyszłych wersjach.

P.S. Scenariusz został opracowany przez zespół

Jak stworzyć skuteczną platformę internetową do promocji biznesu? Jaki jest sekret i zasady jego powstawania? Te i inne pytania nurtują tych, którzy zdecydowali się na zakup osobistego landing page’a w globalnej sieci, czekając na napływ nabywców swojego produktu. Przyjrzyjmy się więc szczegółom.

Sekrety formularza lądowania

Zapewne mało kto sprzecza się ze stwierdzeniem, że najważniejszym elementem strony docelowej jest internetowy formularz przyjmowania zamówień. Tak naprawdę właśnie w tym celu tworzona jest strona docelowa. Tworzeniem formularza zamówienia lądowania zajmują się profesjonaliści, którzy dokładnie znają sekret opracowania ciekawej, a jednocześnie dość prostej opcji.

Dobrze zaprojektowany formularz Landing page powinien być zrozumiały dla najzwyklejszego użytkownika, który otworzył stronę. Jeśli w oknie, które się otworzy, będzie za dużo pól, po prostu odstraszy to potencjalnego nabywcę i pójdzie on do konkurencji. Zatem opracowanie wysokiej jakości formularza zamówienia na stronę docelową jest zadaniem nie mniej odpowiedzialnym niż strona główna firmy. Aby osiągnąć sukces, czyli wysoką konwersję, wystarczy przestrzegać kilku prostych zasad.

Wymagania dotyczące stworzenia idealnego formularza zamówienia dla strony docelowej

Strona docelowa musi być gotowa na przyjęcie kupujących. Aby to zrobić, należy wziąć pod uwagę kilka podstawowych czynników.

Zwięzłość. Formularz internetowy powinien umożliwiać złożenie zamówienia, a nie zbierać wielu niepotrzebnych informacji o kliencie. Oznacza to, że nie powinien zawierać więcej niż 3-5 linii, wydając więcej punktów, narażasz się na ryzyko załadowania strony linijkami, które nie mają żadnego znaczenia, co utrudni użytkownikowi szybkie sfinalizowanie zakupu.

czytelność. Odpowiedni formularz zgłoszeniowy na stronę docelową powinien być widoczny i łatwy do odczytania. Nie ma potrzeby przesycania strony dużą liczbą kolumn. Najlepszym rozwiązaniem jest, jeśli użytkownik będzie stopniowo przechodził do uzupełniania kolejnych informacji o sobie. I oczywiście trzeba wziąć pod uwagę projekt formularza, aby wyglądał przyjemnie dla oka.

Funkcja zapisywania danych. Dość często połączenie internetowe konsumentów pozostawia wiele do życzenia. Aby przerwy w komunikacji nie spowodowały utraty danych już wprowadzonych do kolumn, warto pomyśleć o funkcji autozapisu. Dzięki temu użytkownik zaoszczędzi czas nawet po przywróceniu połączenia i nie będzie musiał ponownie wprowadzać swoich danych.

Sprawdzone koncepcje. Formularz na stronie docelowej nie jest miejscem na oryginalność. Istnieją zasady, które są sprawdzone w czasie i przynoszą rezultaty. Każdy błąd programisty lub projektanta może kosztować tysiące utraconych klientów.

Te pozornie znane postulaty są bardzo ważne, a ich lekceważenie jest równoznaczne z skazaniem się na porażkę. Wszystko to prowadzi do utraty klientów i ich pieniędzy. Po uświadomieniu sobie znaczenia formularza zamówienia dla strony docelowej, czas zadać kolejne pytanie: jak i gdzie można go stworzyć?

Przykład formularza zamówienia strony docelowej

Gdzie zrobić formularz zgłoszeniowy na stronę docelową?

O ile nie posiadasz wystarczającej wiedzy i umiejętności, a jest taka mniejszość, jest mało prawdopodobne, że otrzymasz działający formularz dla strony docelowej, który będzie bezbłędnie realizował przypisane mu funkcje. Niektórzy szukają w sieci kodów źródłowych znajdujących się w domenie publicznej, chociaż ta metoda może przysporzyć znacznie więcej kłopotów, niż jest tego warta. Po pierwsze, nie wiadomo, jak formularz będzie działał, testowanie zajmie dużo czasu, a to nie gwarantuje 100% wydajności. Listy z formularza mogą trafić do spamu, w ogóle nie zostać wysłane lub dotrzeć w niezrozumiałym kodowaniu. W efekcie okazuje się, że część zamówień została utracona, bądź wystąpiła inna awaria, a to wszystko raczej nie wpłynie korzystnie na wizerunek sprzedawcy. Po drugie, co jeśli będziesz musiał wprowadzić jakieś zmiany? Samodzielne grzebanie w kodzie lub zapraszanie specjalisty, którego usługi mogą również kosztować niezłe grosze.

Drugą opcją jest zaangażowanie w to zadanie freelancera. Ale ten sposób rozwiązania problemu nie jest pozbawiony pułapek. Najlepsi freelancerzy z pewnością potrafią stworzyć idealny kształt uchwytu strony docelowej, ale gdzie można go znaleźć? Wyszukiwanie może zająć dużo czasu. Można oczywiście spróbować selekcji konkurencyjnej, ale to wszystko wymaga czasu i pieniędzy. Ponownie aktualna pozostaje kwestia dokonywania zmian w formularzu. Cóż, jeśli współrzędne autora formularza zostaną zachowane, ale co jeśli nie? A nawet wtedy, jeśli połączenie zostanie zachowane, może po prostu być zajęty innymi zamówieniami i nie będzie w stanie ci pomóc. A inni freelancerzy nie zawsze są gotowi korygować pracę innych kolegów w sklepie.

Najbardziej skutecznym rozwiązaniem tego problemu jest projektant formularzy internetowych Formdesigner. Usługa ta nie wymaga specjalnych umiejętności, ma przejrzysty interfejs. Wbudowany projektant formularzy pomoże Ci stworzyć idealny formularz do przechwytywania, który będzie idealnie pasował do Twojej witryny. Przemyślane i zabezpieczenie w postaci hasła, protokołu HTTPS i Captcha. Płatności online są dostępne i łatwe, dzięki czemu możesz otrzymać pieniądze w ciągu kilku minut. Unikalne scenariusze tworzone są przy użyciu dynamicznych formularzy.

Zasada działania

Konstruktor pojawił się w 2013 roku i zdobył już zaufanie początkujących i profesjonalnych webmasterów. Umożliwia właścicielom stron internetowych utworzenie w ciągu kilku minut formularza zgłoszeniowego, formularza opinii, formularza subskrypcji, formularza zamówienia i wielu innych, które idealnie pasują do interfejsu dowolnej witryny. Specjalne umiejętności i wiedza nie są potrzebne, formularz przechwytywania strony docelowej, dzięki usłudze Formdesigner, będzie gotowy w ciągu 5 minut. Ponadto, jeśli chcesz coś zmienić, po prostu odwiedź witrynę ponownie i dokonaj niezbędnych zmian. W dodatku wszystko to można zrobić całkowicie bezpłatnie, co też jest istotne.

Mówiąc o głównych zaletach projektanta formularzy internetowych Formdesigner, możemy zauważyć:

• Konstruktor pracuje online w czasie rzeczywistym;
• Cały proces tworzenia formularza internetowego jest przejrzysty i odbywa się na Twoich oczach;
• Wszystkie dane z formularza przechowywane są na serwerze i są dostępne 24 godziny na dobę;
• Możliwość przesyłania plików i korzystania z niestandardowego CSS pozwala stworzyć unikalny formularz internetowy do lądowania.

Konstruktor jest lekki i prosty. Za pomocą kilku kliknięć możesz utworzyć potrzebny formularz internetowy. Aby dodać nowy element, wystarczy na niego kliknąć lub przeciągnąć go w zaplanowane miejsce, a zostanie on natychmiast dodany do formularza internetowego. Możesz także łatwo edytować element, klikając go w formularzu i wprowadzając zmiany w jego właściwościach w oknie, które zostanie otwarte.

W ten sam sposób łatwo jest dostosować wygląd, ustawić zasady walidacji i inne niezbędne zmiany, które są natychmiast wyświetlane w formularzu demonstracyjnym, bez konieczności ponownego ładowania strony. Po zakończeniu pracy pozostaje skopiować gotowy kod. Będzie trzeba go wstawić na swoją stronę internetową. Następnie nastąpi przyjmowanie długo oczekiwanych wniosków. Korzystając z tego konstruktora, wszystkie załadowane formularze są natychmiast wyświetlane i nie jest wymagane żmudne przeładowywanie strony.

Możesz stworzyć witrynę od podstaw i poprawić istniejącą. Dzięki świetnemu asystentowi w świecie tworzenia treści internetowych nie będziesz musiał długo czekać na klientów.

Wśród głównych elementów Landing Page’a znajdują się bloki z danymi kontaktowymi oraz prośbą o opinię. Bloki te mają ogromne znaczenie. Przede wszystkim należy zrozumieć, że informacje prezentowane na stronie docelowej często są dla potencjalnego konsumenta niewystarczające – niektórzy lepiej odbierają informacje ze słów żywej osoby niż z lektury treści tekstowych. Dlatego odwiedzający musi przekazywać wysokiej jakości informacje zwrotne. Jak to zrobić?

Na każdym lądowaniu musi znajdować się blok z kontaktami. Niektórzy ukrywają numery i adresy w najdalszym rogu, ale jest to zasadniczo błędne podejście. Rzecz w tym, że odwiedzający powinien widzieć numery telefonów i adresy na wszystkich stronach, a nie gdzieś na jednej. Strona bez numeru telefonu wygląda bezosobowo – można odnieść wrażenie, że administracja sklepu celowo unika wszelkiego rodzaju kontaktów. Oto typowy przykład nieprawidłowej organizacji kontaktów, gdy określono tylko pocztę:

A to jest błędne, bo odwiedzający zawsze powinien mieć możliwość szybkiej komunikacji ze sklepem. Aby to zrobić, musisz umieścić kontakty w najbardziej widocznej części Landingu – w jego nagłówku, niedaleko logo. Czy można wynająć numer 8-800? W tym przypadku można liczyć na bardziej lojalną postawę odbiorców, gdyż dla wielu konsumentów obecność takiego numeru w sklepie budzi dodatkowe zaufanie.

Jak nie umieszczać formularzy opinii na stronach docelowych

Dobrą praktyką było stosowanie na stronach docelowych formularzy opinii, zachęcających do pozostawienia numeru, na który można oddzwonić. Podejście jest dobre, ale nie ma potrzeby, aby formularze były niepotrzebnie inwazyjne. Niektóre strony docelowe robią to ze straszliwą siłą, pokazując formularze na tym etapie, podczas gdy odwiedzający próbują dowiedzieć się, gdzie w ogóle się znajdują. Najlepiej, jeśli formularz pojawi się gdzieś z boku/na dole, nie zajmując ekranu i nie rozpraszając odwiedzających natrętnymi pytaniami. Jeśli w sklepie nie ma darmowych operatorów, odwiedzający muszą pozbyć się takich próśb, ponieważ będą czekać na niemal natychmiastową odpowiedź (każdy potrzebuje pomocy tu i teraz). W formularzach opinii możesz zapytać nie tylko o numery telefonów, ale także o inne dane kontaktowe.

Widżety wielu usług można wykorzystać do uporządkowania przemyślanych opinii. Mogą to być formularze oddzwonienia, płatni i bezpłatni konsultanci online i wiele innych.

W ramach jednej strony można łączyć różnorodne narzędzia do porządkowania informacji zwrotnej, jednak w tym przypadku nie powinny one być zbyt nachalne i przeciążać uwagi odwiedzającego – pod naporem trwałych okien o różnych kształtach wolałby on opuścić podest niż zająć możliwość kupienia czegoś na ten temat.