15 zasad projektowania stron internetowych, które zwiększą współczynnik konwersji

Wiele czynników ma bezpośredni wpływ na konwersję Twojej witryny. Najważniejszym z nich jest jednak projektowanie stron internetowych.

Pierwsze wrażenie, jakie otrzymujemy, jest wizualne i decydujące. Dlatego jeśli chcesz poprawić współczynnik konwersji w swojej witrynie, projektowanie stron internetowych jest pierwszym miejscem, od którego należy zacząć.

W tym artykule zebraliśmy podstawowe zasady i wskazówki, które pomogą Ci w tym zadaniu.

Upewnij się, że Twój projekt strony internetowej jest responsywny i przyjazny dla urządzeń mobilnych

Udział ruchu mobilnego rośnie i będzie rósł w 2020 roku. Badania sugerują, że większość użytkowników odmówi interakcji z marką, jeśli nie będzie możliwe wykonanie niezbędnej akcji z urządzenia mobilnego. Dlatego przed wprowadzeniem zmian w projekcie witryny w celu uzyskania większej liczby konwersji upewnij się, że witryna wyświetla się poprawnie na urządzeniach mobilnych, a użytkownicy nie napotykają na przeszkody na swojej drodze.

Jak to zrobić? Wszystko będzie zależeć od sposobu, w jaki stworzysz swoją witrynę. Na przykład strony na WordPressie i innym popularnym CMS będą responsywne od momentu powstania. Jednak dodatkowy test użyteczności nie będzie wygórowany.

Daj mniej możliwości wyboru zgodnie z prawem Hicka

To prawo sugeruje, że mniejsza liczba wyborów zwiększa szybkość podejmowania decyzji i odwrotnie. Na przykład, jeśli użyjesz trzech wezwań do działania jednocześnie na stronie głównej, na przykład zarejestrujesz się w serwisie, uzyskasz rabat i pobierzesz e-booka, to użytkownikowi będzie trudno zdecydować, którą akcję podjąć jako pierwszą . Znacznie rozsądniej będzie ułożyć te wezwania do działania w logicznej kolejności – ponieważ zostały wymienione i oferują użytkownikowi następną akcję po poprzedniej.

To samo dotyczy liczby produktów, które wyświetlasz na stronie. Nie należy pokazywać użytkownikowi wszystkich możliwych produktów pasujących do jego zapytania – lepiej pokazać pięć najbardziej odpowiednich opcji i umożliwić kontynuację wyszukiwania za pomocą filtrów.

Dodaj pełnoekranową bramę internetową

Pomyśl o możliwości wyświetlenia pełnoekranowego formularza kontaktowego w momencie, gdy użytkownik przewinął stronę główną do określonego punktu. Po pierwsze, pełnoekranowa forma zajmie całą uwagę użytkownika i nie pozwoli mu odwrócić uwagi na inne elementy strony, a po drugie chodzi tylko o możliwości wyboru, o których mówiliśmy wcześniej. Tak więc użytkownik otrzymuje tylko dwie opcje. Pierwszym z nich jest zamknięcie formularza kontaktowego i kontynuowanie interakcji z witryną. Drugim jest podanie swojego adresu e-mail w zamian za ofertę.

Umieść najważniejsze punkty na skrzyżowaniach

Zapewne znasz jedną z głównych zasad fotografii – zasadę trójpodziału. Zgodnie z tą zasadą dwie linie wizualnie dzielą ekran w poziomie i pionie, co daje dziewięć kwadratów. Tak więc cztery punkty przecięcia linii na środku ekranu są w centrum uwagi użytkownika, dlatego należy tutaj umieścić istotne informacje, takie jak wezwanie do działania.

Zoptymalizuj szybkość ładowania swojej witryny

Ten element jest bezpośrednio związany z projektowaniem, ponieważ Twoja strona może być przeładowana ciężkimi obrazami, które spowalniają ładowanie Twojej witryny. Usuń wszystko, co niepotrzebne i zoptymalizuj kluczowe obrazy. Według statystyk optymalna prędkość ładowania strony wynosi od dwóch do pięciu sekund. W tym przypadku musisz dążyć do niższego wskaźnika, ponieważ 40% użytkowników twierdzi, że zamknie witrynę, której ładowanie trwa dłużej niż trzy sekundy, co oznacza, że ​​tracisz potencjalną przewagę za każdym razem, gdy witryna zwalnia.

Użyj negatywnej przestrzeni, aby uzyskać pozytywne wyniki

