Näin suunnittelet hyvät nettisivut

 
Lähikuva ihmisestä piirtämässä suunnittelun vaiheista prosessikarttaa. Kuvassa näkyy kädet, jotka pitelevät kynää ja kirjoittavat paperille, jossa on tekstin lisäksi kaavioita ja nuolia.
 

Mitä tarkoitetaan hyvillä nettisivulla?

Itse määrittelen hyvät nettisivut selkeänä, tyylikkäänä ja toimivana kokonaisuutena, joka palvelee käyttäjien tarpeita. Käsitys hyvistä nettisivuista voi vaihdella hieman henkilökohtaisten mieltymysten mukaan, mutta tärkein erottava tekijä on suunnittelu. Hyvät nettisivut on suunniteltu taidokkaasti ja tarkoituksenmukaisesti. Nettisivujen tärkeimmät suunnitteluperiaatteet liittyvät rakenteeseen, visuaalisuuteen sekä käytettävyyteen. Siinä missä kaksi ensimmäistä ovat erillisiä alueita, on käytettävyys enemmänkin tavoite, johon tulee pyrkiä suunnittelun kaikissa vaiheissa. Nettisivujen kohdalla käyttäjäkokemusta voi pitää onnistuneena silloin kun sivut, joilla kävijä vierailee ovat visuaalisesti selkeät ja miellyttävät, hän löytää etsimänsä tiedon helposti ja nopeasti, ja saa jotain lisäarvoa. Mielestäni erinomainen onnistumisen merkki on se, jos käyttäjä kokee sivuilta poistuessaan, että nettisivuilla vietetty aika oli hyvin käytettyä aikaa.

Saatat miettiä, että onko suunnitteluun panostamisella jotain konkreettista merkitystä, vai onko se vain kiva lisä. Eikö tärkeintä ole, että on nettisivut? Ei aivan. Ensinnäkin kilpailu on erittäin kovaa. Kun internet on täynnä myös erittäin hyviä nettisivuja, niin miksi käyttäjä viettäisi aikaa huonosti toteutetuilla sivuilla. Parempi vaihtoehto voi olla vain klikkauksen päässä. Toisekseen, sinnepäin toteutetut tai vanhentuneen oloiset nettisivut voivat olla yritykselle jopa haitallisemmat kuin se, että ei olisi nettisivuja lainkaan. Stanfordin yliopiston tutkimuksessa havaittiin mm. että 46.1% tutkimukseen osallistuneista kuluttajista ilmoitti nettisivujen visuaalisen yleisilmeen yhdeksi tärkeimmistä tekijöistä arvioidessaan yrityksen luotettavuutta.

 
 

Suunnittelu ei ole eksaktia tiedettä, ja tapoja päästä hyvään lopputulokseen on paljon. Olen listannut alle kuitenkin muutamia tärkeitä ohjeita ja apukysymyksiä, joiden avulla pääsee jo hyvin pitkälle.

 
 
 
Ylhäältäpäin kuvattu kuva, jossa 3 nuorta naista istuvat lähekkäin sohvalla ja osoittavat kannettavan tietokoneen ruutua. Kuva rajautuu niin, että kasvoja ei näy.
 
 

Luo nettisivuille selkeä ja yhtenäinen rakenne

Sen lisäksi että nettisivuilla on kokonaistarkoitus, tulisi sivuston jokaisella alasivulla olla oma selkeä tehtävä (esimerkiksi aloitussivu, verkkokauppa, tietoa yrityksestä, yhteydenotto).

Suosi yksinkertaista rakennetta ja harkitse alavalikkoja tarkkaan. Mikäli ne eivät tuo sisältöön konkreettista selkeyttä jätä ne pois. Nettisivut, joilla on paljon eri sivuja ja alasivuja tuntuvat helposti raskailta ja uuvuttavilta. Käyttäjät kuormittuvat valintojen mahdollisuudesta, ja sivujen suuri määrä kertoo usein myös siitä, että haluttuja tietoja ja sisältöjä joutuu etsimään turhan pitkään.

 

