Yksi kilpailija näyttää viimeistellyltä jokaisella näytöllä. Toinen näyttää ahtaalta ja vanhanaikaiselta, vaikka molemmat myyvät samanlaisia palveluita. Ero johtuu yleensä väriyhdistelmien valinnasta ja sen taustalla olevista tavoista. Huomaat eron heti, vaikka et osaisi vielä nimetä jokaista sääntöä.
Toimivissa väriyhdistelmissä on yksi hallitseva sävy, neutraaleja värejä ja yksi korostusväri toimintoja varten. Tässä luvussa selitetään selkeästi, mitä se tarkoittaa, miksi se vaikuttaa verkkosivustoosi ja markkinointiisi ja miten sitä sovelletaan ilman, että eksyt ammattikieleen. Näet myös, miten väriyhdistelmien valinta sopii samaan kokonaisuuteen. Käydään asia läpi askel askeleelta.
Mitä väriyhdistelmien valinta tarkoittaa käytännössä
Toimivissa väriyhdistelmissä on yksi hallitseva sävy, neutraaleja värejä ja yksi korostusväri toimintoja varten.
Hyvät yhdistelmät parantavat luettavuutta ja tekevät navigoinnista ilmeistä.
Värympyrän avulla voit testata nopeasti toisiaan täydentäviä ja vierekkäisiä värimalleja.
Näin hyödynnät väriyhdistelmiä sivustollasi
Rajoita käytössä olevat sävyt kolmeen tai neljään ja esikatsele mobiilissa ennen julkaisua.
Aloita yhdestä sivusta, esimerkiksi etusivustasi tai pääasiallisesta laskeutumissivustasi. Korjaa suurin ongelma ensin ja vie sama malli sitten muihin mallipohjiin.
Lue tämän luvun parina värympyrä, joka antaa perustan, ja värikontrasti, joka vie seuraavaan vaiheeseen tässä osiossa.
Käytännön tarkistuslista, jonka voit ottaa käyttöön tänään
Rajoita käytössä olevat sävyt kolmeen tai neljään ja esikatsele mobiilissa ennen julkaisua.
Kun tarkistat jotakin sivua, kysy, näkyykö väriyhdistelmien valinta ensimmäisellä vierityksellä mobiilissa. Jos ei näy, järjestä osiot uudelleen ennen kuin hiot yksityiskohtia.
Tallenna kuvakaappaukset ennen muutoksia ja niiden jälkeen, niin opit, mikä toimi sivustollasi, kun työstit väriyhdistelmien valintaa.
Jaa tämä tarkistuslista kaikille, jotka päivittävät sivustoasi, jotta väriyhdistelmien valinta pysyy yhtenäisenä uusillakin sivuilla.
Valitse yksi mittari, jota seuraat tämän kuun ajan, esimerkiksi sivulla vietetty aika tai lomakkeiden aloitukset, jotta suunnittelumuutokset kytkeytyvät liiketoiminnan tuloksiin eikä pelkkään makuun.
Miten aihe liittyy koko brändiisi
Visuaaliset valinnat vaikuttavat harvoin vain yhteen sivuun. Värympyrän avulla voit testata nopeasti toisiaan täydentäviä ja vierekkäisiä värimalleja.
Somejulkaisujesi, sähköpostiesi ja painotuotteidesi pitäisi noudattaa samaa hierarkiaa, samoja värejä ja samoja kirjasinsääntöjä kuin verkossa.
Kun brändin ilme alkaa hajota, asiakkaat aistivat pienen ristiriidan, vaikka eivät osaisi selittää sitä.
Vertaile ajatuksiasi aiheeseen liittyvän luvun kanssa: värikontrasti.
Hyvät yhdistelmät parantavat luettavuutta ja tekevät navigoinnista ilmeistä.
Usein unohdettuja kysymyksiä
Sivutermit, kuten värioppi suunnittelijoille ja värympyrä, auttavat sinua etsimään syvällisempiä esimerkkejä ja vertaamaan työtäsi yleisiin standardeihin.
Värympyrän avulla voit testata nopeasti toisiaan täydentäviä ja vierekkäisiä värimalleja.
Kirjoita ylös yksi ennen ja jälkeen -muutos, jonka testaat toimivalla sivulla tällä viikolla. Pienet mitatut muutokset voittavat epämääräiset suunnitelmat.
Kun tiimisi puhuu väriyhdistelmien valinnasta samoilla sanoilla, korjauskierroksia suunnittelijoiden ja toimistojen kanssa tarvitaan vähemmän.
Työkalut, jotka helpottavat visuaalisia päivityksiä
Moniin asettelu- ja tyylivirheisiin ei tarvita omaa koodia. Visuaalisella editorilla voit säätää välejä, värejä ja typografiaa ja katsoa samalla esikatselua mobiilissa ja työpöydällä.
WEMASYssa on Sivustonrakentaja, jossa on visuaalinen muokkaus, joten voit julkaista muutokset ilman, että joudut odottamaan kehittäjää jokaisen pienen säädön takia. Avaa Sivustonrakentaja, kun olet valmis soveltamaan oppimaasi.
Kun julkaiset päivityksiä, lue uudelleen värympyrä ja brändin väripaletti, jotta kokonaisuus pysyy mielessäsi yhtenäisenä.
Nyt sinulla on käyttökelpoinen näkökulma, jonka avulla voit ottaa väriyhdistelmien valinta haltuun. Käytä sitä, kun tarkistat sivustoasi, hyväksyt markkinointimateriaaleja tai ohjeistat suunnittelijaa. Jatka lukemalla brändin väripaletti ja värikontrasti, niin vauhti tässä osiossa säilyy.
Taito hyödyntää väriyhdistelmien valintaa kehittyy vähitellen. Palaa tähän lukuun, kun olet julkaissut yhden parannuksen, jotta ideat siirtyvät lukemisesta tavaksi. Pienet toistuvat tarkistukset voittavat sen, että yrittää oppia kaikki säännöt kerralla. Kirjoita muistiin, mikä toimi yleisöllesi, niin seuraava päivitys sujuu nopeammin.
Usein kysytyt kysymykset
Kuinka kauan kestää päästä parempaan lopputulokseen, kun työstät väriyhdistelmien valintaa?
Useimmat pienyritykset saavat selkeämmät sivut muutamassa keskittyneessä työrupeamassa, kun soveltavat tämän luvun perusteita. Aloita etusivusta ja ota samat säännöt sitten käyttöön palvelu- ja yhteyssivuilla.
Tarvitsetko suunnittelijan, kun työstät väriyhdistelmien valintaa?
Suunnittelija auttaa monimutkaisissa brändiuudistuksissa, mutta väriyhdistelmien valinnan osalta moni korjaus onnistuu itse, kun tiedät, mitä etsiä. Lue tämän luvun rinnalla värympyrä, niin saat aiheeseen liittyviä lisäohjeita.
Voiko WEMASY auttaa, kun haluat hyödyntää väriyhdistelmien valintaa verkkosivustollasi?
WEMASYn Sivustonrakentajassa on visuaalinen editori, jolla voit säätää asettelua, värejä ja typografiaa ilman koodia. Avaa Sivustonrakentaja päivittääksesi mallipohjia ja esikatsellaksesi muutoksia mobiilissa.
Mikä on yleisin virhe, kun työstät väriyhdistelmien valintaa?
Moni yrittää korjata kaiken kerralla sen sijaan, että etenisi sivu kerrallaan. Valitse yksi ensisijainen tavoite, kuten luettavuus tai kontrasti, ja katso sitten seuraavaa parannusta varten sisältö brändin väripaletti.
Miten väriyhdistelmien valinta liittyy SEO:on?
Selkeä visuaalinen hierarkia ja luettava teksti pitävät kävijät sivulla pidempään, mikä tukee sitoutumissignaaleja, joita hakukoneet seuraavat. Yhdistä suunnittelukorjaukset hyvään sisältörakenteeseen, niin saat parhaan tuloksen.
Mitä kannattaa opiskella seuraavaksi, kun väriyhdistelmien valinta on hallussa?
Jatka tässä kirjassa lukemalla värympyrä ja brändin väripaletti, niin rakennat brändillesi kokonaisvaltaisen visuaalisen järjestelmän verkossa.