Psychologia w projektowaniu stron internetowych: Jak używać jej właściwie

Wszyscy wiemy, że psychologia to potężne narzędzie. Odpowiednio wykorzystana może wpływać i przekonywać ludzi do podjęcia działań. W świecie projektowania stron internetowych jest to niezwykle ważne.

Jeśli chcesz stworzyć skuteczną stronę internetową, która przekształca odwiedzających w klientów, musisz wykorzystać psychologię projektowania stron internetowych. Czytaj dalej, aby dowiedzieć się więcej.

Czym jest psychologia projektowania stron internetowych?

Twój projekt strony internetowej nie powinien być tylko ładny. Powinien robić wrażenie na odwiedzających, przykuwać ich uwagę i prowadzić do działania.

To właśnie tutaj wkracza psychologia projektowania stron internetowych. Każdy kolor, krój pisma i przestrzeń mają znaczenie psychologiczne, pomagając ludziom połączyć się z Twoją stroną. Elementy te wywołują podświadome reakcje, które musisz wykorzystać, aby uzyskać pożądaną akcję.

Ludzie potrzebują kilku sekund, aby zdecydować, czy Twoja strona ma wszystkie wybory i informacje, których potrzebujesz. Psychologia projektowania stron internetowych pomaga Tobie, projektantowi, zrozumieć te podświadome procesy i jak je wykorzystać.

Korzyści z wykorzystania psychologii w projektowaniu stron internetowych

Podstawową korzyścią z wykorzystania psychologii w projektowaniu stron internetowych jest rozmowa z ludźmi w ich języku. Jest to również rozmowa w Twoim języku i znalezienie wspólnej płaszczyzny porozumienia. W ten sposób możesz zbudować zaufanie.

Chcesz używać znajomych kolorów i wzorów, elementów, które wyróżniają Cię, ale także łączą z ludźmi. Musisz sprawić, by odwiedzający rozumieli, o czym jest Twoja strona i gdzie mogą szybko uzyskać więcej informacji. Następnie należy uruchomić odpowiednie bodźce. Na przykład Comic Sans jest doskonałym wyzwalaczem, który omówimy poniżej. Kolor, przestrzeń i linie również wywierają określony wpływ na to, jak ludzie postrzegają Twoją stronę.

Co ważniejsze, wszystkie te elementy nadają ton zaangażowaniu użytkowników na Twojej stronie.

Jak wykorzystać psychologię w projektowaniu stron internetowych

Teraz już rozumiesz, dlaczego znajomość podstaw psychologii człowieka jest niezbędna w projektowaniu stron internetowych. Zobaczmy, jak możesz ją wykorzystać!

1. Układ

Psychologia Gestalt pokazuje, jak poniższe elementy wpływają na odwiedzających:

• Podobieństwo - ludzie postrzegają podobne obiekty jako to samo lub przynajmniej część tej samej koncepcji.
• Bliskość - rzeczy znajdujące się blisko siebie są postrzegane jako część tej samej grupy.
• Ciągłość - chcesz, aby wzrok odwiedzającego w naturalny sposób przechodził z jednego elementu na drugi.
• Zamknięcie - obiekt, który nie jest całkowicie zamknięty, nadal jest postrzegany jako całość, ponieważ ludzkie mózgi zawsze wypełnią luki.
• Rysunek i tło - ludzie upraszczają obrazy na główne obiekty, na które patrzą (rysunek) i inne elementy (tło).

Strona Target Jobs jest tutaj doskonałym przykładem, ponieważ:

• podobne obiekty są zgrupowane: zauważ, jak pierwsze trzy zdjęcia pokazują szczęśliwych młodych ludzi w zróżnicowanych środowiskach zawodowych. Takie umieszczenie sugeruje, że Target może pomóc każdemu znaleźć wymarzoną pracę.
• Te zdjęcia są umieszczone w pobliżu konkretnych słów kluczowych: śmiejący się młodzi ludzie są umieszczeni tuż obok CTA "Poznaj możliwości." W ten sposób Target Jobs kojarzy się ze szczęściem użytkownika i jego przyszłymi szansami.
• Kolory, czcionka i przestrzenie umożliwiają płynne przejście: użytkownicy są kierowani do ciągłego przewijania w dół, przechodząc z jednej sekcji strony do następnej. Zauważ też, że każda sekcja ma swój własny temat przewodni, skoncentrowany na korzyściach Target Jobs.
• Kontrastujące kolory (pomarańczowy, biały, fioletowy, itd.) wykorzystują technikę figury i ziemi: skupiając się na jednej sekcji, pozostałe stają się częścią tła. Korzyścią jest to, że Twoja uwaga nie jest podzielona na milion kawałków; możesz skupić się na jednej rzeczy w danym momencie i zrozumieć, co Target Jobs próbuje Ci powiedzieć.

