Kulissien takana: Näin meillä tehdään verkkosivuja

6.10.2018Antti Rauhala

Verkkosivuja voi tehdä loputtoman monella tavalla. Toteutustapoja on suunnilleen yhtä paljon, kuin on tekijöitäkin. Yhdessä ääripäässä syötetään valmiiseen verkkosivupohjaan nopeasti tekstit ja kuvat. Toisessa päässä taas käytetään satoja työtunteja pelkästään käyttökokemuksen suunnitteluun.

Nyt aionkin läpinäkyvyyden nimissä avata liikesalaisuuksia. Näin meillä Sivututkalla rakennetaan uniikkia ja erottuvaa internettiä:

Vaihe 1: Tutustuminen ja tarpeiden selvitys (1 päivä)

Olet saanut meiltä tarjouksen verkkosivuprojektista. Kaikki vaikuttaa hyvältä ja uskot, että Sivututkan tyyppeihin voi luottaa. Varsinkin, kun menivät lupaamaan täyden tyytyväisyystakuun koko hommalle. Jos projekti menee pieleen, niin ainakaan rahojani en menetä. Hyväksyt tarjouksen ja työt voidaan aloittaa.

Aivan aluksi tutustumme sinuun ja yritykseesi. Tässä tarkoituksena on ymmärtää bisnestäsi, tavoitteitasi ja asiakkaitasi. Tämä on kriittisen tärkeää, jotta pystymme suunnittelemaan ja rakentamaan mahdollisimman hyviä tuloksia tuottavat sekä kohderyhmääsi puhuttelevat verkkosivut.

Hommaa varten tavataan noin parin tunnin ajan joko etänä tai ihan kasvotusten. Kysymme oikeita kysymyksiä ja juttelemme mm. seuraavista asioista:

  • Mikä on sivuston tarkoitus, eli mihin sivustolla pyritään?
  • Mikä on käytännön tavoite, mitä sivustolla kävijän halutaan tekevän?
  • Keitä ovat tärkeimmät asiakkaasi ja kohderyhmäsi?
  • Ketkä ovat kovimmat kilpailijasi?
  • Miten eroat kilpailijoistasi? Miksi asiakkaasi ostavat juuri sinulta?
  • Millaista sisältöä sivustolle tullaan julkaisemaan?
  • Millaisia tuntemuksia sivustolla kävijässä halutaan herättää?

Kun olemme jutelleet tarpeeksi kauan ja meillä on toimintasi, kohderyhmäsi ja tavoitteet kirkkaana mielessä, niin pääsemme aloittamaan ajatustyön ja suunnittelun.

Vaihe 2: Tyylin suunnittelu (1 viikko)

Seuraavaksi ryhdymme miettimään minkälainen tyyli ja tunnelma sopii yrityksellesi sekä puhuttelee asiakkaitasi. Tyylin suunnittelussa täytyy käyttää vähän empatiaa ja yrittää samaistua kohderyhmään sekä heidän sielunmaisemaan. Minkälaisia tuntemuksia halutaan herättää? Sopisiko sivustolle äijämäisen rouhea vai kenties elegantimpi tyyli? Millä tavalla nämä saataisiin parhaiten esitettyä?

Tämä vaihe luo pohjan itse sivuston suunnittelulle. Tyylin suunnitteluun kuuluu mm:

  • Fonttien valinnat ja typografian, eli fonttien yksityiskohtien suunnittelu
  • Värimaailma ja värien käyttö
  • Graafisten ja visuaalisten elementtien suunnittelu
  • Kuvamaailman luonnostelu

Nämä kaikki koostetaan kuvamuotoon, jota kutsumme tyyliluonnokseksi. Tyyliluonnos lähetetään sinulle ihmeteltäväksi ja pääset sitä kommentoimaan sekä tekemään halutessasi muutosehdotuksia.

Tässäpä muutamia esimerkkejä tekemistämme tyyliluonnoksista:

Volter tyyliluonnos

Volter tyyliluonnos

 

osako-tyyliluonnos-sivututka-asiakas-kokemuksia

Osako tyyliluonnos

 

Kampin Kiropraktiikka tyyliluonnos

Kampin Kiropraktiikka tyyliluonnos

 

