Checkout w sklepie internetowym, który nie gubi klientów przed zapłatą

Klient wybrał produkt, dodał go do koszyka i przeszedł do płatności. Według zestawienia Baymard Institute około 70 % takich koszyków zostaje porzuconych, a spora część rezygnacji pada dopiero na stronie zamówienia, gdy klient widzi koszt dostawy albo formularz na dwa ekrany.

To najdroższe miejsce w całym sklepie, bo tracisz ludzi, za których dotarcie już zapłaciłeś. Dlatego przy tworzeniu sklepów WooCommerce checkout projektujemy osobno i nigdy nie zostawiamy go w domyślnej postaci z instalacji. Poniżej opisujemy, co konkretnie sprawdzamy i co da się poprawić w istniejącym sklepie.

Najważniejsze wnioski

• Najczęstszy powód porzucenia zakupu to dodatkowe koszty widoczne za późno. W badaniu Baymard wskazuje go 40 % osób, które zrezygnowały z zamówienia.
• Wymóg zakładania konta stoi za prawie co 5. porzuconym zamówieniem. Zakup bez rejestracji powinien być domyślny, a konto można zaproponować po złożeniu zamówienia.
• Typowy polski formularz zamówienia w WooCommerce ma około 17 elementów. Baymard zaleca 12-14 elementów i 7-8 pól do wypełnienia, więc część pozycji da się schować przed klientem prywatnym.
• Przycisk zamówienia musi jasno mówić o obowiązku zapłaty. Tak stanowi ustawa o prawach konsumenta, a napis „Kupuję i płacę” przy okazji uspokaja klienta.
• Informacja o zwrotach i metody płatności powinny stać obok przycisku. Klient nie powinien opuszczać strony zamówienia, żeby je sprawdzić.

Dlaczego klienci rezygnują na ostatnim kroku zakupu

Klienci porzucają zamówienie najczęściej przez niespodziewane koszty, wymóg zakładania konta i zbyt długi formularz. Każdy z tych problemów da się usunąć na etapie projektu sklepu, bez zmiany oferty i bez obniżania cen.

Baymard Institute od lat zbiera badania porzuceń koszyka i publikuje zestawienie przyczyn rezygnacji z zakupu. Średnia z 50 badań to 70,22 % porzuconych koszyków. Część z tych osób tylko przegląda ofertę i nie planowała kupować, więc tej grupy nie odzyskasz. Ciekawsza jest reszta, czyli ludzie, którzy chcieli kupić i odpadli przez sam proces.

Przyczyna rezygnacji	%	Co na to w projekcie sklepu
Dodatkowe koszty za wysokie (dostawa, opłaty)	40 %	koszt dostawy widoczny już w koszyku i na karcie produktu
Zbyt długi czas dostawy	20 %	termin dostawy przy każdej metodzie, nie tylko cena
Brak zaufania do strony przy płatności	19 %	znane metody płatności, dane firmy, bezpieczne połączenie
Wymóg założenia konta	18 %	zakup bez rejestracji jako opcja domyślna
Za długi lub skomplikowany formularz	17 %	mniej pól, NIP i uwagi ukryte pod przełącznikiem
Błędy i awarie strony	17 %	testy zamówienia po każdej aktualizacji
Niejasne zasady zwrotów	13 %	krótka informacja o zwrocie przy przycisku
Brak możliwości policzenia całej kwoty z góry	12 %	suma z dostawą widoczna przed ostatnim krokiem

Dane pochodzą głównie z rynków zachodnich, więc nie przenosimy ich 1:1 na polski rynek. Kolejność przyczyn zgadza się jednak z tym, co widzimy przy audytach polskich sklepów. Najczęściej problemem jest koszt dostawy, który pojawia się dopiero na ostatnim ekranie, i formularz rozbudowany o pola potrzebne tylko części klientów.

Jedno zastrzeżenie. Wolny koszyk też gubi klientów, ale to sprawa serwera i wydajności, którą rozwiązuje się poza projektem formularza. W tym tekście zajmujemy się tym, co klient widzi i wypełnia.

Koszt dostawy widoczny, zanim klient dojdzie do płatności

Koszt dostawy powinien być znany klientowi przed przejściem do formularza zamówienia, najlepiej już na karcie produktu. Klient, który pierwszy raz widzi tę kwotę na ostatnim ekranie, odbiera ją jak dopłatę doliczoną po fakcie.

W WooCommerce masz do tego dwa ustawienia w opcjach wysyłki. Pierwsze włącza kalkulator kosztów dostawy w koszyku, więc klient sprawdzi cenę bez wpisywania pełnego adresu. Drugie ukrywa koszty wysyłki do czasu podania adresu i w polskim sklepie zwykle szkodzi, bo ceny paczkomatu czy kuriera nie zależą od ulicy. Lepiej pokazać od razu listę metod z kwotami.