Minimoi klikkaukset

Huolehdi siitä, että kaikki olennainen tieto löytyy ensivilkaisulla, tai mahdollisimman vähäisellä etsinnällä. Tiivistetysti sanottuna: jos asiakas ei löydä haluamaansa sivultasi 10 sekunnin aikana peli on menetetty. Tämä liittyy myös selkeään sivurakenteeseen, etenkin jos käyttäjän etsimä sisältö ei ole suoraan etusivulla. Silloin kun sivurakenne on riittävän yksinkertainen, käyttäjä pääsee navigoimaan helposti ja nopeasti etsimänsä sisällön äärelle. Hakuominaisuus on erittäin tärkeä sivuilla, joissa on enemmän sisältöä (esim. verkkokauppa, jossa yli kymmenen tuotetta; blogi; verkkolehti jne.)

 

Visuaalinen ilme muodostaa yhtenäisen kokonaisuuden

Visuaalinen ilme on äärimmäisen tärkeä, sillä ensivaikutelma syntyy suurimmaksi osaksi visuaalisesti. Huolehdi siitä, että sivuston fontit ja värit sopivat yhteen, ja tekstin ja taustan välinen kontrasti on riittävä. Värivalintojen ja fonttien tulisi olla linjassa yrityksen muun ilmeen kanssa. Värit välittävät tehokkaasti mielikuvia, ja siksi niiden valintaan on syytä kiinnittää huomiota. Hyvänä nyrkkisääntönä voi pitää sitä, että sivustolla olisi enintään viittä eri väriä, ja kolmea eri fonttia. Kokonaisuus kuitenkin ratkaisee. Kaiken graafisen sisällön, eli valokuvien, videoiden, kuvitusten ja muun grafiikan tulee olla laadukasta ja yhteensopivaa muun visuaalisen ilmeen kanssa. Heikkolaatuiset valokuvat luovat epäammattimaisen mielikuvan. Kuvapankkikuvat ovat parhaimmillaan loistava apukeino sivujen suunnittelussa, mutta valitse ne huolellisesti niin että ne sopivat yrityksen imagoon ja visuaaliseen ilmeeseen. Geneeriset ja irrallisen tuntuiset kuvat viestivät välinpitämättömyydestä.

 

Olennainen sisältö ja hierarkia

Sisällön tulisi olla tarkoituksenmukaista ja oikein sijoiteltua. Ensimmäiseksi mieti mikä on sivujen kannalta ydintietoa, eli tietoa, jota ilman sivun tarkoitus ei toteudu. Ydintietoa ovat esimerkiksi yhteystiedot, ja muut asiakassuhteen kannalta olennaiset tiedot ja sisällöt. Seuraavaksi voit miettiä millainen sisältö on kokemusta rikastavaa mutta vähemmän oleellista. Oheissisältö voi olla esimerkiksi yrityksen tarina, kuvia, videoita, muuta mediaa, blogi tai muuta lisäarvoa tuottavaa ja asiakassuhdetta syventävää. Turhaa täytesisältöä tulee kuitenkin välttää; mieti sisältöjen kohdalla mikä niiden tarkoitus on ja antavatko ne kävijälle olennaista tietoa tai tuottavatko ne lisäarvoa. Karsi kaikki epäolennainen. Kiinnitä huomiota myös sisältöjen hierarkiaan. Ydintiedot ja -sisällöt tulisi sijoittaa mieluiten niin, että ne löytyvät ensivilkaisulla. Lisäarvoa tuottava sisältö puolestaan palkitsee sivuilla enemmän aikaa viettävän käyttäjän, ja syventää sitoutumista.

 

Latausaika ja responsiivisuus

