9 ważnych wskazówek dotyczących projektowania CTA dla przycisków, które sprawiają, że ludzie klikają

Twoje wezwanie do działania (CTA) jest punktem kulminacyjnym Twojej strategii marketingowej. Niezależnie od tego, czy prosisz o zakup, rejestrację lub pobranie. Wszystko do tego momentu polegało na tym, aby potencjalni klienci trafili na Twoją stronę docelową. A czasami wystarczy kilka słów, aby przypieczętować umowę.

Dlatego Twój przycisk CTA jest najważniejszym elementem projektu Twojej witryny. Ponieważ może zmienić pasywnych odwiedzających w aktywnych użytkowników.

Przyciski wezwania do działania wydają się proste. Ale łatwo je zepsuć. Albo być całkowicie pominiętym. Te 9 wskazówek dotyczących projektowania CTA zapewni Ci tę konwersję. Dodatkowo wiele pomocnych przykładów:

1. Spraw, aby Twój przycisk wyglądał na klikalny
2. Bądź opisowy ze swoją kopią
3. Rozmiar i przestrzeń prawidłowo
4. Połącz się w pierwszej osobie
5. Stwórz pilność i używaj mocnych czasowników
6. Wypróbuj podtytuł
7. Odmiany testu A/B
8. Zwróć uwagę na wersję mobilną

Spraw, aby przycisk CTA wyglądał na klikalny

Sprawienie, by przycisk wyglądał na „klikalnego” brzmi głupio. Ale nie uwierzysz, jak często strony robią to źle. Dotyczy to głównie konturu i koloru przycisku.

Trendy współczynnika konwersji pojawiają się i znikają. Jak przezroczysty „przycisk ducha” z cienką ramką i tekstem, który przechodzi w kolor tła. Choć mogą wyglądać fajnie, zwykle przyciągają mniej uwagi. Przeciwieństwo tego, co powinno robić skuteczne CTA.

Ten projekt zwykle działa tylko wtedy, gdy działa jako dodatkowy przycisk:

Źródło: Ruch UX

Oto kolejny przykład przycisków CTA, których nie można oczywiście kliknąć. Jasne, strona docelowa tej agencji projektowej wygląda fajnie. Ale wybaczono by ci przewinięcie tego studium przypadku:

Jak więc sprawić, by ludzie kliknęli? Aby uzyskać wyższe współczynniki konwersji, Twój przycisk powinien być duży, pogrubiony i pasować do wybranego schematu kolorów.

Netflix używa swojej charakterystycznej czerwieni, aby przyciągnąć Twoją uwagę. Prawie jak znak stopu:

Może również działać, aby mieć kontrastowy kolor, dzięki czemu się wyróżnia. Podobnie jak platforma eCommerce BigCommerce tutaj:

Dotyczy to również tekstu w ramce. Upewnij się, że kontrastuje, abyś mógł go poprawnie przeczytać.

Gradienty mogą również działać w ramach tego samego schematu kolorów marki. Dają rzeczom nowoczesny, bardziej młodzieńczy charakter:

Źródło: poniedziałek

Moja rada to starać się, aby projekt CTA był oczywisty. Robienie czegoś po wyjęciu z pudełka może wydawać się dobrym pomysłem, ale ludzie to stworzenia z przyzwyczajeniami. I zdziwiłbyś się, jak wielu nie trafi w sedno.

Bądź opisowy ze swoją kopią

Jedną z najprostszych taktyk optymalizacji współczynnika konwersji (CRO) jest świetny copywriting. Ale nie tylko z dużymi fragmentami tekstu. Mikrokopia jest równie ważna i obejmuje mniejsze szczegóły.

Zwykle widzisz to w formularzach kontaktowych i paskach aktualizacji statusu w mediach społecznościowych. Jak słynne „Co masz na myśli?” na Facebooku? lub „Rozpocznij post” na LinkedIn.

Mikrokopia może pomóc:

• Powiedz użytkownikom, co mają robić
• Zasugeruj
• Rozwiąż obawy
• Podaj kontekst

Innym przykładem jest kopia przycisku CTA. Powinno też dokładnie informować ludzi, co dostaną/co się stanie, gdy na nią klikną.

Kiedyś był to przycisk CTA IMPACT. "Darmowe pobieranie". Niezbyt pomysłowy, co?

Źródło: WPŁYW

Ale czyniąc go bardziej opisowym, zwiększyli konwersje o 78,5%. „Pokaż mi, jak przyciągnąć więcej klientów” wyraźnie bardziej przemawiało:

