luovan tyylin nettisivut

Värikkäät ja erilaiset nettisivut

Nettisivujen visuaalinen tyyli – Osa 5

Oletko törmännyt hienoihin nettisivuihin? Jollakin tavalla erilaisiin, taiteellisiin tai värikkäisiin? Sellaisiin, joissa suu loksahtaa auki ja sanot, että ”VAU!”? Entä millä tavalla voisi tehdä erilaiset sivut? Sellaiset, joissa näkyisi luovuus ja persoonallisuus. Onko mahdollista rikkoa tuttua kaavaa?

Yleensä jo pelkät kuvat ja piirrokset voivat olla hienoja eikä muuta tarvita. Portfoliot, työnäytteet ja referenssit ovat sellaisenaan hyviä visuaalisesti. Jos kuitenkin halutaan rikkoa tuttua nettisivujen rakennetta ja tehdä sivut eri tavalla, suunnittelu vaatii vaivannäköä ja aikaa miettiä huolella ulkoasu, tekniikka ja sisältö.

+ Plussat

Mitä paremmin jäät mieleen, sitä paremmin sinut muistetaan. Jos sinulla on persoonallinen tyyli, oma tapa tehdä asioita, haluat erottua joukosta, tykkäät värikkäästä, sinulla on hienoja töitä, yrityksesi on edelläkävijä tai haluat vain kokeilla jotain uutta, miksi et tekisi sitä myös nettisivuillasi? Sanotaan ”Think outside the box”, mikä hyvin kuvaa sitä, että kannattaa miettiä ja pohtia asioita vähän eri kulmista ja tutun laatikon ulkopuolelta. Mitä voisi tehdä toisin?

Nettisivuja mietitään usein järkevästi, helpoimman kautta ja tekniikka edellä. Mitä jos sivusi olisivatkin hieno elämys tai niin hyvin mietitty, että sitä aletaan matkia? Jonkun on oltava edelläkävijä. Hyväksy myös se, että makuasioista ei voi kiistellä. ”Voi kauhia!” – kauhistelijoita riittää. Joku vaan ei tykkää, mutta toinen taas rakastaa tyyliäsi. Jos kaikki tehtäisiin keskiarvon tai yleisen mielipiteen mukaan, olisi maailma aika tylsä. Eli vedä rohkeasti vain omannäköistä linjaa!

– Miinukset

Tekniikka voi olla haastavaa erikoisilla toteutuksilla tai hankalaa päivittää. Vältä turhaa kikkailua. Mieti myös kohderyhmäsi, millainen vaatimustaso on tai osaavatko he navigoida sivuilla? Liian räväkät tai kummalliset sivut voivat karkoittaa kävijät. Hauskat tai hassut sivut voivat tuntua kivalta vain jonkin aikaa. Jos joudut uusimaan sivujen ulkoasua useasti, mieti olisiko perinteisempi tapa parempi.

Huomioitavaa

Kysy voidaanko haluamasi asiat toteuttaa teknisesti. Nykyisin pystytään toteuttamaan monenlaisia asioita. Nettisivuja katsotaan erilaisilla laitteilla, joka asettaa rajoituksia. Esimerkiksi video ei näykään mobiilissa tai elementit menevät päällekkäin tai katoavat kokonaan. Koodissa elementit ovat periaatteessa aina laatikon sisällä. Laatikon sisällä voi olla laatikko jne. Onneksi on mahdollista käyttää läpinäkyviä kuvia, tasoja ja animointeja. Lisäksi jo pelkillä väreillä ja fonteilla saa vaikuttavan näköistä jälkeä.

Sivustolla voi olla useampi sivupohja. Eli vaikka etusivu olisi asettelultaan erilainen, alasivut voivat olla perinteisempiä. Tämä helpottaa sivujen ylläpitoa.

Enemmänkin toivoisin rohkeutta visuaalisiin asioihin. Mietitään liikaa mitä muut ajattelevat tai halutaan tehdä halvalla ja nopeasti. Myös trendit ja muoti vaikuttavat. Sisustuksessa oli ensin 2000-luvun alussa valkoista, joka sitten vaihtui harmaaksi ja nyt on trendivärinä ollut mm. greige eli sellainen beigen ja harmaan yhdistelmä. Kun kaikkialla näkee samanlaista ajatellaan, että se on tyylikästä ja sopivaa.

