Brändinrakennus & luova suunnittelu|Verkkosivustot & muu digi|Vinkit|Artikkelit|

Väripsykologiaa www-sivuilla

Millaiset asiat vaikuttavat verkkosivuston värimaailmaan? Tässä blogissa viedään väripsykologiaa askeleen pidemmälle ja tutkitaan eri värien vaikutusta verkkosivulla.

Verkkosivustojen värimaailman valintaan vaikuttavat brändi ja kohderyhmät

Ennen verkkosivuston suunnittelua tiedämme tietysti kenelle verkkosivustoa ollaan rakentamassa. Useimmiten ennen verkkosivuston rakentamista yrityksellä on jo olemassa oleva brändi-ilme, joka kattaa muun muassa typografian ja värimaailman. Uutta verkkosivustoa lähdetään suunnittelemaan brändikäsikirjaa noudattaen. Haluammehan, että yritys näyttää itseltään myös verkossa.

Verkkosivustoa saatetaan suunnitella myös esimerkiksi kampanjalle tai tuotteelle. Tällöin verkkosivuston ilme ei välttämättä näytä yritykseltä, vaan verkkosivusto noudattaa kampanjalle tai tuotteelle suunniteltua ilmettä.

Kohderyhmät on otettu huomioon jo brändin suunnitteluvaiheessa, mutta myös verkkosivuilla ajatellaan sivuston käyttäjää. Eri alojen yritykset haluavat luoda kukin oman vaikutelmansa ja puhutella omia asiakkaitaan. Esimerkiksi aikuisiin vaikuttavat eri värit kuin lapsiin ja eri maantieteellisillä alueilla suositaan eri värejä. Täällä pohjoismaissa pidetään enemmän viileistä värisävyistä kuin trooppisissa maissa. Korkeasti koulutetut ihmiset saattavat innostua helpommin hienostuneista väreistä – erityisesti, jos niillä on epätavalliset nimet. Myös eri kulttuureissa eri väreillä saattaa olla täysin eri merkitykset. On siis tärkeää värivalintoja tehdessä tietää, missä kohderyhmät sijaitsevat.

 

Verkkosivustojen värimaailma teknisestä näkökulmasta

Teknisesti verkkosivustolle määritellään rajattu, brändin mukainen väripaletti, jossa on kaksi tai kolme pääväriä. Lisäväreiksi voidaan ottaa esimerkiksi päävärien väriasteita, eli tummempia ja vaaleampia sävyjä. Rajattu väripaletti pitää sivuston selkeänä ja auttaa tärkeiden asioiden esiin nostamisessa. Sivustoa hallitsee siis karkeasti yksi tumma tai vaalea väri, jonka väriasteiden avulla tuodaan toiminnallisuuksia sivustolle. Aksenttivärillä nostetaan esiin tärkeimpiä toimintoja. Saavutettavuuden suunnittelija huomioi sivuston värivalinnoissa – myös silloin, kun saavutettavuusdirektiivi ei koskisikaan sivustoa.

Sivuston taustaväriksi valitaan aina sellainen väri, josta teksti erottuu hyvin. Turvallisin taustaväri on valkoinen, koska siitä erottuu lähes kaikki värit – lukuun ottamatta keltaista ja hyvin vaaleita pastellivärejä. Pastellivärit sekä neutraalit harmaat ja beiget sopivat myös hyvin taustaväreiksi, kun tekstin väri on tumma. Tummalle taustalle valitaan valkoinen tai muuten hyvin vaalea teksti. Jos taustaväriksi valitaan jotain tumman ja vaalean väliltä, vaatii erityistä huomiota valita riittävän erottuva ja taustaan sointuva tekstin väri. Suunnittelija huolehtii myös siitä, että sivuston väreillä on riittävä, mutta ei silmille hyppivä kontrastiero.

Sivuston väripalettiin määritellään taustojen lisäksi tekstin, linkkien ja grafiikoiden värit. Myös valokuvien ja videoiden värimaailman tulee sointua yhteen muun sivuston kanssa. Värivalintojen avulla luodaan johdonmukaisuutta sivulle. Ne ohjaavat kävijää navigoimaan sivustolla ja johdattelevat tekemään haluttuja toimintoja. Parhaimmillaan hyvät värivalinnat helpottavat päätöksenteossa. Tästä esimerkkinä CTA-painikkeet, joiden halutaan erottuvan selkeästi muusta sisällöstä.

 

Värit verkkosivuilla

Myös verkkosivuilla värit koetaan eri tavoin riippuen siitä, kuka niitä katsoo. Väreille ei siis ole yhtä ainoaa oikeaa määritelmää, vaan ne tulee aina sovittaa kontekstiin ja käyttää tervettä järkeä värivalintoja tehdessä. Tässä koottuna yleisimpiä ajatuksia väreistä verkkosivuilla:

 

Punainen:
 Huomiota herättävä


Oranssi:
 Edullinen ja seikkailunhaluinen



Keltainen: Iloinen ja hauska



Vihreä:
 Tasapainottava, luonnonläheinen



Turkoosi:
 Selkeyttää ajatuksia ja viestiä



Sininen:
 Rehellinen ja vilpitön, kotimainen



Violetti:
 Ylellinen ja arvokas



Magenta:
 Myötätuntoinen, käytännönläheinen



Pinkki:
 Luova ja intohimoinen



Vaaleanpunainen:
 Romanttinen, nuorekas, rakastava



Ruskea:
 Luotettava, ystävällinen, maanläheinen



Musta:
 Auktoriteetti, muodollinen



Harmaa: Neutraali, hienostunut, moderni



Valkoinen: Puhdas ja raikas

 

Lisää väreistä ja niiden merkityksestä voit lukea blogista Väripsykologiaa brändinäkökulmasta.


Lue myös nämä