Sisustusliike Decora tyyliluonnos

Sisustusliike Decora tyyliluonnos

Vaihe 3: Sivuston suunnittelu (2-4 viikkoa)

Kun tyyli on hanskassa, on aika käydä itse sivuston rakenteen ja ulkoasun kimppuun. Tätä suunnitteluvaihetta voisi verrata hyvin rakennusmaailman arkkitehdin työhön. Ilman hyvää suunnitelmaa ja piirrustuksia toteutus jää puolivillaiseksi, jolloin priimajälki voi olla mahdoton saavuttaa.

Tämä vaihe sisältää paljon muutakin, kuin vain eeppisen hienon ulkoasun luomisen sivustolle. Rakenteen tulee palvella sivuston tavoitetta ja tarkoitusta. Kohderyhmä pitää huomioida. Ydinviesti täytyy tehdä selväksi kävijälle. Tämä kaikki esteettömyys huomioiden.

Sivuston suunnittelussa tehdyt valinnat pohjautuvat pitkälti tutustumisvaiheessa tehtyihin havaintoihin. Jos tavoitteena on esimerkiksi kerätä potentiaalisilta asiakkailta yhteydenottoja lomakkeella, niin sivusto suunnitellaan ohjaamaan kävijää tätä tavoitetta kohti ja sen toteuttaminen suunnitellaan kävijälle mahdollisimman helpoksi.

Emme käytä halpoja oikoteitä myöskään tässä vaiheessa. Siksi parhaan lopputuloksen saamiseksi suunnittelemme jokaisen yksittäisen sivun uniikiksi ja tarkoitustaan mahdollisimman hyvin palvelevaksi.

Verkkosivuille tulevat sivut piirretään kuvamuotoon ja koko pläjäys koostetaan yhteen suunnitelmaan, joka sisältää mm:

  • Sivuston tarkoituksen ja tavoitteet
  • Sivukartta, eli sivustolle tulevat yksittäiset sivut listattuna
  • Leiskat, eli yksittäisten sivujen suunnitelmat kuvamuodossa
  • Tekstikuvaukset sivujen logiikasta ja toiminnoista

Suunnitelma lähetetään sinulle ja pääset taas halutessasi kommentoimaan sekä tekemään muutosehdotuksia. Alla muutamia poimintoja suunnittelemistamme leiskoista:

Volter leiskat

Volter leiskoja

 

Kampin kiropraktiikka leiskat

Kampin Kiropraktiikka leiskoja

 

Rewolmet leiskakuvat

Rewolmet leiskaa

 

Decora leiskat

Sisustus Decora leiskoja

Jos sinulla ei ole jykevää luottoa omiin kirjoitus- tai myyntitaitoihin, niin tässä vaiheessa luodaan myös tekstisisältö sivujasi varten. Sisällöntuottajamme kirjoittaa hakukoneoptimoidun ja myyvän tekstisisällön raakaversion, jota viilaillaan kommenttiesi perusteella valmiiksi.

Vaihe 4: Toteutus ja koodaus (1-3 viikkoa)

Räätälöityjen suunnitelmien toteutus sujuvaksi ja helppokäyttöiseksi verkkosivustoksi ei onnistu ihan aloittelevalta junior-tason kehittäjältä. Loistavatkin suunnitelmat on helppo ryssiä toteutusvaiheessa, jos koodarilla ei ole homma hanskassa.

Rakennamme sivustosi meidän itse kehittämän WordPress-pohjateeman päälle. Riisuttu pohjateema toimii aloituspisteenä toteutukselle. Teemassa ei ole mitään ylimääräistä, joten latausajat pysyvät kurissa ja siitä on helppo lähteä sorvaamaan sivustoa suunnitelmien mukaiseksi. Tiedämme, että käsityöllä saadaan aikaan paras lopputulos, joten emme käytä kankeita ja hitaita valmisteemoja koskaan.

Sivusto toteutetaan testiosoitteeseen, josta pääset sitä itsekin kokeilemaan ennen lopulliseen osoitteeseen julkaisua. Pääset jälleen tekemään muutosehdotuksia sivustolle ja vaikuttamaan lopputulokseen.