Sivujen latausajan tulisi olla alle kolme sekuntia. Tähän voi vaikuttaa esimerkiksi pienentämällä suurien kuvatiedostojen kokoa, ja välttämällä liian raskaan sisällön sijoittamista etusivulle. Ylipäätään sivut, joilla on paljon sisältöä voivat latautua hitaammin, joten myös siitä syystä turhaa täytesisältöä on syytä välttää.

Responsiivisuudella tarkoitetaan nettisivujen ulkoasun ja toimintojen mukautumista käytettävän laitteen mukaan. Responsiivisten sivujen avulla varmistetaan se, että sivut näyttävät hyvältä ja toimivat halutulla tavalla laitteesta riippumatta. Jos käytät valmista sisällönhallinnan alustaa, sinun ei todennäköisesti itse tarvitse tehdä sivuista mukautuvia. Esimerkiksi Squarespace-alustalla on erittäin hyvä sisäänrakennettu responsiivisuus, ja uuden 7.1 version myötä mobiilioptimointia ei tarvitse tehdä erikseen. Ennen sivujen julkaisua on kuitenkin tärkeä tarkistaa miltä ne näyttävät eri laitteilla, sekä eri internetselaimilla. Tämä koskee kaikilla alustoilla ja tavoilla tehtyjä nettisivuja ja kuuluu ns. hyvään laaduntarkastukseen.

 
 
Kuvituskuva, jossa näkyy sivulta kuvattuna 2 henkilöä työskentelemässä yhdessä pöydän ääressä. Molemmilla on kannettavat tietokoneet edessään, ja välissä nippu käsin kirjoitettuja suunnittelupapereita joihin he tekevät merkintöjä.
 
 

Apukysymyksiä suunnitteluprosessiin:

  • mikä on sivujen tarkoitus?

  • kenelle sivut on suunnattu?

  • millainen visuaalinen ilme ja millaista sisältöä niillä tulisi olla?

  • millainen ensivaikutelma halutaan saavuttaa?


Sivuja tehdessä arvioidaan näiden tavoitteiden toteutumista säännöllisesti pohtimalla esimerkiksi seuraavia asioita:

Välittyykö nettisivujen tarkoitus selkeästi? Tukeeko sivujen rakenne tätä tarkoitusta? Onko ensivaikutelma haluttu? Onko visuaalinen ilme miellyttävä? Tuntuvatko sivut toimivilta, ja onko niiden käyttölogiikka intuitiivista?

Lopuksi kannattaa vielä pyytää ulkopuolisia kommentteja ja arvioita sivuista.

Toivottavasti sait tästä kirjoituksesta ideoita ja inspiraatiota. Onnea sivujen tekemiseen, ja jos kaipaat apua nettisivujesi suunnittelussa tai toteutuksessa, niin autamme mielellämme. Noita Digitalilla teemme tyylikkäitä ja käyttäjäystävällisiä nettisivuja, ja lisäksi opetamme asiakkaitamme käyttämään Squarespace-alustaa.

 

Palveluvalikoimaamme on tulossa hyvin pian myös Squarespace-verkkokurssi, jolla voit itse luoda tyylikkäät ja laadukkaat nettisivut mahdollisimman vaivattomasti. Kurssi on erinomainen vaihtoehto, jos haluat tehdä upeat nettisivut kustannustehokkaasti, ja olet valmis toteuttamaan ne itse.

 


 

Lähde: Fogg et al., 2002. How Do People Evaluate a Web Site’s Credibility?https://dejanmarketing.com/media/pdf/credibility-online.pdf

Kuvat: Kelly Sikkema/Unsplash, Jon Schnobrich/Unsplash, Scott Graham/Unsplash

Kerttu Jaatinen / NOITA DIGITAL

Creative Web Designer from Helsinki, Finland ☃️

http://www.noitadigital.com
Previous
Previous

Kuinka laitetaan kaksi eri fonttia otsikoihin Squarespace 7.1-järjestelmässä?

Next
Next

Social media can't replace a good website