Kuszące jest napisanie po prostu „Kliknij tutaj”. Ale jest tak wiele alternatyw, które zaangażują użytkowników i, miejmy nadzieję, zainspirują do pożądanego działania.

Więc co powinieneś napisać? Najpierw musisz określić zamiar konwersji. Chcesz dostosować się do miejsca, w którym użytkownicy znajdują się na ścieżce i skąd pochodzą (źródło wizyt).

Źródło: Zwiększenie klienta

Następnie musisz podkreślić wartość tego, co zapewniasz. I obsłużyć wszelkie zastrzeżenia.

Źródło: Przykłady marketingowe

To taki wyjątkowy proces. I będzie to zależeć od Twojej niszy i głosu marki. Ale bez względu na to, jakie sformułowanie wybierzesz, nie zapomnij, aby tekst przycisku był krótki i na temat.

Dopasuj rozmiar i używaj białych znaków

Projekt przycisku CTA to znacznie więcej niż kolor. Rozmiar przycisku to kolejny mały szczegół, który może naprawdę wpłynąć na współczynnik klikalności. A spacja jest tak samo ważna jak sam tekst.

Wiele z tego będzie zależeć od twojego projektu strony internetowej. Ujemna (biała) przestrzeń zwraca uwagę na pewne elementy na stronie. Nie chcesz zagraconej strony głównej. Musi istnieć oczywista ścieżka, którą zwiedzający może podążać.

Airbnb to jeden z najlepszych przykładów negatywnej przestrzeni wykonanej właściwie. I kontrastowy kolor, aby było to jeszcze bardziej oczywiste:

Buffer ma trochę więcej na swojej stronie głównej, ale nadal trzyma przycisk CTA blisko głównej kopii. Plus przykład skutecznego używania przycisków duchów. Dzięki temu jest bardzo jasne, co robić dalej:

Im większy przycisk, tym bardziej jest zauważalny. I musi się wyróżniać, aby przyciągnąć uwagę. Ale nie tak bardzo, że przejmuje stronę i psuje UX.

Jeśli masz skłonność do migreny, odwróć teraz wzrok. Oto przykład, jak tego nie robić:

Źródło: Justinmind

Tak wiele elementów wygląda tutaj jak przycisk. Nie jestem nawet pewien, czy ta witryna wie, w co ma klikać odwiedzający.

W przeciwieństwie do tego, jaka jest pierwsza rzecz, którą widzisz na stronie docelowej Spotify?

Ogromny przycisk „Przejdź do Premium”, prawda? W ten sposób zaprojektować jasną ścieżkę użytkownika.

Na koniec, czy zauważyłeś coś jeszcze w projektach CTA jako dobrych przykładów? Jeśli spojrzysz jeszcze raz, zobaczysz coś, co mają ze sobą wspólnego.

Naukowcy odkryli, że ludzie lubią „kształty z łagodnymi krzywiznami w przeciwieństwie do ostrych punktów”. Są przyjemniejsze dla oka i sprawiają, że czujemy się spokojniejsi. Z tego powodu najskuteczniejszymi przyciskami wezwania do działania są prostokąty z zaokrąglonymi rogami.

Źródło: CleverTap

Nie bez powodu jest to najpopularniejszy format. Ale wypróbuj różne opcje. Twoi odbiorcy mogą preferować coś innego.

Połącz się w pierwszej osobie

Lepsze projektowanie CTA może być o jedno ulepszenie. Czasami jedno słowo.

W copywritingu uczymy się używać słowa „ty”. Ponieważ sprawia to, że czytelnik czuje się, jakby rozmawiał z nim bezpośrednio. Więc myślisz, że dotyczy to również twojej kopii przycisku, prawda? Co dziwne, nie tak bardzo.

Unbounce odkrył, że zmiana tekstu na ich stronie docelowej z „Rozpocznij bezpłatny 30-dniowy okres próbny” na „Rozpocznij bezpłatny 30-dniowy okres próbny” zwiększyła współczynniki klikalności o 90%.

Więc dlaczego tak jest? Cóż, gdy ktoś czuje się związany z produktem, jest bardziej prawdopodobne, że dokona konwersji. Daje to osobisty charakter, nie musząc nic o nich wiedzieć.

Psychologia marketingu pokazuje, że decyzje zakupowe są w większości oparte na emocjach. Tak więc chcesz, aby odwiedzający Twoją witrynę czuł, że to ich wybór.