Emme kuitenkaan ole robotteja ja toteuta heti kaikkia villeimpiä pyyntöjäsi kyselemättä. Asiantuntijana ja kumppaninasi meidän tehtävä on toteuttaa yritystäsi auttavat verkkosivut. Jos jokin pyyntösi vaikkapa heikentäisi mielestämme sivuston käyttökokemusta, niin saat tästä välittömän palautteen ja perustelut.

Kehittäjämme toteuttaa modernit verkkosivusi kaikilla tämän päivän standardeilla ja mausteilla:

  • Responsiivinen toteutus: verkkosivut mukautuvat parhaalla mahdollisella tavalla käytettävään laitteeseen.
  • Muokkaus tehdään helpoksi: sivuston sisällön muokkaus tehdään sinulle helpoksi erilaisten sisältökenttien avulla.
  • Hakukoneoptimointi: sivujen tekninen puoli säädetään siten, että sijoitus hakukoneissa on mahdollisimman hyvä.
  • Animointi: sivusto maustetaan ja herätetään eloon pienillä animoinneilla, jotka parantavat käyttökokemusta.
  • Latausnopeuden optimointi: kuvat ja muut tiedostot optimoidaan pienikokoiseksi sekä huolehditaan välimuistitus ym. asiat, jotta kävijät eivät tuskastu hitaisiin sivuihin.
  • Analytiikka: sivustolle asennetaan Google analytics -työkalu, josta saat rahanarvoista tietoa kävijöistä ja sivustosi toiminnasta. Analyticsiin asetetaan tavoitteet, joista pääset seuraamaan kuinka hyvin sivusto pärjää sille asetetussa tehtävässään.

Vaihe 5: Viimeistely ja julkaisu (1 päivä)

Sivusto on nyt rakennettu testiosoitteeseen, kaikki ovat siihen tyytyväisiä ja saamme sinulta vihreää valoa julkaisemiselle.

Siirrämme uutuuttaan kiiltävän sivustosi koko kansan ihmeteltäväksi lopulliseen osoitteeseensa. Teemme viimeiset näkymättömämmät viilaukset mm. hakukoneoptimointiin sekä testaamme sivut vielä kerran huolellisesti kaikilla yleisimmillä nettiselaimilla ja laitteilla.

Lopuksi annamme sinulle ”avaimet” sivustollesi, eli saat tunnukset sivuston hallintaan. Mukaan saat myös kuvalliset step-by-step käyttöohjeet sisällön muokkauksen ja sivuston hallintaan.

Aika avata shampanjapullo, projekti on valmis! Vai onko?

Vaihe 6: Ylläpito ja sisällöntuotanto

Vaikka verkkosivusi on nyt netissä, monesti työ on vasta alussa. Usein sivusto toimii parhaiten silloin, kun sinne julkaistaan silloin tällöin uutta sisältöä esimerkiksi blogikirjoitusten, vinkkien, asiakastarinoiden, tms. asioiden muodossa.

Myös sivuston WordPress-päivitykset tulisi hoitaa tasaisin väliajoin, jotta ilkeät hakkerit eivät pääse yllättämään.

Olemme tukenasi ja turvanasi niin paljon tai vähän kuin tarvitset. Käyttöohjeiden lisäksi ohjeistamme tarvittaessa kädestä pitäen. Halutessasi voit pyytää meitä tekemään päivitykset ja mahdolliset muutostyöt puolestasi.

 

Kuten saatoit laittaa merkille, niin yrityksen verkkosivujen tekeminen ei ole ihan simppeli savotta. Ainakaan silloin, kun halutaan tehdä priimaa ja ajatuksella mietittyä jälkeä.

Jos haluat perussivustoa parempia tuloksia ja nettinäkyvyyttä, niin ota ihmeessä yhteyttä ja pyydä tarjous.

Kommentoi kirjoitusta

Sähköpostiosoitettasi ei julkaista. Pakolliset kentät on merkitty *

Ilmaiset vinkit sähköpostiin

Tilaa maksuton uutiskirje, niin saat vinkit suoraan sähköpostiisi kerran kuussa!

Uutiskirjeen tilaaminen ei sido sinua mihinkään ja voit peruuttaa tilauksen milloin vain. Uutiskirjeen tilaamalla hyväksyt tietosuojaselosteemme.