Blog / Afiliacja
Jak stworzyć landing page? cz. II - triki projektowe
W tym tekście przedstawimy różne triki i zasady budowy landing page’a, które sprawią, że będzie on bardziej przystępny dla Twoich użytkowników.W końcu tak jak biznesmen potrzebuje odpowiedniego garnituru, kobieta idealnej sukienki, tak samo landing page potrzebuje właściwego designu oraz dobrze rozmieszczonych treści.
Jeśli jeszcze nie wiesz, jak stworzyć landing page od zera, odsyłamy Cię do naszego artykułu pt. “Jak stworzyć landing page? cz. I”, w którym szczegółowo opisujemy cały proces.
Miej na uwadze, że w przeciwieństwie do czytania tego artykułu, projektowanie własnej strony to czasochłonny proces. Jednak nie zniechęcaj się. Projektując stronę samemu, możesz zaoszczędzić nawet do 25 000 zł. To jak, zaczynamy?
Trik 1 - Cztery punkty mocy
Być może robiąc zdjęcie, zdarzyło Ci się ujrzeć “siatkę” na ekranie? Jest to związane z “zasadą trójpodziału” i tak się składa, że jest ona używana również w projektowaniu stron internetowych. Według tej zasady strona jest wizualnie podzielona na trzy części i składa się z 9 identycznych kwadratów.
Kropki w środku czterech przecięć linii to są właśnie “punkty mocy”. Wszystko, co mieści się w tych granicach, ludzkie oko wyłapie jako pierwsze. Tworząc landing page staraj się umieścić najważniejsze elementy na ich skrzyżowaniach.
Trik 2 - Prawo Hicka
Kolejny trik, który może Ci się przydać pochodzi od Williama Edmunda Hicka, brytyjskiego psychologa. Twierdził on, że czas potrzebny do podjęcia decyzji wydłuża się wraz ze wzrostem liczby możliwych wyborów. Oznacza to, że im więcej opcji mamy do wyboru, tym więcej czasu będziemy potrzebować na podjęcie decyzji.
W trakcie badań Mark Lepper i Sheen Iyengar odkryli, że stół z 24 rodzajami dżemu jest mniej atrakcyjny niż stół z 6 rodzajami dżemu. Kiedy osoba otrzymywała zbyt duży wybór, prawdopodobieństwo, że coś kupi, spadało 10 razy. Jak użyć tego podczas tworzenia landing page’a? Ogranicz ilość CTA oraz buttonów i skup się na jednym celu. Przemyśl wszystkie możliwe decyzje użytkownika na stronie i zredukuj je, jak najbardziej możesz.
Trik 3 - Model “F”
Wiele badań pokazuje, że podczas przeglądania tekstu wzrok człowieka podświadomie porusza się w określonym schemacie. Najpierw patrzymy od lewej do prawej, potem przesuwamy się w dół, a najmniej uwagi zwracamy na prawy dolny róg - skanujemy.
Jeśli chcesz ułatwić swojemu użytkownikowi przyswajanie informacji i poprawić konwersję, umieść najważniejsze elementy wzdłuż litery F, a wszystko mniej ważne poza nią. Wygodne drogi kontaktu powinny znajdować się w widocznym miejscu: sieci społecznościowe, telefony itp.
Trik 4 - Zasada 8 sekund
Na zainteresowanie użytkownika masz jedyne 8 sekund (a według najnowszych badań nawet mniej). Przykro to mówić, ale tyle właśnie wynosi zdolność człowieka do skoncentrowania się na jednej rzeczy. Jak więc przykuć uwagę użytkownika w 8 sekund?
- Spraw, aby tytuł był chwytliwy i interesujący, a dodatkowo ważne, aby szybko i zwięźle informował o zaletach produktu/strony i dotykał problemów, z jakimi klient się zmaga.
- Uzupełnij przekaz przyciągającymi wzrok obrazami, które przekażą główny cel produktu.
- Zrób widoczny i krótki przycisk CTA.
Trik 5 - Prawo podobieństwa
Człowiek odbiera całą strukturę inaczej niż jej poszczególne elementy. Lubimy mieć w pobliżu obiekty, które są do siebie podobne, ale znajdują się w oddzielnych grupach.
Wykorzystaj tę regułę. Załóżmy, że Twój produkt ma świetne opinie. Wykorzystaj to i umieść wniosek lub formularz do zapisu obok referencji.
Trik 6 - Dowód społeczny
Dowód społeczny to różne certyfikaty, dyplomy, czy świadectwa. To ostatnie jest szczególnie ważne. Badanie przeprowadzone przez Data Insight i AliExpress wykazało, że 9 na 10 zakupów jest finalizowanych, po zapoznaniu się klienta z recenzjami. Jak to wykorzystać podczas tworzenia strony internetowej? Dodaj do swojej witryny opinie klientów.
Trik 7 - Linia zanurzenia
Obiło Ci się to o uszy? Jeśli nie, to szybko tłumaczymy. Linia zanurzenia to część strony internetowej, która widoczna jest bez konieczności scrollowania, żeby zobaczyć dalszą część.
Raczej Cię to nie zdziwi, że ludzie z roku na rok czytają coraz mniej. Zazwyczaj wygląda to tak, że skanujemy jedynie artykuł wzrokiem. The Nielsen Norman Group Research udowodniła, że treść umieszczona powyżej linii zanurzenia jest o 84% lepiej traktowana przez użytkowników, niż treść poniżej.
Dlaczego? Odpowiedź jest prosta - oglądanie treści poniżej linii zanurzenia wymaga dodatkowego wysiłku (przewijania strony). Wniosek jest taki, że im dłuższa treść, tym mniejsze prawdopodobieństwo tego, że użytkownicy będą się zagłębiać w Twoim tekście.
Landing Page - Design i UX
Pierwszym krokiem w wyborze designu Twojej strony jest zastanowienie się, kto należy do Twojej grupy docelowej. Kobiety czy mężczyźni? Czym się zajmują? Co robią w wolnej chwili? Jaki jest ich cel i czego oczekują? Odpowiadając na takie pytania, ułatwiasz sobie zadanie. Wiesz, czy użyć pastelowych i relaksujących kolorów, czy też może ciemnych i tajemniczych. Gdy znasz już podstawowe informacje, jak ma wyglądać Twoja strona i masz wstępną wizję, trzymaj się zasad poniżej.
Zasada nr 1 - Wysokiej jakości grafiki
Jedno z badań Bright Local wykazało, że 60% osób preferuje wyniki wyszukiwania zawierające obrazy. Z kolei badania Skyword wykazały, że interesujące grafiki uzyskują średnia 94% więcej wyświetleń. Więc przy wyborze grafik staraj się unikać tych nudnych i stereotypowych, znajdź coś oryginalnego i ciekawego. Zazwyczaj takie grafiki będą płatne, ale istnieje wiele stron, które oferują masę obrazów wysokiej jakości za darmo. Poniżej przygotowałem dla Ciebie listę takich stron:
- Pexels,
- Unsplash,
- StockSnap,
- Negative Space,
- Superfamous Studios,
- Little Visuals,
- Gratisography,
- Kaboompics,
- Picjumbo.
Rozmiar grafik
Kolejnym ważnym czynnikiem, który wpływa na cały user experience to szybkość strony, a co za tym idzie rozmiar grafik oraz filmów. Powinny być one jak najlżejsze, bez utraty jakości.
Do kompresowania zdjęć przez użytkowników polecamy:
Do kompresowania zdjęć przez użytkowników MacOS polecamy:
W kompresji zdjęć online pomogą:
Rozmiar video
Jeśli chodzi o rozmiar plików video, sprawa wygląda podobnie jak w przypadku zdjęć. Temat jest jednak nieco bardziej skomplikowany. Zdjęcia mogą mieć jedynie parę MB, podczas gdy filmy najczęściej wychodzą w setkach, co może mocno spowalniać Twoją stronę.
Najlepsze programy do kompresowania filmów:
- Any Video Converter Free,
- Leawo Prof. Media,
- Freemake Video Converter,
- Konwerter wideo WinX,
- MediaCoder (tylko Windows),
- Konwerter multimediów AVS (tylko Windows),
- Total Video Converter,
- HandBrake.
Zasada nr 2 - Kolory
Kolory w marketingu odgrywają bardzo ważną rolę, a ich dobór powinien być przemyślany. Wpływają one przede wszystkim na to jak użytkownik postrzega Twoją firmę. Jeśli chcesz się więcej dowiedzieć o psychologii kolorów w marketingu i afiliacji, zrobisz to, czytając nasz artykuł pt. “Psychologia kolorów w afiliacji. Jak szczegóły zmienią Twój zarobek?”.
Pamiętaj, że kolory marki powinny być zgodne z jej misją, a przede wszystkim muszą przemawiać do Twojej grupy docelowej. Natomiast najważniejsza jest Twoja oferta i jakość usług.
Dodatkowo używanie kolorów jest ważne, jeśli chodzi o dostępność dla osób z niepełnosprawnościami, co poruszamy w zasadzie 4. Pamiętaj, żeby nie umieszczać dwóch różnych jaskrawych kolorów obok siebie, a zwłaszcza niebieskiego i zielonego, bo może to sprawiać problemy daltonistom. Najbardziej czytelną kombinacją kolorów jest czerń na bieli.
Zasada nr 3 - Jasne i wyraźne nagłówki
Użytkownik musi zapamiętać Twoją stronę i chcieć na nią wrócić. Stawiając na jasny (niejaskrawy) i wyraźny nagłówek, bardzo mu w tym pomagasz. Warto zwrócić uwagę na osoby z niepełnosprawnościami lub te wykluczone cyfrowo i ułatwić im korzystanie z naszej strony. Poniżej przedstawiamy, jak to powinno wyglądać.
Zasada nr 4 - Dostępność dla osób z dysfunkcjami
Żeby ułatwić poruszanie się osobom z niepełnosprawnościami, sporządziliśmy dla Ciebie listę punktów, które powinno się uwzględnić podczas projektowania witryny internetowej. Dodatkowo tak dostosowane treści wpłyną pozytywnie na SEO, co przełoży się na lepsze pozycjonowanie w Google czy innych przeglądarkach.
Opisy ALT
Opisy ALT, czyli alternatywne opisy zamieszczanych na Twojej stronie obrazków. Dzięki temu oprogramowanie do czytania stron poinformuje użytkownika, co tam się znajduje. A w przypadku słabego internetu, zobaczysz, co jest na grafice, więc to rozwiązanie nie jest tylko do czytania przez oprogramowanie.
Napisy do filmów
Jeśli Twoja strona internetowa zawiera wiele filmów, dobrze jest dodawać do nich napisy, które mogą pomóc osobom niesłyszącym. W przypadku dłuższych nagrań audio dobrym wyjściem jest tworzenie dla nich transkrypcji. Program online, który pomoże Ci w automatycznym dodawaniu napisów to np. veed.io.
Odpowiednio edytowane i zaznaczane linki
Zamiast zawierania linków w słowach “Kliknij tutaj”, lepiej napisać: “Po więcej informacji, odwiedź stronę [adres strony]”, to bardzo pomoże osobom niewidomym. Dodatkowo zaznaczaj hiperłącza innym kolorem niż zwykły tekst. Dzięki temu użytkownicy nie będą musieli ich szukać kursorem.
Wielkość przycisków
Jeśli przyciski przekierowujące na kolejne podstrony Twojej witryny są zbyt małe, mogą sprawiać problem osobom, które mają trudności w nawigowaniu po stronie. Zadbaj o to, aby „klikalna” sfera przycisków zawsze była odpowiednio duża.
Nawigacja za pomocą klawiatury
Twoja strona powinna być tak zbudowana, aby naciśnięcie przycisku „TAB” w logiczny i intuicyjny sposób przeniosło użytkownika z paska adresu do menu i reszty obszarów strony. Dzięki temu użytkownicy z niepełnosprawnościami będą mogli w dogodny sposób poruszać się po Twojej stronie.
Zasada nr 5 - Przestrzeń
Kolejna sprawa to przestrzeń na Twojej stronie, użytkownik powinien szybko i bez zbędnego wysiłku wiedzieć, o czym jest Twoja strona i czego może się na niej spodziewać. Jasne jest, że nie chcesz, aby Twój landing page wyglądał, jak strona z 2010 r. gdzie wszędzie jest tekst i reklamy, a użytkownik nie wie, co zrobić. Takie sytuacje są dziś bardzo rzadkie. Spójrz jednak na poniższy przykład strony, która mogłaby być zaprojektowana nieco lepiej.
Początek nie jest taki zły, prosta informacja, czym firma się zajmuje i czego można się od niej spodziewać. Skup się teraz na tym co znajduje się poniżej. Użytkownik jest bombardowany różnymi linkami i zdaniami, które przypominają mu spam. Właśnie tego powinieneś unikać.
Zasada nr 6 - Przejrzyste menu i symetria
Tak jak nagłówek powinien być prosty, podobnie jest z menu. Dzisiaj standardem jest jeden główny pasek menu na górze, przejrzysty i łatwy do nawigacji. Zwróć szczególną uwagę, aby Twój landing page był symetryczny, ludzkie oko bardzo to lubi.
Zasada nr 7 - Stopka
Ostatnim, ale nie mniej ważnym punktem jest stopka, jak powinna wyglądać i co powinna zawierać? Stopka, powinna być głównie przemyślana, prosta i ciekawa. Trzeba się zastanowić, czego oczekujemy od użytkowników, którzy dotrą na dół strony? Jeśli znasz odpowiedź na to pytanie, znacznie łatwiej będzie Ci zaprojektować dobrą stopkę. Zwykle odwiedzający stronę przewijają ją, aby znaleźć dane kontaktowe.
Nie znaczy to, że nie możesz umieścić tam rzeczy, które są dla Ciebie bardzo istotne. Pamiętaj o tym, że stopka powinna odpowiadać potrzebom użytkowników i jednocześnie pozwalać realizować Twoje cele. Poniżej przykłady informacji, które może zawierać stopka:
- polityka prywatności i warunki korzystania,
- dane kontaktowe,
- nawigacja,
- odnośniki do mediów społecznościowych,
- zapis do newslettera.
Landing Page - treści tekstowe
Po utworzeniu odpowiednich nagłówków i przycisków kolejnym krokiem jest stworzenie treści na stronie. Logiczne jest, że wszystko powinno być związane z ofertą, którą promujesz i zachęcać do zakupu tego produktu.
Główne zasady tworzenia przejrzystych treści to hierarchia i system: każdy blok powinien być na swoim miejscu. Możesz zrobić szkic w PowerPoint lub na kartce papieru, aby spróbować odtworzyć strukturę. Przejrzysty interfejs można uzyskać tylko wtedy, gdy odpowiemy na główne pytania: co, gdzie, gdzie i dlaczego. Informacje powinny przebiegać sekwencyjnie: jaki produkt, dlaczego użytkownik go potrzebuje. Możesz określić referencje, aby zwiększyć zaufanie. Witryny LeadGeneration powinny publikować treści krok po kroku, jak najkrótsze i najprostsze. Minimalizacja kroków zwiększy współczynniki konwersji.
Więcej o tworzeniu treści dowiesz się z jednego z odcinków podcastu “Afiliacja i inne zjawiska marketingowe”.
Już tu jesteś?
Mamy nadzieję, że Twoje dotarcie do tego momentu jest równoznaczne z tym, że wiesz już jak zaprojektować swoją stronę niczym profesjonalista. A może potrzebujesz alternatywy albo po prostu nie masz czasu potrzebnego do stworzenia profesjonalnego landing page'a? Na to też jest rozwiązanie. Rozważ skorzystanie z usług profesjonalnego twórcy stron internetowych.
W tym kontekście warto zwrócić uwagę na firmę AdCorso. To platforma z doświadczenie w projektowaniu i tworzeniu efektywnych landing page'ów, które przyciągają uwagę odwiedzających i przekształcają w lojalnych klientów. AdCorso oferuje kompleksowe usługi, które dopasowane są do indywidualnych potrzeb każdego wydawcy afiliacyjnego.
Dzięki współpracy z Adcorso, możesz mieć pewność, że Twoja strona docelowa zostanie stworzona z najwyższą starannością i zgodnie z najnowszymi standardami projektowymi. Zespół pomoże Ci w zaprojektowaniu atrakcyjnego układu strony, odpowiedniego dobranej kolorystyki oraz skutecznych elementów graficznych, które zachęcą odwiedzających do działania.
Aby dowiedzieć się więcej o ofercie firmy i skorzystać z jej usług, sprawdź jej ofertę AdCorso.pl/oferta/.
Ne pozostało nam już więc nic więcej, jak życzyć Ci powodzenia!