Przy projekcie sklepu dokładamy jeszcze:

• próg darmowej dostawy na karcie produktu i w koszyku, z informacją, ile brakuje do progu („Do darmowej dostawy brakuje 38 zł”),
• termin dostawy przy każdej metodzie, bo w badaniu Baymard co 5. osoba rezygnująca z zakupu wskazuje czas dostawy, a nie cenę,
• suma zamówienia z dostawą widoczna stale w podsumowaniu, także na telefonie, gdzie podsumowanie często ląduje na samym dole strony.

Najwygodniejsza dla klienta jest jedna jasna kwota od początku. Najgorzej działa dostawa „od 9,99 zł”, która przy formularzu zamienia się w 24 zł, bo produkt okazał się gabarytem.

Zakup bez zakładania konta jako opcja domyślna

Sklep powinien pozwalać na zamówienie bez rejestracji, a konto proponować jako dodatek. Wymóg założenia konta wymienia w badaniu Baymard 18 % osób, które porzuciły zakup, więc to jedna z najtańszych poprawek w całym sklepie.

W WooCommerce zakup bez konta włącza się w ustawieniach kont i prywatności jednym polem. W tym samym miejscu ustawisz, czy klient może założyć konto w trakcie zamówienia. Dobrze działa wariant, w którym konto jest zwykłym polem wyboru pod adresem e-mail, a hasło sklep wysyła mailem. Klient nie musi wymyślać hasła w połowie zakupu.

Klienci często pytają nas, czy zakup bez konta nie zmniejszy liczby powracających klientów. Z naszego doświadczenia konto rzadko jest tym, co sprowadza kogoś z powrotem. Robią to mail po zamówieniu, newsletter i dobra obsługa. Dane klienta i tak trafiają do sklepu razem z zamówieniem, więc możesz wysłać mu potwierdzenie, informację o wysyłce i prośbę o opinię.

Wyjątkiem są sklepy, w których konto jest częścią usługi, na przykład z subskrypcją, cenami dla stałych klientów albo sprzedażą do firm. Tam konto ma realną wartość dla kupującego i warto to wprost napisać przy formularzu.

Ile pól powinien mieć formularz zamówienia

Według Baymard dobrze zaprojektowany checkout ma 12-14 elementów formularza, w tym 7-8 pól do wypełnienia. Przeciętny sklep pokazuje domyślnie ponad 23 elementy, czyli niemal dwa razy więcej, niż potrzeba.

Dla porządku policzyliśmy typowy formularz zamówienia polskiego sklepu na WooCommerce po dodaniu wtyczek do paczkomatów i faktur. Wygląda zwykle tak:

1. imię,
2. nazwisko,
3. nazwa firmy,
4. NIP,
5. kraj,
6. ulica i numer,
7. numer mieszkania,
8. kod pocztowy,
9. miejscowość,
10. telefon,
11. adres e-mail,
12. wybór paczkomatu,
13. pole „wysłać na inny adres”,
14. uwagi do zamówienia,
15. założenie konta,
16. zgoda na regulamin,
17. zgoda na newsletter.

To 17 pozycji, z czego połowa dotyczy tylko części klientów. Osoba prywatna zamawiająca do paczkomatu nie potrzebuje pól firmy, NIP-u ani drugiego adresu. Dlatego przy projektowaniu zaczynamy od pytania, które pola są potrzebne każdemu, a resztę chowamy za przełącznikami.

Co da się zrobić najczęściej:

• pola firmy i NIP pod polem „Chcę fakturę na firmę”, rozwijane dopiero po kliknięciu,
• numer mieszkania połączony z ulicą w jednym polu,
• kraj ukryty, gdy sklep wysyła tylko w Polsce,
• uwagi do zamówienia zwinięte w link „Dodaj uwagi”,
• zgoda na newsletter przeniesiona na stronę z potwierdzeniem zamówienia.

Po takich zmianach osoba prywatna wypełnia 7-8 pól, czyli dokładnie tyle, ile zaleca Baymard. Klient firmowy dostaje swoje pola, gdy ich potrzebuje.

Formularz na telefonie

Na telefonie każde pole kosztuje więcej, bo klient pisze kciukiem na małej klawiaturze. Dwie poprawki dają najwięcej. Pole telefonu i kodu pocztowego powinno otwierać klawiaturę numeryczną, a pola adresowe powinny mieć prawidłowe podpowiedzi autouzupełniania, czyli oznaczenia, dzięki którym przeglądarka sama wpisze zapisany adres. Bez nich klient wpisuje wszystko ręcznie i łatwo o literówkę w e-mailu, na który nie dojdzie potwierdzenie.

