Kolory i wskazówki wizualne mogą mieć dramatyczny wpływ na współczynniki konwersji. Na przykład na Quick Sprout, Hellobar-czerwony pasek na górze strony stanowi 11% wszystkich nowych potencjalnych klientów.
To samo dotyczy KimberlySnyder.net -generuje około 20% swoich dochodów poprzez jasny, czerwony Hellobar.
To narzędzie może nie być piękne. W rzeczywistości, na niektórych stronach internetowych, wygląda to jak totalny eyesore. Ale wyróżnia się.
Widzowie online mają ograniczony zakres uwagi. Zasilają strony internetowe (i trawią informacje z prędkością miliona mil na godzinę). Jedynym sposobem na przyciągnięcie ich uwagi jest wyróżnienie się ze wszystkiego, co konkuruje o ich uwagę. Tu pojawia się kolor.
Kolor ma wartość wykraczającą poza estetykę. Tak, wszyscy mamy preferencje, ale dlaczego? Odpowiedź na to pytanie wpłynie bezpośrednio na twój marketing online i strategię optymalizacji konwersji. Kolor jest czymś, co jest zawsze wokół nas, ale rzadko myślimy o tym, jak na nas wpływa. W tym rozdziale za dużo o tym pomyślimy. Wszystko, co kiedykolwiek chciałeś wiedzieć o kolorze, zostanie uchwycone na kolejnych 20 + stronach.
Teoria Koloru
Istnieje wyraźna nauka do wybierania kolorów, które współpracują ze sobą. W grę wchodzi określony element podmiotowości (kultura, perspektywy pokoleniowe, osobiste preferencje), ale także zbiór najlepszych praktyk, których będą trzymać się psychologowie i projektanci. Colm Tuite, projektant doświadczeń użytkownika, dzieli kolor na następujące ramy.
Pures, Tints, Shades & Tones
CZYSTY KOLOR
Są to kolory, które nie są mieszane z innymi odcieniami. Są one zwykle włączone do jasnych wzorów. Każdy młodzieńczy, letni, wesoły, energiczny lub “chłodny” może skorzystać z używania czystych kolorów.
Odcienie
Są to kolory mieszane z bielą. Przekazują lżejsze, spokojniejsze i mniej energetyczne uczucie niż czyste kolory. Są również uważane za bardziej kobiece. Firmy z branży zdrowia, spa i urody mogą skorzystać z używania tych kolorów.
Odcienie
Są to kolory mieszane z czernią i skutecznie komunikują tajemnicze, ciemne, złe lub niebezpieczne nastroje. Odcienie mogą dobrze współpracować z gradientami, gdy są używane z czystym kolorem lub jaśniejszym odcieniem.
Znaczenia Kolorów
Niektóre kolory są związane z konotacjami kulturowymi, emocjonalnymi i społecznymi. Oto kilka znaczeń kolorów w świecie zachodnim.
Odcienie i odcienie mogą pomóc wpływać na uczucia, które Kolor przekazuje. Na przykład ciemniejszy odcień niebieskiego zapewniłby większe bezpieczeństwo i integralność. Jaśniejsze odcienie niebieskiego przekazałyby więcej spokoju i spokoju. Niektóre kolory rozwinęły szczególne znaczenie w czasie ze względu na użycie od niektórych organizacji(tj. skuteczny branding).
Na przykład Kościół katolicki używa głębokich odcieni fioletu i czerwieni, nadając kolorom duchowe znaczenie. Różowy stał się również kojarzony z kobiecością. Kraje przyjęły również pewne kolory jako własne (na przykład Irlandia i zielony).
Utrzymanie Prostoty
Częstym błędem podczas pracy z kolorami jest użycie ich zbyt wielu. Zwykle lepiej jest użyć jednego widocznego koloru, który jest równoważony przez neutralny kolor, taki jak biały, szary lub czarny. Gdy używasz zbyt wielu kolorów, możesz w końcu przekazać zbyt wiele uczuć lub wiadomości naraz-coś, co potencjalnie zmyli osobę oglądającą Twój projekt.
Kontrast
W przeważającej części ciemne kolory są silnymi uzupełnieniami jasnych kolorów. Dlatego większość książek jest zaprojektowana przy użyciu białego tła i czarnego tekstu. Każdy kolor ma wartość kontrastu (biały jest najjaśniejszy, a czarny najciemniejszy). Żółty i zielony mają wartości światła (więc trudno byłoby je odczytać na białym tle).
Przykład
Załóżmy, że klient podchodzi do Twojej (hipotetycznej) firmy w poszukiwaniu logo. Firma jest beauty spa, które wykorzystuje naturalne, ekologiczne produkty. Rynkiem docelowym są kobiety, a ona stara się przekazać pokojowe wiadomości, a nie energiczne. Wie więc, że odcienie są najlepszą drogą do podjęcia, w przeciwieństwie do czystych kolorów lub odcieni. Kolory, które przekazują spokój i kobiecość, to różowy, żółty, fioletowy i niebieski.
Klient naprawdę chce doprowadzić do domu, że produkty są ekologiczne. Jedną z opcji jest zielony, który przekazuje myśli o świeżości i środowisku. Poniższy odcień zieleni nie jest jednak zbyt Kobiecy:
Więc cień musiałby być trochę jasny
Jeśli chcesz również przekazać trochę spokoju, dodasz trochę niebieskiego.
Kolor I Konwersje
Oto krótkie fakty na temat wpływu kolorów na konwersje:
- 92,6% osób twierdzi, że wymiar wizualny jest czynnikiem #1 wpływającym na ich decyzję o zakupie (nad smakiem, zapachem itp.).
- Badania sugerują, że ludzie dokonują podświadomej oceny produktu w ciągu 90 sekund od pierwszego oglądania. Do 90% tej oceny opiera się na samym kolorze.
- Jedno z badań wykazało, że czytelnicy czasopism rozpoznają reklamy pełnokolorowe o 26% częściej niż reklamy czarno-białe.
- Heinz zmienił kolor swojego podpisanego ketchupu z czerwonego na zielony i sprzedał ponad 10 milionów butelek w ciągu pierwszych 7 miesięcy, co dało sprzedaż w wysokości 23 milionów dolarów.
Oto kilka dodatkowych faktów na temat wpływu kolorów na decyzje zakupowe:
- Wprowadzając na rynek nowe produkty, ważne jest, aby zrozumieć, że konsumenci umieszczają wygląd i kolor nad innymi czynnikami, gdy robią zakupy.
- 85% kupujących umieszcza Kolor Jako główny powód, dla którego kupują dany produkt.
- Kolor zwiększa rozpoznawalność marki o 80%. Rozpoznawalność marki jest bezpośrednio związana z zaufaniem konsumentów.
- Kolory nie są uniwersalne w przyrodzie. Kolory, które kuszą w Ameryce Północnej, różnią się od tych, które kuszą w Indiach. Zobacz infografikę (poniżej), aby zobaczyć, jak różne kolory wpływają na konsumentów online w Ameryce Północnej.
- Kolor nie jest jedynym elementem, który wpływa na zachowania konsumentów. Dla kupujących online, design, buzzwords i wygoda również wpływają na potrzebę zakupów.
Kolor wpływa na nas na niezliczone sposoby, zarówno psychicznie, jak i fizycznie. Psychologowie zasugerowali, że wrażenie koloru może stanowić 60% akceptacji lub odrzucenia produktu lub usługi. Zła kombinacja kolorów może mieć takie same konsekwencje dla użytkownika wynikające ze słabego kopiowania lub powolnego ładowania strony.
Płeć
ender jest czymś, o czym mówiliśmy w kilku ostatnich sekcjach — ale ważne jest dla nas, aby wyraźnie o tym mówić. W danym momencie, publiczność jest pewien odsetek mężczyzn i kobiet. Dla dobra argumentacji, mamy zamiar powiedzieć 50/50, ale rzeczywistość jest taka, że liczba ta może się wahać w zależności od firmy i branży. Jeśli nie będziesz ostrożny (i nie stworzysz zdjęć marketingowych zorientowanych na płeć), możesz stracić do 50% ruchu w sieci i konwersji.
W naszym codziennym życiu postrzegamy świat jako jednostki. Musimy zmienić naszą perspektywę i zacząć postrzegać świat jako marketerów. Kolor nie nadaje się do sprzedaży ludziom, którzy nie są tacy jak my.
Ogólnie rzecz biorąc, badania mówią, że skojarzenia płci z kolorem są niejednoznaczne.
Niektóre spostrzeżenia, które niektórzy analitycy poczynili:
- Przegląd badań nad kolorem przeprowadzonych przez Eysencka na początku lat 40. odnotowuje następujące wyniki na temat związku między płcią a kolorem. Dorcus (1926) stwierdził, że żółty ma wyższą wartość afektywną dla mężczyzn niż kobiet, a St.George (1938) utrzymywał, że niebieski dla mężczyzn wyróżnia się znacznie bardziej niż dla kobiet.
- Jeszcze wcześniejsze badania Jastrowa (1897) wykazały, że mężczyźni wolą niebieski od Czerwonego, a kobiety czerwony od niebieskiego. Badanie Eysencka wykazało jednak tylko jedną różnicę płci, przy czym żółty jest preferowany przez kobiety do pomarańczowego, a pomarańczowy do żółtego przez mężczyzn. Odkrycie to zostało później wzmocnione przez Birrena (1952), który stwierdził, że mężczyźni preferują Pomarańczowy od żółtego, podczas gdy kobiety umieszczają pomarańczowy na dole listy.
- Guilford i Smith (1959) stwierdzili, że mężczyźni byli na ogół bardziej tolerancyjni wobec achromatycznych kolorów niż kobiety. W związku z tym Guilford i Smith zaproponowali, że kobiety mogą być bardziej świadome koloru, a ich kolor smakuje bardziej elastycznie i różnorodnie. Podobnie McInnis i Shearer (1964) odkryli, że niebieski zielony był bardziej preferowany wśród kobiet niż mężczyzn, a kobiety preferowały odcienie bardziej niż odcienie. Stwierdzono również, że 56% mężczyzn i 76% kobiet preferuje chłodne kolory, a 51% mężczyzn i 45% kobiet wybrało jasne kolory. W podobnym badaniu Plater (1967) stwierdził, że mężczyźni mają tendencję do preferowania silniejszych barw niż kobiety.
Ważne jest, aby pamiętać, że konteksty kulturowe i społeczne zmieniają się cały czas. Jest tak wiele różnic w populacji, że nie będziesz w stanie zaspokoić wszystkich jednym schematem kolorów. Możesz przeczytać wszystkie badania psychologiczne na świecie, ale jeśli siedzisz i próbujesz być perfekcjonistą, nigdy nic nie zrobisz.
Najlepszy sposób, aby dowiedzieć się, czy wykluczasz mężczyzn i kobiety w marketingu? Rozmawiaj z ludźmi w Twojej docelowej bazie klientów. Zbadaj niektóre schematy kolorów, których używają twoi konkurenci. Nie zostawiaj decyzji, aby odgadnąć pracę, ale nie zastanawiaj się nad znalezieniem “właściwej” odpowiedzi (ponieważ prawdopodobnie nie będziesz).
Najlepsza odpowiedź znajduje się w Twoich danych. Oprócz prowadzenia badań jakościowych z klientami docelowymi, upewnij się, że prowadzisz spójne testy A / B.
Dostępność
Projektując swoją stronę internetową, pamiętaj, że odbiorcy postrzegają świat inaczej. Nawet jeśli masz doskonałą wizję, świat nie ma. inicjatywa W3C Web Accessibility initiative przygotowała listę zasobów, które pomogą właścicielom witryn zapewnić, że ich witryny są dostępne dla osób niepełnosprawnych. Oto przewodnik, który pomoże Ci ustalić punkty kontrolne dla dostępnych kolorów.
Jasność
poprawność, na potrzeby tej dyskusji, definiowana jest jako natężenie światła oświetlającego obiekt. Można go obliczyć jako średnią arytmetyczną współrzędnych koloru czerwonego, zielonego i niebieskiego. W3C sugeruje użycie następującego wzoru do określenia jasności kolorów:
JASNOŚĆ = ((CZERWONY X 299) + (ZIELONY X 587) + (NIEBIESKI X 114)) / 1000
Widoczny kolor powinien być jaśniejszy niż 125
Różnica Kolorów
Różnica kolorów to różnica między kolorem pierwszego planu a kolorem tła witryny. Oto wzór, który pomoże Ci obliczyć różnicę kolorów:
RED = MAX (CZERWONY PIERWSZY PLAN, CZERWONE TŁO)
– MIN (CZERWONY PIERWSZY PLAN, CZERWONE TŁO)
ZIELONY = MAX(ZIELONY PIERWSZY PLAN, ZIELONE TŁO) -MIN(ZIELONY PIERWSZY PLAN, ZIELONE TŁO)
NIEBIESKI = MAX (NIEBIESKI PIERWSZY PLAN, NIEBIESKIE TŁO)
– MIN (NIEBIESKI PIERWSZY PLAN, NIEBIESKIE TŁO)
= (CZERWONY) + (ZIELONY) + (NIEBIESKI)
Kolor tła i pierwszego planu są widoczne, jeśli różnica kolorów ma wartość większą niż 500.
Rules Of Thumb
Aby upewnić się, że Twoja witryna jest dostępna, zacznij od przestrzegania tych najlepszych praktyk:
- Użyj rozmiarów czcionek, które są wystarczająco duże, aby je odczytać. Chociaż ta wskazówka nie jest bezpośrednio związana z kolorem, ważne jest, aby pamiętać. Ostatecznie kolor nie jest samodzielną koncepcją-współpracuje z innymi elementami witryny, reklamami i stronami docelowymi.
- Trzymaj akapity krótkie, aby informacje były łatwe do strawienia (a czytelnicy nie czują się jak gigantyczny Blok koloru).
- Korzystaj z bezpłatnych, ale kontrastujących kolorów między tłem a pierwszym planem. Możesz użyć koła kolorów, aby dowiedzieć się, które Kolory potencjalnie będą dobrze ze sobą współpracować.
Znaczenie Dla Sprzedaży
Wybierając kolory dla swojej witryny, stron docelowych i przycisków wezwania do działania, nie wybierasz kolorów tylko ze względu na estetykę. Oto Wykres z Ren Walker z AdPearance, który daje przegląd kolorów w kontekście przycisków call to action (w świecie zachodnim):
Wow. To wiele opcji. Który wybrać? Nawet jeśli jesteś ekspertem od psychologii koloru, może być trudno zdecydować się na jeden kolor — na przykład na przycisk formularza. Co zrobić, jeśli chcesz stworzyć poczucie pilności, ale także zaufanie?
Najważniejszym sposobem zawężenia opcji jest rozważenie kontekstu formy. Jakiego rodzaju informacje chcesz gromadzić? Jeśli potencjalny trop musi zawierać dane osobowe poza podstawowymi danymi kontaktowymi, możesz rozważyć wybór uspokajającego koloru, takiego jak zielony lub niebieski. Powinieneś również rozważyć, jak wygląda reszta strony. Czerwony przycisk, na przykład, nie będzie wyróżniać się na stronie, która jest oparta na tym samym kolorze. Wybierz kontrastujące kolory, aby przyciski wezwania do działania (CTA) wyróżniały się na stronach docelowych.
Przyciągnięcie uwagi publiczności
Weź ten powszechnie cytowany test A/B, na przykład:
Performable – platforma e-mail marketingu, która została przejęta przez HubSpot, doświadczyła 21% wzrostu konwersji, gdy firma zmieniła swoje wezwanie na kolor przycisku akcji z zielonego na czerwony.
Efekt zmiany koloru ma wszystko do czynienia z kontekstem CTA.
Strona po lewej jest bardzo nastawiona na zieloną paletę. Zielony CTA po prostu wtapia się w otaczający kontekst strony. Czerwony jednak prezentuje drastyczny kontekst wizualny. Przycisk naprawdę wyróżnia się na tle innych elementów na stronie.
Elementy Strony Internetowej, Których Dotyczy
W poście na blogu dla CrazyEgg, Stephanie Hamilton ułożyła obszerną listę elementów strony internetowej wpływających na kolor:
Linki Tekstowe
Jednym z rozwiązań zwrócenia uwagi na monochromatyczne linki jest nadanie im słabego tła, aby usunąć je ze strony. Ta technika pomaga przypomnieć użytkownikom, gdzie są na twojej stronie. Sprawdź, jak AppZapper tworzy link “przegląd”, podświetlając go na zielono, gdy użytkownik jest na stronie.
Nawigacja
Bronto wykorzystuje nasycone kolory, aby zwrócić uwagę na nawigację w witrynie. Pomaga to skupić uwagę czytelnika na tej niezwykle ważnej (ale małej) części strony internetowej.
Przyciski
Użyj kolorów, aby przyciski wezwania do działania (CTA) Twojej witryny wyróżniały się na tle innych elementów twojej witryny. Duże, żywe przyciski pomogą użytkownikom zrozumieć, jakie działania powinni podejmować w Twojej witrynie.
Pozycje
Żywe (ale minimalne) nagłówki mogą pomóc w oświetleniu najważniejszych pojęć, które próbujesz przekazać w swojej witrynie.
Pozycje Listy
Jeśli chcesz zwrócić uwagę na pewną funkcję lub sekcję witryny, możesz użyć kolorów w sposób, który nie przytłacza reszty projektu strony.
Uzupełnij osobowość swojej marki
Osobowość marki to koncepcja, o której mówiliśmy wcześniej w tym przewodniku. Kolor stanowi potężną okazję do wyrażania siebie. Użyj kolorów, aby podkreślić istniejącą tożsamość marki i upewnij się, że łączysz ze sobą spójny styl. Ostatecznie kolor jest tylko częścią równania brandingowego i ostatecznie musi uzupełniać twój głos, osobowość, ton i wartości firmy.
Oto kroki, które doradzamy marketerom:
1. Zdecyduj, jakie emocje chcesz przekazać
Ta decyzja pomoże Ci zdecydować, jaki kolor(y) chcesz wybrać i czy musisz stworzyć mieszankę z innymi. Musisz wybrać gamę kolorów z następujących opcji:
- Monochromatyczny: trzymaj się kolorów należących do jednej rodziny kolorów (takich jak brązowy lub niebieski)
- Analogiczne: użyj dwóch lub trzech kolorów, które pojawiają się obok siebie na kole kolorów
- Komplementarne: wybierz dwa kolory, które są naprzeciwko siebie na kole kolorów
- Triadic: wybierz trzy kolory, równomiernie rozmieszczone wokół koła kolorów
2. Wybierz paletę, która najlepiej oddaje styl Twojej firmy
Ciepłe i pocieszające Brązy
Brązy przywołują Dom, palenisko, komfort i ciepło. Możesz łączyć różne odcienie brązu z szarościami lub błękitami, aby stworzyć bardzo komfortowy klimat.
Figlarne Zielenie
Jeśli Twoja marka jest pełna energii, rozważ użycie palety z zielenią, błękitem i pomarańczami. Ta kolorystyka łączy przyjemny, przyziemny klimat z wysoką energią.
Poważny Blues
Blues jest uspokajający i poważny możesz połączyć swoją kolorystykę z szarością, opalenizną lub pomarańczą, ale będziesz chciał stonować kolory drugorzędne, aby nie przeciążać odbiorców chaotycznym wyglądem i odczuciem.
Energetyczna Czerwień
Czerwone zapewniają przypływ energii. Jeśli jednak nie będziesz ostrożny, ryzykujesz przytłoczenie publiczności. Oferuj dużo białej przestrzeni, aby dać oczom użytkowników przerwę.
Poznaj Swoją Niszę
Twoja branża ma wszystko wspólnego z kolorystyką Twojej witryny i osobowością marki. Na przykład witryna finansowa powinna być na ziemi. Jeśli przesuniesz się zbyt daleko od ustalonej ścieżki, ryzykujesz mylące lub powodujące dysonans poznawczy z bazą klientów. Oto kilka przykładów schematów kolorów, które dobrze sprawdzają się w witrynach finansowych:
Ta paleta kolorów opiera się na zieleni, do której użytkownicy są przyzwyczajeni w instytucjach finansowych. Złoto nieco je zmienia, a czerń daje schematowi fundament siły i autorytetu.
Jest to silna kombinacja kolorów dla finansowej marki, ponieważ wykracza poza oczywiste skojarzenie z pieniędzmi (zielony). Złoto i czerń wzmacniają koncepcję bogactwa i zapewniają poczucie stabilności.
Oto przykład “fajnej” palety kolorów, która wykorzystuje tradycyjne kolory finansowe (zielony i niebieski):
Wykorzystując te kolory w jaśniejszych, jaśniejszych wartościach, marka kojarzy się ze światem finansów w sposób, który wygląda nowocześnie i młodzieńczo, a nie ciężkie i apodyktyczne.
Wykorzystanie białej przestrzeni nadaje witrynie czysty, lekki charakter. Jest to szczególnie ważne w przypadku witryny finansowej, która napędza biznes poprzez budowanie zaufania ze swoją bazą użytkowników.
Najważniejsze Dania Na Wynos
Kolor jest czymś, o czym moglibyśmy poważnie porozmawiać na zawsze, ale jest jeszcze wiele innych tematów, które musimy omówić w tym przewodniku. Teraz jest dobry czas, aby cofnąć się, zastanowić się nad kluczowymi pojęciami i przygotować nasze mózgi na to, co nadchodzi.
- Istnieje wyraźna nauka do wybierania kolorów, które dobrze ze sobą współpracują. Czyste kolory, odcienie i odcienie to jedne z najbardziej podstawowych odmian kolorów, z którymi będziesz pracować. Poznaj nastroje i uczucia, które mogą wywoływać twoje wybory kolorów.
- Kolory mają społeczne i kulturowe konotacje. Pamiętaj o swojej ramce odniesienia, gdy myślisz o tym, jak twoje wybory kolorów wpłyną na Twoich odbiorców.
- Pamiętaj, że ludzie czytają twoje treści z różnych perspektyw. Gałki oczne nie zostały stworzone inaczej. Niektórzy z nas mają doskonałą wizję, podczas gdy inni męczą się, aby czytać tekst na ekranie. Upewnij się, że tekst jest łatwy do odczytania za pomocą kontrastowych kolorów.
- Czerwony i zielony to Kolory najbardziej dotknięte niedoborem wzroku, zwłaszcza wśród mężczyzn. Uważaj, gdy pracujesz z tymi kolorami.
- Kolor może pomóc zwiększyć współczynniki konwersji. Podczas tworzenia CTA wybierz kolory, które znacznie kontrastują z resztą schematu kolorów. Ta śmiałość zapewnia, że Twoje Sygnały wizualne wyróżniają się. Pamiętaj, że ludzie w Internecie mają ograniczoną uwagę i są słabi. Im więcej możesz (szybko) przyciągnąć ich uwagę, tym łatwiej będziesz mieć czas na zaangażowanie ich.
- Testowanie A / B powinno być częścią procesu optymalizacji konwersji. Zamiast debatować, których kolorów użyć, pozwól, aby dane decydowały za Ciebie.
- Zwróć uwagę na standardowe schematy kolorów w swojej branży. Jeśli wybierzesz coś, co jest zbyt nieszablonowe, ryzykujesz wywołanie dysonansu poznawczego wśród odbiorców. Innymi słowy, ludzie nie będą mieli pojęcia, o czym jest Twoja marka.
- Pamiętaj, że płeć może mieć znaczący wpływ na kolor. Jednym ze sposobów, aby grać bezpiecznie (i odwołać się do szerokiej publiczności) jest wybór bluesa i zieleni.
- Kupując nowe produkty, konsumenci są mocno kołysani wyglądem. Nie rób żadnych skrótów z wyborem kolorów i projektu. Istnieją profesjonalni projektanci i konsultanci ds. brandingu, którzy mogą pomóc ci dowiedzieć się, co działa dobrze razem, a co nie. ostatecznie wszystko powinno uzupełniać osobowość Twojej marki.
- Kolor może pomóc w podkreśleniu elementów Witryny (takich jak nawigacja, listy, niektóre przyciski treści itp.).
- Kolor ma potencjał zwiększenia rozpoznawalności marki o 80%. Wybierz schematy kolorów, które są niezapomniane (ale z właściwych powodów). Starannie dobrana kolorystyka pomoże Twojej tożsamości zabłysnąć.
- W razie wątpliwości zapytaj swoich klientów, co lubią. Spójrz na kolory, których używają marki obsługujące tę samą publiczność. Jest tak wiele darmowych i kreatywnych zasobów – nigdy nie wskakujesz w ciemno