Napisanie „moje” pomaga użytkownikowi wizualizować akcję, którą zamierza podjąć. Daje im kontrolę i (miejmy nadzieję) skłania ich do podejmowania decyzji.

Dodatkowo może pokazać, że natychmiast uzyskają wartość. Jak na stronie głównej Crazy Egg:

Źródło: Szalone Jajko

1-800 Contacts to największy na świecie sklep z soczewkami kontaktowymi. Ale robią to samo. Upewniają się, że ich przyciski CTA są skierowane tylko do jednej osoby:

Źródło: 1-800 kontaktów

Niewiele firm korzysta z tej techniki. Co oznacza, że ​​wyróżnia się, gdy go widzisz. Dlaczego więc nie spróbować?

Stwórz poczucie pilności i używaj mocnych czasowników

Twoja kopia musi stworzyć poczucie pilności i przyciągnąć uwagę użytkowników. Działa to szczególnie dobrze w przypadku firm eCommerce. Używanie słów takich jak „teraz” i „dzisiaj” może pomóc w pobudzeniu do działania. Ponieważ sugerują, że oferta nie będzie dostępna na zawsze.

„Kup teraz” to klasyka. Ale dzięki naszemu projektowi CTA możemy zrobić coś lepszego.

Źródło: GoSquared

Możesz spróbować sformułowania takiego jak:

• “Podaruj sobie dzisiaj”
• “Odblokuj zniżkę teraz”
• „Jednorazowe bezpłatne pobranie”

Ty też chcesz, aby Twoja oferta była atrakcyjna i wzbudzała ciekawość. Zacznij więc od mocnego czasownika. Nie coś, co wydaje się być wysiłkiem. To łatwy sposób na zniechęcenie ludzi.

Oto kilka przykładów tego, co mam na myśli:

Wygląda na to, że po lewej stronie użytkownicy dostaną coś po kliknięciu. Po prawej stronie wydaje się, że będą musieli poświęcić czas lub pieniądze.

Możesz też stać się naprawdę kreatywny. Jak ta wersja strony głównej Huemora:

Źródło: FastCapital360

Albo stara strona docelowa hrabstwa Humboldt, która nadaje mu mistycznego charakteru:

Źródło: ConEmprendimiento

Przeprowadź burzę mózgów ze swoim zespołem. Nieważne jak śmieszne. Zdziwiłbyś się, co wymyślisz i w końcu użyjesz. Ale bez względu na to, jakie sformułowanie wybierzesz, nie zapomnij spełnić swojej obietnicy po drugiej stronie.

Wypróbuj podtytuł obok przycisku wezwania do działania

Czasami ludzie potrzebują lekkiego bodźca. A trochę tekstu pod przyciskiem CTA może załatwić sprawę. To nie jest zwykły „podtytuł”. Ale to najłatwiejszy sposób na opisanie tego.

Jeśli pomyślimy o tekście przycisku jako nagłówku, najpopularniejszym podtytułem, który zobaczysz, jest „Nie są potrzebne żadne dane karty kredytowej”. Ale twój może powiedzieć wszystko. I fajnie jest być trochę kreatywnym.

Przez większość czasu są używane, aby wzbudzić zaufanie potencjalnego klienta. I mogą zająć się głównymi problemami, które ludzie mogą mieć:

Źródło: CoSchedule

CoSchedule rozumie, że użytkownicy mogą myśleć, że to tylko bezpłatna wersja próbna. Więc „Dlaczego nie? Za darmo na zawsze” wyjaśnia.

Możesz ich również użyć, aby dodać dowód społeczny:

Źródło: Basecamp

Daje to natychmiastową wiarygodność, ponieważ użytkownicy wyraźnie widzą, że inni już Ci ufają. Może również zainspirować FOMO, ponieważ ludzie myślą, że muszą być powody dla tylu subskrybentów.

Jeśli masz specjalną ofertę lub dodatkową wartość związaną z Twoją usługą, użyj swojego podtytułu, aby ją wyróżnić:

Źródło: Moz

Mikrokopia to szansa na zabłyśnięcie głosu Twojej marki. Nawet jeśli to tylko jedno zdanie. Więc nie bój się być trochę bezczelnym, jeśli pasuje:

Źródło: Zwiększenie klienta

Możesz też dokładnie określić, co stanie się po kliknięciu. Powiedz im:

• Co otrzymają (nowe pomysły marketingowe)
• Ile (17+)
• I dlaczego powinni się przejmować (są lepsi niż to, co masz)