Jan Tschichold mówi, że przestrzeń negatywna powinna być postrzegana jako element aktywny, a nie pasywne tło. Istnieje związek między dystansem a uwagą. Większy dystans przyciąga uwagę, a brak innych elementów silniej wyróżnia elementy istniejące. Projektanci mogą wykorzystać tę właściwość przestrzeni do podkreślenia ważnych elementów. Dodanie spacji do określonego segmentu treści sprawia, że ​​użytkownik zwraca uwagę na ten obszar po prostu dlatego, że na ekranie nie ma już nic, co mogłoby przyciągnąć uwagę. Jak widać na poniższym przykładzie, Google jest wielkim zwolennikiem białej przestrzeni w swoich projektach. Pomaga od razu zrozumieć cel tego projektu: nacisk kładziony jest na główny cel strony.

Wybierz odpowiednie kolory, aby stworzyć właściwe skojarzenia

Niestety nie ma uniwersalnej rady, które kolory lepiej się konwertują. Wszystko będzie zależało od specyfiki Twojego biznesu. Na przykład kolory biały i niebieski powodują poczucie stabilności i niezawodności. Dlatego PayPal używa tej kombinacji do tworzenia prawidłowych skojarzeń.

Jeśli nie masz pewności, czy Twoje kolory działają prawidłowo, po prostu wróć do początków psychologii kolorów w marketingu, a także ponownie przeanalizuj wartości swojej firmy i znajdź idealne dopasowanie.

Poza tym są różne opinie na temat koloru przycisków, które konwertują gorzej lub lepiej. Właściwy kolor guzika to stare filozoficzne pytanie. Ktoś twierdzi, że najwyższą konwersję osiąga się za pomocą czerwonych przycisków. Inni mówią na zielono lub niebiesko. Prawidłowa odpowiedź brzmi tak (podobnie jak wiele innych odpowiedzi w marketingu i projektowaniu): „Trzeba to przetestować”. Dlatego wybierz kolor przycisku, który będzie kontrastował z podstawowymi kolorami projektu, i wykonaj kilka testów, aby zrozumieć, który kolor lepiej się konwertuje.

Użyj jednego dużego obrazu zamiast kilku małych

Prawidłowy obraz może zawierać więcej niż kilka akapitów tekstu. Dlatego wykorzystaj moc percepcji wizualnej i emocji w projektowaniu swojej witryny. Na przykład możesz ustawić obraz jako tło swojej witryny, a następnie umieścić wszystkie elementy w taki sposób, aby były zgodne z podstawowymi zasadami projektowania stron internetowych. Nawiasem mówiąc, przyczynia się to również do lepszych konwersji.

Również takie podejście promuje prostotę i minimalizm, który jest trendem ostatnich lat, a odpowiednio dobrany obraz wywołuje niezbędne emocje i skojarzenia. I odwrotnie, jak już powiedzieliśmy, zbyt wiele obrazów komplikuje wybór i rozprasza uwagę użytkownika.

Pozbądź się wszystkiego, co nie jest związane z projektem

Innymi słowy, dąż do maksymalnej prostoty. We współczesnym nadmiarze szumu informacyjnego prostota i przejrzystość stały się prawdziwym niedoborem. Badania wykazały, że 76% użytkowników uważa prostotę za główny czynnik decydujący o projektowaniu stron internetowych. I tu trzeba zachować właściwą równowagę między prostotą, minimalizmem, ale jednocześnie funkcjonalnością – bo prostota to także możliwość znalezienia tego, czego potrzebuje użytkownik za pomocą kilku kliknięć.

Użyj twarzy i innych dowodów społecznych

Niestety Internet jest pełen fałszywych recenzji i nie wątp, że Twoi użytkownicy również o tym wiedzą. Dlatego zamiast zmuszać ich do szukania informacji zwrotnych na temat Twoich produktów lub usług (które mogą napisać konkurencja, aby podkopać Twój biznes), musisz dać im taką możliwość od razu.

Dlatego zastanów się nad projektem witryny w taki sposób, aby pod koniec strony umieścić kilka prawdziwych recenzji (a jeszcze lepiej karuzeli). I upewnij się, że używasz zdjęć żywych ludzi (najlepiej Twoich prawdziwych klientów), aby stworzyć wrażenie silnych dowodów społecznych.

Uprość nawigację

Prawdopodobnie widziałeś witryny zawierające milion kategorii i po prostu nie można wybrać odpowiedniej sekcji za pierwszym razem. A jeśli wcześniej użytkownicy nadal poświęcali czas na takie wyszukiwanie, dziś chcą zobaczyć, czego potrzebują bez dodatkowych działań.

