Yksi kilpailija näyttää viimeistellyltä kaikilla näytöillä. Toinen näyttää ahtaalta ja vanhanaikaiselta, vaikka molemmat myyvät samanlaisia palveluja. Ero johtuu yleensä siitä, miten visuaalinen tasapaino suunnittelussa hoidetaan, ja sen taustalla olevista tavoista. Huomaat eron heti, vaikka et osaisi vielä nimetä jokaista sääntöä.
Visuaalinen tasapaino suunnittelussa jakaa visuaalisen painon niin, että sivu tuntuu vakaalta. Tässä luvussa kerrotaan selkeästi, mitä tämä tarkoittaa, miksi se vaikuttaa verkkosivuusi ja markkinointiisi ja miten voit soveltaa sitä ilman alan sanahelinää. Näet myös, miten visuaalinen hierarkia liittyy samaan kokonaisuuteen. Käydään asia läpi askel kerrallaan.
Mitä visuaalinen tasapaino suunnittelussa tarkoittaa käytännössä
Visuaalinen tasapaino suunnittelussa jakaa visuaalisen painon niin, että sivu tuntuu vakaalta.
Epäsymmetria voi tuntua modernilta, kun välit ja hierarkia pysyvät selkeinä.
Valkoinen tila suunnittelussa on työkalu raskaiden kuvien tasapainottamiseen tekstin kanssa.
Näin otat visuaalisen tasapainon käyttöön sivustollasi
Jos osion toinen puoli tuntuu raskaalta, säädä kuvan kokoa tai lisää täytettä.
Aloita yhdestä sivusta, esimerkiksi etusivustasi tai pääasiallisesta laskeutumissivustasi. Korjaa suurin ongelma ensin ja ota sama malli sitten käyttöön muissa pohjissa.
Yhdistä tämä luku sivuun tasaus suunnittelussa, joka antaa perustan, ja sivuun positiivinen ja negatiivinen tila, joka vie seuraavaan vaiheeseen tässä osiossa.
Käytännön tarkistuslista, jota voit käyttää heti
Jos osion toinen puoli tuntuu raskaalta, säädä kuvan kokoa tai lisää täytettä.
Kun käyt läpi jotakin sivua, kysy, näkyykö visuaalinen tasapaino suunnittelussa jo ensimmäisellä vierityksellä mobiilissa. Jos ei näy, vaihda osioiden järjestystä ennen kuin viilaat yksityiskohtia.
Tallenna kuvakaappaukset ennen muutoksia ja niiden jälkeen, jotta näet, mikä muutos auttoi sivustosi visuaalisen tasapainon kanssa.
Jaa tämä tarkistuslista kaikille, jotka päivittävät sivustoasi, jotta visuaalinen hierarkia pysyy yhtenäisenä uusillakin sivuilla.
Valitse yksi mittari seurattavaksi tässä kuussa, esimerkiksi sivulla vietetty aika tai lomakkeiden aloitukset, jotta suunnittelumuutokset kytkeytyvät liiketoimintatuloksiin eivätkä pelkkään makuun.
Miten tämä aihe liittyy laajempaan brändiisi
Visuaaliset valinnat eivät yleensä elä vain yhdellä sivulla. Epäsymmetria voi tuntua modernilta, kun välit ja hierarkia pysyvät selkeinä.
Somejulkaisujesi, sähköpostiesi ja painettujen materiaalien pitäisi toistaa samaa hierarkiaa, värejä ja kirjasinsääntöjä, joita käytät verkossa.
Kun brändin visuaalinen ilme alkaa hajota, asiakkaat aistivat hienovaraisen epäsuhdan, vaikka eivät osaisi selittää sitä.
Käytä sivua positiivinen ja negatiivinen tila vertaillaksesi muistiinpanoja tämän osion toisen luvun kanssa.
Epäsymmetria voi tuntua modernilta, kun välit ja hierarkia pysyvät selkeinä.
Kysymykset, jotka usein jäävät huomaamatta
Liittyvät hakusanat, kuten visuaalinen hierarkia ja valkoinen tila suunnittelussa, auttavat sinua etsimään syvällisempiä esimerkkejä ja vertaamaan työtäsi yleisiin standardeihin.
Valkoinen tila suunnittelussa on työkalu raskaiden kuvien tasapainottamiseen tekstin kanssa.
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 tiimilläsi on yhteinen sanasto visuaalisen tasapainon ympärillä, korjauskierroksia suunnittelijoiden ja toimistojen kanssa tarvitaan vähemmän.
Työkalut, jotka helpottavat visuaalisia päivityksiä
Moniin ulkoasun ja tyylin ongelmiin ei tarvita räätälöityä koodia. Visuaalisessa editorissa voit säätää välejä, värejä ja typografiaa samalla, kun katsot esikatselua mobiilissa ja tietokoneella.
WEMASY:n Sivustonrakentajassa on visuaalinen muokkaus, jolloin voit julkaista muutokset odottamatta kehittäjää jokaisen pienen säädön takia. Avaa Sivustonrakentaja, kun olet valmis soveltamaan oppimaasi.
Kun julkaiset päivityksiä, tarkista uudelleen sivut tasaus suunnittelussa ja kontrasti suunnittelussa, jotta osio pysyy yhtenäisenä mielessäsi.
Sinulla on nyt toimiva näkökulma visuaaliseen tasapainoon suunnittelussa. Käytä sitä, kun käyt läpi sivustoasi, hyväksyt markkinointimateriaaleja tai ohjeistat suunnittelijaa. Jatka sivuille kontrasti suunnittelussa ja positiivinen ja negatiivinen tila, niin pidät vauhdin yllä tässä osiossa.
Usein kysytyt kysymykset
Kuinka kauan visuaalisen tasapainon parantaminen kestää?
Useimmat pienyritykset saavat sivunsa selkeämmiksi muutamassa keskittyneessä työrupeamassa, kun soveltavat tämän luvun perusteita. Aloita etusivustasi ja ota samat säännöt sitten käyttöön palvelu- ja yhteystietosivuilla.
Tarvitsetko suunnittelijan visuaalisen tasapainon kanssa?
Suunnittelijasta on apua monimutkaisissa brändiuudistuksissa, mutta moni visuaaliseen tasapainoon liittyvä korjaus onnistuu itse, kun tiedät, mitä katsoa. Käytä tämän luvun rinnalla sivua tasaus suunnittelussa, niin saat aiheeseen liittyviä ohjeita.
Voiko WEMASY auttaa visuaalisen tasapainon käyttöönotossa verkkosivullasi?
WEMASY:n Sivustonrakentajassa on visuaalinen editori, jolla voit säätää ulkoasua, värejä ja typografiaa ilman koodia. Avaa Sivustonrakentaja, niin voit päivittää pohjia ja esikatsella muutoksia mobiilissa.
Mikä on yleisin virhe visuaalisen tasapainon kanssa?
Ihmiset yrittävät korjata kaiken kerralla sen sijaan, että etenisivät yksi sivu kerrallaan. Valitse yksi ensisijainen asia, esimerkiksi luettavuus tai kontrasti, ja katso sitten seuraavaa parannusta varten sivua kontrasti suunnittelussa.
Miten visuaalinen tasapaino suunnittelussa liittyy SEO:hon?
Selkeä visuaalinen hierarkia ja luettava teksti pitävät kävijät sivulla pidempään, mikä tukee hakukoneiden seuraamia sitoutumissignaaleja. Yhdistä suunnittelukorjaukset hyvään sisältörakenteeseen, niin tulokset ovat parhaat.
Mitä kannattaa opiskella seuraavaksi visuaalisen tasapainon jälkeen?
Jatka tämän kirjan sivuille tasaus suunnittelussa ja kontrasti suunnittelussa, niin rakennat brändillesi kokonaisvaltaisen visuaalisen järjestelmän verkkoon.