Użyj tych przykładów jako szablonów inspiracji. Albo zrób coś zupełnie innego. Po prostu upewnij się, że pasuje do tożsamości Twojej marki i baw się nim.

Nie zapomnij o testach A/B

Większość narzędzi CRO ma na celu poprawę doświadczenia użytkownika (UX). Możliwe, że robisz to już z głównymi częściami swoich stron internetowych. Ale powinieneś robić to także z małymi elementami.

Amazon jest notorycznie wybredny w kwestii projektów przycisków CTA. Zwłaszcza w przypadku użytkowania przez osoby trzecie. Upewnij się więc, że nie łamiesz żadnych zasad.

Następnie drobne zmiany w projekcie przycisku mogą mieć ogromny wpływ. Porównaj więc różne typy przycisków CTA. Następnie test A/B wariantów:

• Kolor przycisku
• Kopia wezwania do działania
• Czcionka
• Umieszczenie w projekcie strony
• Wyskakujące okienka
• Formularze kontaktowe

Źródło: Snov

Jak wspomniałem wcześniej, czasami zmiana tylko jednego słowa może zwiększyć konwersję lub współczynnik klikalności. Ale zanim zaczniesz, musisz zrozumieć, w jaki sposób użytkownicy poruszają się po Twojej witrynie.

Chcesz dowiedzieć się takich rzeczy jak:

1. Z jakimi elementami próbują wejść w interakcję
2. Skąd oni pochodzą
3. Ścieżka użytkownika/ścieżka zakupu Twojej witryny
4. Motywacja ludzi do bycia tam

Źródło: GIPHY

Po uzyskaniu tych informacji możesz eksperymentować z rzeczami opartymi na faktach, a nie na domysłach.

Zazwyczaj łatwiej jest porównać wersję A i B z projektem CTA. Ale możesz to zwiększyć i wypróbować testowanie na wielu odmianach. Na początku prostsze jest zwykle lepsze. W ten sposób będziesz miał wyraźnego zwycięzcę.

Ale nic nie stoi na przeszkodzie, by później spróbować tego zwycięzcy przeciwko innej wersji. Zawsze powinieneś testować i porównywać. Nawet jeśli znajdziesz coś, co działa. To właśnie robią marki odnoszące sukcesy.

Zwróć uwagę na wersję mobilną

Szybka wskazówka na zakończenie. Twoje elementy projektu będą wyglądać zupełnie inaczej na ekranie telefonu komórkowego. Pracujesz na znacznie mniejszym wyświetlaczu i mniejszej liczbie pikseli. Tak więc zaśmiecanie staje się o wiele łatwiejsze.

Wszystko, co omówiliśmy, staje się bardziej rozpowszechnione w Twojej wersji mobilnej. Kontrastowe kolory muszą bardziej się wyróżniać:

Negatywna przestrzeń powinna być priorytetem:

A nawet twój podtytuł może znajdować się w innym miejscu. Ponieważ użytkownicy mobilni mogą nie przewinąć w dół wystarczająco daleko, aby zobaczyć to pod spodem:

Wołaj do CleverTap za te grafiki

Ogólnie rzecz biorąc, musisz zastanowić się nad swoim UX na urządzeniach mobilnych. Ponieważ telefony komórkowe stanowią ponad połowę całego globalnego ruchu związanego z wyszukiwaniem. Nie możesz oczekiwać, że Twoja wersja na komputer będzie tłumaczyć. A odrobina wysiłku może skutkować znacznie wyższym współczynnikiem klikalności.

Wniosek

Skuteczny projekt CTA składa się z wielu tych drobnych szczegółów. Mówiłem to wiele razy, ale najmniejsza poprawka może wystarczyć. Nawet coś tak nieistotnego jak kolor czy kształt konturu.

Testy A/B to jedyny sposób, który poznasz. I nie potrzebujesz do tego nawet drogiego narzędzia CRO. Po prostu śledź swoje konwersje. Zmienić coś. I zobacz, czy jest wzrost lub spadek w stosunku do zwykłej liczby.

Po prostu poświęć swojemu przyciskowi wezwania do działania uwagę, na jaką zasługuje. Może to być różnica między nowym klientem a utraconą szansą.

Czy widziałeś ostatnio jakieś oryginalne projekty CTA? Czy dokonałeś małej zmiany, która zwiększyła liczbę konwersji? Daj nam znać w komentarzach poniżej.