Dlatego przemyśl swoje podejście do poruszania się po witrynie, zmniejsz liczbę kategorii, usuń wszystkie niepotrzebne i zostaw tylko najważniejsze sekcje. Jak już powiedzieliśmy, pełna gama wyborów komplikuje decyzję lub w ogóle zmusza użytkownika do opuszczenia strony i odłożenia zadania na później.

Zintegruj liczniki osiągnięć

To psychologiczna sztuczka, która wywołuje podświadomą reakcję – ludzie wierzą w statystyki. A to kolejna szansa na zwiększenie konwersji poprzez budowanie zaufania i tworzenie wrażenia solidności. Ale jest jeden kluczowy punkt. Pamiętasz, rozmawialiśmy o zasadzie trójpodziału i strategicznych punktach przecięcia? To są dokładnie te miejsca, w których musisz umieścić swoje statystyki, aby znalazły się w centrum uwagi i percepcji.

Stwórz wrażenie sztucznego deficytu

Marketerzy nie zgadzają się z taką taktyką sprzedaży, ale w przypadku szybkiej i sezonowej sprzedaży takie podejście jest nadal właściwe. Dlatego, jeśli masz ofertę sezonową lub promocyjną, lub jeśli testujesz zainteresowanie nowym produktem, warto stworzyć iluzję niedoboru i odzwierciedlić to za pomocą designu. Na przykład możesz ustawić minutnik i ponownie umieścić liczby w centrum uwagi odwiedzającego.

Jednak tutaj nadal musisz odpowiednio ustawić przyciski wezwania do działania. I w tym przypadku lepiej to zrobić zgodnie ze schematem Z.

Uwaga użytkownika przesuwa się wzdłuż górnej poziomej, ukośnie w dół i kieruje się do informacji na dole. W lewym górnym rogu umieść logo, poziomo – nagłówki. Prawy dolny róg to idealne miejsce na wezwanie do działania.

Zmniejsz liczbę niezbędnych kroków

Słusznie można zauważyć, że jest to odpowiedzialność projektanta UX, ale w praktyce jest to akurat przypadek, gdy web i UX designer muszą ze sobą współpracować, aby uzyskać jeden efekt. Projektowanie UX to kolejny czynnik, który ma bezpośredni wpływ na konwersje, a im mniej kroków oddziela użytkowników od akcji docelowej, tym większe prawdopodobieństwo jej ukończenia.

Dlatego musisz jeszcze raz upewnić się, że potrzebna mu informacja lub produkt znajduje się w odległości nie większej niż trzy kliknięcia.

Upewnij się, że wezwanie do działania jest we właściwym miejscu

Aby poprawić konwersję swojej witryny, skorzystaj z zasady trójpodziału i schematu Z podczas umieszczania wezwań do działania. Możesz wzmocnić odbiór wezwania do działania, jeśli je zduplikujesz – na przecięciu wierszy oraz w prawym górnym rogu strony, gdzie kończy się górna linia litery Z. W ten sposób uwaga użytkownika najpierw zatrzyma się w prawym górnym rogu, następnie przesunie się ukośnie w dół i zatrzyma się bezpośrednio w strategicznym punkcie przecięcia się linii po lewej stronie.

Minimalizuj dane wprowadzane przez użytkownika

Współcześni użytkownicy są bardzo niecierpliwi i rozmawialiśmy już o tym w akapicie dotyczącym szybkości ładowania strony. A ogromny formularz wypełniania może zabić konwersje, ponieważ nikt nie chce tracić czasu, zwłaszcza z urządzenia mobilnego. Dlatego przejrzyj formularz rejestracyjny i zostaw tylko trzy linijki – na imię i nazwisko, adres e-mail i hasło oraz dodaj możliwość rejestracji przez Google i Facebook.

Wniosek

Jak widać, wiele sztuczek może wpływać na konwersje. Jednak najważniejszą rzeczą do zapamiętania jest to, że każde nowe podejście powinno być testowane na użytkownikach. Każda firma i każda grupa docelowa jest specyficzna; w związku z tym nie może istnieć szablonowe instrukcje dotyczące tego, czego użyć w projekcie, aby zwiększyć konwersje. Ponadto projekt jest pierwszym, ale nie ostatnim czynnikiem, który konwertuje (lub nie konwertuje), o czym również należy pamiętać.