Pientä harmaata tekstiä vilkkaalla taustalla. Silmät rasittuvat jo ennen ensimmäisen lauseen loppua. Siksi värympyrä on tärkeä brändillesi. Kun asettelu ja väri taistelevat viestiä vastaan, ihmiset lähtevät kertomatta sinulle syytä.
Värympyrä järjestää sävyt niin, että näet ensisijaisten, toissijaisten ja kolmannen asteen värien väliset suhteet. 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ärioppi sopii samaan kokonaisuuteen. Käydään asia läpi askel askeleelta.
Mikä on värympyrä ja miten sitä käytetään
Värympyrä järjestää sävyt niin, että näet ensisijaisten, toissijaisten ja kolmannen asteen värien väliset suhteet.
Käytännössä värympyrä näkyy verkkosivustosi otsikoissa, palvelusivuilla, somegrafiikoissa ja painetuissa materiaaleissa. Kun osaat nimetä sen oikein, ohjeistat suunnittelijoita nopeammin ja arvioit luonnoksia varmemmin.
Lähiaiheet, kuten värioppi, liittyvät suoraan tähän. Pidä ne mielessä, kun luet loput tästä osiosta.
Se helpottaa sopusointuisten väriyhdistelmien valintaa.
Miksi värympyrä on tärkeä yrityksellesi?
Asiakkaat arvioivat uskottavuutta asettelun perusteella jo ennen kuin lukevat jokaisen sanan. Selkeä visuaalinen rakenne vähentää kitkaa ja tekee tarjouksista helpommin ymmärrettäviä.
Värioppi rakentuu ympyrän varaan, esimerkiksi kolmen värin malleissa ja jaetun komplementtivärin malleissa.
Luo värimalli värympyrätyökalulla ja tallenna heksakoodit brändidokumenttiisi.
Jos haluat nähdä, miten tämä liittyy lähiaiheisiin, lue seuraavaksi brändin väripaletti ja värikontrasti.
Käytännön tarkistuslista, jonka voit ottaa käyttöön tänään
Luo värimalli värympyrätyökalulla ja tallenna heksakoodit brändidokumenttiisi.
Kun tarkistat jotakin sivua, kysy, näkyykö värympyrä 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ärympyrää.
Jaa tämä tarkistuslista kaikille, jotka päivittävät sivustoasi, jotta värioppi 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ärioppi rakentuu ympyrän varaan, esimerkiksi kolmen värin malleissa ja jaetun komplementtivärin malleissa.
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ärimallit.
Se helpottaa sopusointuisten väriyhdistelmien valintaa.
Usein unohdettuja kysymyksiä
Sivutermit, kuten värioppi ja väriyhdistelmät, auttavat sinua etsimään syvällisempiä esimerkkejä ja vertaamaan työtäsi yleisiin standardeihin.
Värioppi rakentuu ympyrän varaan, esimerkiksi kolmen värin malleissa ja jaetun komplementtivärin malleissa.
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ärympyrästä 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 brändin väripaletti ja värikontrasti, jotta kokonaisuus pysyy mielessäsi yhtenäisenä.
Nyt sinulla on käyttökelpoinen näkökulma, jonka avulla voit ottaa värympyrä haltuun. Käytä sitä, kun tarkistat sivustoasi, hyväksyt markkinointimateriaaleja tai ohjeistat suunnittelijaa. Jatka lukemalla värikontrasti ja värimallit, niin vauhti tässä osiossa säilyy.
Usein kysytyt kysymykset
Kuinka kauan kestää päästä parempaan lopputulokseen, kun työstät värympyrää?
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ärympyrää?
Suunnittelija auttaa monimutkaisissa brändiuudistuksissa, mutta värympyrän osalta moni korjaus onnistuu itse, kun tiedät, mitä etsiä. Lue tämän luvun rinnalla brändin väripaletti, niin saat aiheeseen liittyviä lisäohjeita.
Voiko WEMASY auttaa, kun haluat hyödyntää värympyrää 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ärympyrää?
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ö värikontrasti.
Miten värympyrä 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ärympyrä on hallussa?
Jatka tässä kirjassa lukemalla brändin väripaletti ja värikontrasti, niin rakennat brändillesi kokonaisvaltaisen visuaalisen järjestelmän verkossa.