2. Kształty

Każdy kształt ma inne podświadome skojarzenia:

• Trójkąty i kwadraty reprezentują profesjonalizm, siłę i moc.
• Koła, owale i elipsy symbolizują związki, miłość i jedność.
• Linie poziome dają poczucie spokoju i wspólnoty.
• Liniepionowe reprezentują siłę i działanie.

Wystarczy spojrzeć na stronę internetową AT&T. Wszystko pokazuje społeczność i spokój, od okrągłego logo do poziomych linii ograniczających każdą sekcję.

Ale ta strona nie jest nudna. Zauważ, jak po każdym przycisku CTA ("dowiedz się więcej", "zapisz się teraz") następuje malutka strzałka. Kształt ten wykorzystuje kąt kwadratowy podzielony na dwa kąty ostre przez korpus strzałki. W związku z tym, choć mała, strzałka sugeruje działanie i siłę. Poza tym sekcje są ułożone w kwadraty, znów symbol decyzji i siły.

3. Przestrzeń

Bez względu na to, do jakiej branży należy Twój biznes, przestrzeń jest niezbędna w projektowaniu stron internetowych. Nie zagracaj swoich stron internetowych, nawet jeśli twoim naturalnym odruchem jest wciśnięcie jak największej ilości informacji.

Używaj dużo białej przestrzeni i staraj się mieć minimalistyczne podejście. Zidentyfikuj unikalny punkt sprzedaży na każdej stronie i pomóż ludziom skupić się na tym.

Sprawdź stronę internetową DOGUE. Białe przestrzenie oddzielają każdy istotny element, więc każda sekcja jest przedstawiona w sposób jasny. Pierwszą rzeczą, na którą zwracasz uwagę, jest tytuł i obrazek z radosnymi psami. Następnie Twój wzrok przenosi się na hasło po prawej stronie. Po tym, zauważasz sekcje poniżej, że ogromny "Dogue". Następna część strony podkreśla usługi firmy (np. groom, dine, play, itp.). Zauważ, jak każda usługa jest reprezentowana poprzez szybkie, łatwe do zdobycia słowo kluczowe. Poza tym, obrazy doskonale obrazują te słowa kluczowe. Jeszcze lepiej, te obrazy mają biało-szare tła, które mieszają się z białymi przestrzeniami między nimi. Więc mimo że strona jest bardziej zatłoczona niż inne, nie odbierzesz jej jako niechlujnej lub niejasnej.

SendInBlue, usługa e-mail marketingu, używa podobnego podejścia do białej przestrzeni w ich projekcie i działa świetnie, ponieważ odwiedzający stronę mogą znaleźć to, czego chcą z dużo większą łatwością, a to ogólnie wygląda dużo czyściej.

4. Kolor

Odpowiednie kolory mogą przyciągnąć uwagę, utrzymać zainteresowanie, a nawet doprowadzić do działania. Poza tym, kolor zwiększa rozpoznawalność marki o 80%.

Oto gołe minimum, które musisz wziąć pod uwagę:

• Twój cel - co chcesz, aby odwiedzający zrobili, gdy wylądują na Twojej stronie? Na przykład, jeśli chcesz, aby odwiedzający wypełnili formularz, możesz chcieć użyć koloru, który wyróżnia się i jest łatwy do zobaczenia. Chociaż niebieski jest najbezpieczniejszym wyborem, ponieważ jest najbardziej lubiany, czerwony wywołuje więcej akcji.
• Twoja publiczność - kultury mają różne skojarzenia z kolorem. Na przykład, w świecie zachodnim, biały reprezentuje czystość. Natomiast w Azji biel kojarzy się ze śmiercią i żałobą.
• Nastrój, który chcesz stworzyć - czy chcesz, aby Twoja strona była profesjonalna? Relaksująca i uspokajająca? Ekscytująca i energiczna? Jak chcesz, aby Twoja marka była postrzegana?

