5 Design Techniques for Better CTA Buttons
Kiedy odwiedzamy większość stron internetowych, często mamy na myśli cel. Aby osiągnąć ten cel, zwykle musimy zrobić serię kroków, a pierwszy krok zaczyna się od kliknięcia przycisku wezwania do działania. Zastanów się, kiedy po raz ostatni zarejestrowałeś się w usłudze lub pobrałeś aplikację, proces prawdopodobnie obejmował interakcję z przyciskiem wezwania do działania.
Przyciski CTA to przyciski używane w witrynie do kierowania użytkowników do konwersji celu. Celem CTA jest skierowanie użytkowników witryny na pożądany sposób działania. Niektóre typowe przykłady wezwań do działania to:
- "Rozpocznij wersję próbną"
- "Pobierz aplikację / książkę / przewodnik"
- "Zarejestruj się, aby otrzymywać aktualizacje"
- "Uzyskaj konsultację"
Dzisiaj omówimy 5 najlepszych praktyk dotyczących projektowania przycisków wezwań do działania wraz z najlepszymi przykładami z świata rzeczywistego, które pomogą Ci uzyskać największą liczbę kliknięć ze strony docelowej.
1. Wizualnie uderzający przycisk
Twój kolor przycisku ma znaczenie. W rzeczywistości, jeśli masz zamiar wziąć tylko jedną radę z tego artykułu, powinien to być ten: "Rozważ swój kolor przycisku CTA". Używając koloru, możesz sprawić, że niektóre przyciski wyróżniają się bardziej niż inne, nadając im bardziej widoczny wygląd.
Użyj kontrastujących kolorów
Kontrastujące kolory najlepiej sprawdzają się w przypadku przycisków wezwań do działania, w kontrastowym kolorze można tworzyć efektowne przyciski, które wyróżniają się. Powinieneś wybrać kontrastowy kolor ze schematu kolorów strony, jednocześnie dopasowując się do ogólnego projektu. Rozważ przykład Firefoksa poniżej. Zielony kolor przycisku wezwania do działania na stronie przeglądarki Firefox zeskakuje z ekranu i natychmiast przyciąga uwagę użytkownika.
Przycisk CTA przeglądarki Firefox jest jasnozielony i wyróżnia się na ciemnym niebieskim tle
Kolejny przyciągający wzrok przycisk CTA można znaleźć na stronie głównej Hipmunk. Jasny pomarańczowy przycisk przyciąga uwagę użytkownika i określa kolejną możliwą akcję.
Negatywna przestrzeń
Nie tylko kolor jest ważny dla CTA, ale także przestrzeń wokół niego. Biała przestrzeń (lub przestrzeń ujemna) tworzy niezbędny pokój do oddychania i oddziela przyciski CTA od innych elementów w interfejsie użytkownika. Stara strona domowa Dropbox była dobrym przykładem użycia negatywnej przestrzeni do stworzenia podstawowego wezwania do działania. Niebieskie oznaczenie CTA "Zarejestruj się za darmo" wyróżnia się na tle jasnego błękitu tła.
2. Tekst zorientowany na działanie
Pisanie tekstu przycisku wezwania do działania, który zmusi odwiedzających do podjęcia właściwych działań, nie jest łatwym zadaniem. Na szczęście jest kilka rzeczy, które mogą ci w tym pomóc:
Rozpocznij od czasownika
Powinieneś unikać nieprecyzyjnych i nudnych słów, takich jak "Enter for more information" dla przycisków CTA, i zastąp je bardziej zorientowanymi na działanie słowami, takimi jak "Rozpocznij darmową wersję próbną" lub "Zyskaj teraz zniżkę". Evernote ma jedną z najczęstszych, ale nadal działa tekst zorientowany na działanie dla ich przycisku wezwania do działania.
Rozpocznij od czasownika typu "Start", "Get" lub "Dołącz"
Bardziej interesujący przykład można znaleźć na stronie domowej Treehouse. CTA na stronie Treehouse nie mówi tylko "Rozpocznij bezpłatny okres próbny"; jest napisane "Odbierz swój bezpłatny abonament". Różnica w brzmieniu może wydawać się subtelna, ale "Zażądaj bezpłatnej wersji próbnej" brzmi znacznie bardziej osobowo.
Skorzystaj z Krótkiego i łatwego zrozumienia tekstu dla przycisków
Pamiętaj, aby dokładnie określić, co odwiedzający uzyska, gdy kliknie wezwanie do działania. Idealnie chcesz, aby tekst przycisku zawierał od dwóch do pięciu słów.
Dodaj propozycję wartości
Najprawdopodobniej zauważyłeś, że wiele przycisków ma w swojej kopii takie słowa jak "free" i nie jest to przypadek, użycie takich słów w kopii przycisku podkreśla twoją propozycję wartości oferty. Tak więc, pisząc CTA, spróbuj znaleźć sposób na zintegrowanie jednego (lub wszystkich) 3 przekonujących słów:
- Darmowy
- Premia
- Natychmiast
Pozwól, że dam ci przykład: Jeden wielki strach, jaki użytkownicy mają przed zobowiązaniem się do zapisania się na coś, jest taki, że anulowanie abonamentu będzie trudne, jeśli nie spodoba się usługa. Netflix zwalnia z tego obawy przy użyciu obietnicy "Anuluj w dowolnym czasie" tuż obok wezwania do działania "Dołącz za darmo za miesiąc".
Stwórz poczucie pilności
Skonstruowanie poczucia pilności w przyciskach wezwań do działania może przynieść imponujące współczynniki klikalności. Możesz na przykład użyć tekstu przycisku, takiego jak "Zarejestruj się, a otrzymasz 25% zniżki tylko dziś!" Ograniczenie czasu, w którym ktoś musi podjąć decyzję, sprawia, że ludzie chcą zgłosić swoją ofertę, póki mogą.
Pomocny tekst
Czasami warto rozważyć dodanie dodatkowej linii informacji w tekście przycisku. Ta praktyka jest powszechna w przypadku bezpłatnych przycisków próbnych. Na przykład bezpłatny okres próbny może oznaczać "30-dniową wersję próbną, bez karty kredytowej" w mniejszym tekście poniżej przycisku wezwania do działania z tekstem "Rozpocznij bezpłatny okres próbny". Ten dodatkowy tekst powinien ułatwić proces podejmowania decyzji.
3. Uczyń go widocznym bez przewijania
Umieszczenie przycisków wezwania do działania jest tak samo ważne jak kolor i wiadomość. Przycisk wezwania do działania powinien znajdować się w łatwym do znalezienia miejscu, które następuje w naturalny sposób z przepływu strony internetowej. Powinieneś zachować przycisk wezwania do działania powyżej zakładki, aby użytkownicy nigdy tego nie przegapili. W idealnym przypadku przycisk wezwania do działania powinien znajdować się wśród pierwszych rzeczy, które użytkownik widzi na stronie po jej osiągnięciu. Dodatkowe informacje powinny pozostać na dole, tam, gdzie pozostają dostępne, ale nie rozpraszają uwagi.
4. Duży przycisk z zaokrąglonymi narożnikami
Zastanów się, jak projekt komunikuje afordancję. Jak użytkownicy rozumieją ten element jako przycisk? Użyj kształtu i rozmiaru, aby element wyglądał jak przycisk.
Zrób to wystarczająco dużo
CTA powinno być wystarczająco duże, aby widzieć z daleka, ale nie na tyle duże, aby odwracać uwagę od głównej treści na stronie
Przyciski użytkownika z zaokrąglonymi narożnikami
Kształt przycisku może odgrywać dużą rolę. To jest udowodniony fakt że zaokrąglone rogi są łatwiejsze dla oczu. W teście ContentVerve zaokrąglony zielony przycisk był lepszy niż niebieski prostokąt.
5. Mniej znaczy więcej, jeśli chodzi o wybory
Pamiętaj, że jeśli chcesz, aby Twoi klienci podejmowali działania, musisz im pomóc, usuwając wszelkie możliwe przeszkody z ich drogi. Kiedy użytkownicy otrzymują zbyt wiele wyborów, mają tendencję do dezorientacji. Dlatego lepiej zaoferować potencjalnym klientom tylko jedną opcję.
Jeśli nadal chcesz uwzględniać wiele opcji przycisku, nadaj wagę jednemu wyborowi nad innymi, aby pomóc użytkownikom przejść do określonej ścieżki. Dobrym przykładem jest Evernote: gdy dojdziesz do dolnej części strony głównej Evernote, jest oczywiste, że preferowanym wyborem jest "Zarejestruj się za darmo", podczas gdy CTA dla użytkowników, którzy porównują plany, jest bardzo drugorzędny.
Wniosek
Aby uzyskać skuteczny projekt CTA, musisz wziąć pod uwagę nie tylko sam przycisk. Ważne jest również, aby myśleć o kolorze tła, otaczających obrazach, otaczającym tekście i wielu innych elementach. Zespół Basecamp zrozumiał znaczenie tych elementów i zaprojektował perfekcyjny układ strony docelowej. Nawet mikroskopia, której używają pod przyciskiem CTA ("4 714 firm zarejestrowanych w tym tygodniu!") Zwiększa zaufanie potencjalnych klientów.
Mam nadzieję, że wskazówki wspomniane w tym artykule pomogą Ci utworzyć lepszy przycisk wezwania do działania dla Twojej witryny. Ostatnią chwilą jest znaczenie testowania - jeśli zdecydujesz się odtworzyć wezwanie do działania w swojej witrynie, pamiętaj, aby przetestować, czy działa ono dla Twoich odbiorców.