Nettisivuja tehdään tulevaa ajatellen ehkä jopa viiden vuoden päähän. Tutki erityylisiä nettisivuja. Tutustu uusimpiin trendiennusteiisiin. Youtubesta löytyy paljon vinkkejä. Tee rohkeasti itsesi näköistä. Jos tykkäät viininpunaisesta, käytä sitä. Korosta oikeita asioita. Jos käytössäsi ei ole kuvia, esim. myyt vaikka palvelua, voi grafiikalla ja väreillä elävöittää sivuja. Jos taas tuotat kirjallista materiaalia, käytä typografiaa apunasi jne.

Kuva 1 – Visuaalisesti hieno kuva ei juuri tarvitse muuta lisää. Tässä mallissa typografia sopii hyvin kuvan kanssa yhteen. Logo ja valikko ovat alhaalla. Kuvien on hyvä olla samantyylisiä eli tällainen sivusto sopii esim. taiteilijalle. Leipätekstissä on normaalia fonttia, joka on helppo lukea.

taiteilijan nettisivut

 

Kuva 2 – Tästä syntyy VAU-reaktio, jos tykkää värikkäästä. Valkoinen teksti erottuu ja on luettava.

luovan tyylin nettisivut

 

Kuva 3 – Voisiko perinteistä asettelua rikkoa? Tässä logo ja päävalikko on keskellä kuvien välissä. Päävalikko on pelkkinä numeroina. Kuvat voivat olla vaihtuvia tai teksti animoituna ”kirjoituskone”-tyyliin. Miten tästä etenisit alasivuille? Entä miten tämä toimii mobiilissa? Pystytkö lukemaan tekstiä? Onko värit ihan tylsät vai nappivalinta?

kokeileva asettelu nettisivuille

 

Kuva 4 – Tavalliset ”konsulttisivut” saa persoonalliseksi, jos esimerkiksi käyttää rohkeasti erilaista väripalettia, perinteisen ison kuvan sijasta onkin kolme sävytettyä kuvaa, kuvien päällä on animointi ja pääviesti on ennen kuvia heti logon jälkeen. Pienistä värineliöistä löytyy lisää asiaa ja päävalikkokin on uskallettu laittaa alimmaiseksi. Mitä ajatuksia tämä herättää? Onko ihan hirveä vai olisiko tässä ideaa? PS. Klikkaa kuvan päältä, niin näet pienen animoinnin.

 

Lopuksi

Erilaisia esimerkkejä voisi tehdä nettisivuista vaikka kuinka paljon. Niitä voi toteuttaa lukuisilla erilaisilla tavoilla ja tyyleillä. Kaikkea kivaa ja säväyttävää on mahdollista tehdä. Ideointivaiheessa on lupa hullutella ja pallotella hassujakin ajatuksia. Niistä voi kiteytyä juuri sinulle sopiva visuaalinen ilme.

Pyydä ammattitaitoinen suunnittelija apuun. Ole rohkea tai valitse perinteinen sen mukaan mikä tuntuu itsellesi tai yrityksellesi sopivalta. Huomasithan myös, että tekemäni mallikuvat ovat vain visuaalisia esimerkkejä eivätkä olemassaolevia nettisivuja.

Toivottavasti tästä juttusarjasta sait vinkkejä ja heräsi uusia ajatuksia. Olethan yhteydessä minuun. Juttelen mielelläni. Ideoidaan yhdessä mitä kivaa voitaisiin keksiä.

Soita puh. 0400799755 tai sähköpostilla / Voit myös käyttää chättiä, jos se näkyy tässä vasemmalla alhaalla.

Mallikuvat © Cinnamon Graphics
Valokuvat Pexels.com ja Pixabay.com

Verkkosivujen tyyli / Nettisivujen visuaalinen tyyli – Osa 1

Minimalistiset nettisivut / Nettisivujen visuaalinen tyyli – Osa 2

Tavalliset nettisivut / Nettisivujen visuaalinen tyyli – Osa 3

Kikkailevat nettisivut / Nettisivujen visuaalinen tyyli – Osa 4