Strona główna Fosy jest fantastycznym przykładem koloru:

• Fioletowy i pomarańczowy tworzą pyszny kontrast, który wskazuje odwiedzającym właściwy kierunek. Zauważ, że każde CTA jest pomarańczowe - kolor pobudzający do działania.
• Fioletowy sugeruje spokój, odwagę i mądrość. To doskonały odcień dla Twojego tła, ponieważ jest tak stabilizujący.

Lending Bee Singapore wykorzystuje kolor i białą przestrzeń do zaprezentowania treści generowanych przez użytkowników na swojej stronie internetowej:

Innym doskonałym przykładem łączenia różnych kolorów w celu budowania zaufania jest strona internetowa firmy Identity Guard, która świadczy usługi ochrony przed kradzieżą tożsamości. Jak widać na stronie, używają minimalistycznego białego koloru połączonego z zielonym, który jest oficjalnym kolorem na Trustpilot (jeden z najpopularniejszych katalogów recenzji). Ten wybór kolorów pomaga podkreślić prawdziwość recenzji wraz ze wzmianką, że te recenzje pochodzą z Trustpilot.

5. Kroje pisma

Dobry projekt strony internetowej jest jak dobry strój: powinien przyciągać wzrok, ale nie powinien być zbyt przesadzony.

To samo dotyczy krojów pisma.

Podczas gdy strona internetowa powinna używać różnych krojów pisma, aby dodać zainteresowania, ważne jest, aby używać ich z umiarem. Zbyt wiele różnych krojów pisma może być przytłaczające i sprawić, że strona będzie wyglądać na zagraconą.

Zamiast tego, skup się na użyciu kilku najważniejszych krojów pisma w całej witrynie i używaj ich odmian (takich jak pogrubienie czy kursywa), aby dodać wizualnego zainteresowania. Na przykład, możesz użyć kroju szeryfowego do nagłówków i bezszeryfowego do tekstu głównego.

Poza tym, że czcionki po prostu dobrze wyglądają, mogą być również używane do kierowania użytkowników do podjęcia określonych działań. Na przykład czcionki bezszeryfowe, takie jak Arial lub Helvetica, są ogólnie uważane za bardziej czytelne w sieci, co czyni je dobrym wyborem dla tekstu głównego. Z drugiej strony, skrypty i czcionki ozdobne lepiej nadają się do nagłówków lub wezwań do działania, ponieważ pomagają zwrócić uwagę na istotne elementy na stronie.

Strona Kapitana Marvela wygląda jak coś, co 10-latek zaprojektowałby w latach 90. Ta strona jest straszna od glitterów, gifów, zatłoczonej przestrzeni i obrzydliwego kroju Comic Sans.

I o to chodzi; unikając plot-spoilerów, Captain Marvel jest związany z latami 90-tymi, a retro wygląd jest częścią tego przekazu. Morał ze strony jest taki, że czasami trzeba być odważnym i łamać zasady, jeśli chce się przekazać odbiorcom pewne uczucie. Marvelowi udaje się to dzięki prostemu projektowi, który działa jak wehikuł czasu do dawno minionych lat dziewięćdziesiątych.

Zawiń do góry

Jeśli chcesz utrzymać uwagę odwiedzających Twoją stronę, podtrzymać zainteresowanie i skłonić ich do działania, koniecznie wykorzystaj powyższe zasady projektowania. Wykorzystując przestrzeń, kroje pisma, układ, kształty i kolory w projekcie strony internetowej, możesz stworzyć stronę, która jest zarówno atrakcyjna wizualnie, jak i skuteczna w przekazywaniu wiadomości.

Jednakże, te zasady są tylko wytycznymi. Powinieneś zachować odwagę i kierować się intuicją. Pamiętaj, że sensem projektowania stron internetowych jest przemawianie do odbiorców za pomocą ich języka.