Checkout w sklepie sprzedającym firmom

W sprzedaży do firm formularz wygląda inaczej. NIP jest tam polem głównym, często z pobieraniem danych firmy z rejestru po wpisaniu numeru, a klient wybiera płatność przelewem z terminem albo zakup na fakturę. Takie rozwiązania projektujemy przy platformach B2B na WooCommerce, gdzie zamówienie składa zalogowany klient z indywidualnym cennikiem i konto ma realny sens.

Płatności, zaufanie i zwroty przy przycisku zamówienia

Ostatni ekran zamówienia ma odpowiedzieć na trzy pytania klienta: jak zapłacę, czy mogę temu sklepowi zaufać i co zrobię, jeśli produkt nie pasuje. Odpowiedzi powinny stać obok przycisku, bo regulaminu otwieranego w nowej karcie prawie nikt nie czyta.

Metody płatności. Polski klient szuka przede wszystkim BLIK-a i szybkiego przelewu, a na smartfonach coraz częściej Google Pay i Apple Pay. Pokaż je na liście z rozpoznawalnymi logotypami. Brak ulubionej metody to w badaniu Baymard powód rezygnacji dla 9 % osób, a odrzucona karta dla kolejnych 10 %, więc druga metoda płatności pod ręką ratuje część zamówień. Koszty poszczególnych bramek to osobny temat, tu liczy się sam wybór widoczny na ekranie.

Zaufanie. Prawie co 5. osoba, która porzuciła zakup, nie zaufała stronie przy płatności. Pomagają proste rzeczy, czyli pełne dane firmy w stopce, numer telefonu widoczny także na stronie zamówienia, bezpieczne połączenie i spójny wygląd. Klient, którego ostatni krok przenosi na stronę wyglądającą inaczej niż sklep, ma prawo się zawahać.

Zwroty. Konsument kupujący przez internet może odstąpić od umowy w ciągu 14 dni bez podawania przyczyny. To ustawowe prawo, więc nie ma powodu go ukrywać. Jedno zdanie przy przycisku („Masz 14 dni na zwrot, wysyłkę zwrotną opłacamy my”, jeśli tak jest) działa lepiej niż link do regulaminu. Niejasne zasady zwrotów wymienia w badaniu 13 % rezygnujących.

Napis na przycisku. Tu wygląd przycisku styka się z prawem. Zgodnie z art. 17 ustawy o prawach konsumenta przycisk składający zamówienie musi jasno mówić, że zamówienie wiąże się z obowiązkiem zapłaty, na przykład „Zamawiam z obowiązkiem zapłaty” albo „Kupuję i płacę”. Przy przycisku z samym słowem „Dalej” konsument nie jest związany zamówieniem. Przy audytach sklepów wciąż trafiamy na przyciski z nazwą wziętą z angielskiej wersji motywu. Pozostałe obowiązki prawne sklepu zebraliśmy w przewodniku o zgodności prawnej sklepów i stron internetowych.

Jak sprawdzić własny checkout w 15 minut

Najszybciej sprawdzisz checkout, składając w swoim sklepie prawdziwe zamówienie z telefonu, jako nowy klient i bez logowania. W 15 minut zobaczysz większość problemów opisanych wyżej.

1. Otwórz sklep w trybie prywatnym na telefonie, żeby przeglądarka nie podpowiadała Twoich danych.
2. Dodaj produkt do koszyka i sprawdź, kiedy pierwszy raz widzisz koszt dostawy. Jeśli dopiero na ostatnim ekranie, to pierwsza rzecz do poprawy.
3. Policz pola w formularzu, które musisz wypełnić jako osoba prywatna zamawiająca do paczkomatu. Więcej niż 10 oznacza, że część z nich da się schować.
4. Sprawdź, czy da się kupić bez zakładania konta i czy sklep nie wymaga hasła w trakcie zamówienia.
5. Przeczytaj napis na przycisku zamówienia i sprawdź, czy przy nim jest informacja o zwrotach i widoczna suma z dostawą.
6. Zapłać najpopularniejszą metodą i zobacz, czy wracasz na stronę sklepu z jasnym potwierdzeniem.

Ten test warto powtórzyć po każdej większej aktualizacji wtyczek, bo zmiana w module płatności albo dostawy potrafi przestawić formularz bez niczyjej wiedzy. Jeśli lista problemów wyjdzie długa, zwykle szybciej jest przeprojektować cały checkout niż poprawiać go punkt po punkcie.

Pytania, które słyszymy najczęściej