Tyypillinen nettisivuprojekti

Kuvituskuva jossa nosturi ja nettisivut
30elo, 2017

Tässä artikkelissa on kerrottu miten nettisivuprojektit yleensä sujuvat miten sivut rakentuvat ja minkälaisia vaiheita projektiin yleensä kuuluu.

1. Palaverointi ja suunnitelman teko

Hyvin suunniteltu on puoliksi tehty ja tämä pätee etenkin nettisivuihin. Projekti kannattaa käynnistää aina alkupalaverilla ja suunnitella asiat huolella. Alkupalaverissa kannattaa pyrkiä tekemään konkreettinen suunnitelma siitä miten edetään ja kirjoittaa mahdollisimman paljon huomioitavia asioita ylös.

Suunnitelmaan kannattaa kirjoittaa ylös mm. alustava sivurakenne, toteutettavat sivut sekä sivuilla tarvittavat ominaisuudet ja toiminnot. Suunnitelman tarkentaminen voi vaatia useita tapaamisia tai sähköpostien kirjoittelua.

Suunnitelman voidaan nähdä toimivan tässä vaiheessa myös sopimuksena puolin ja toisin mitä on luvattu tehdä ja mitä ei.

2. Graafinen ilme ja sivupohjan valinta

Kun tiedetään suurin piirtein minkälaiset sivut halutaan, voidaan lähteä miettimään sopivaa graafista ilmettä sivuille.

Graafisen ilmeen toteuttamiseen löytyy WordPressissä paljon valmiita sivupohjia, sekä ilmaisia (WordPress.org:sta) että maksullisia (Theme Forest). Kuhunkin valmispohjaan kuuluu tietty tyyli, joka koostuu tekstityyleistä, väreistä, kuvien tyyleistä (artikkelikuvien tyyli) ja navigointivalikkojen tyylistä. Maksullisiin sivupohjiin kuuluu monesti graafinen sivurakentaja (useimmiten Visual Composer tai Elementor), joilla voi rakentaa helpommin näyttäviä sivuja. Edistyneet sivupohjat tuovat monesti myös paljon uusia säätömahdollisuuksia WordPressiin, joiden avulla sivujen ulkoasua voidaan säätää tarkasti halutunlaiseksi ilman, että tarvitsee lainkaan koskea koodeihin.

Vaikka maksulliset pohjat tarjoavat yleensä paljon enemmän, me itse asiassa suosimme yleensä ilmaisia sivupohjia (WordPress.org:sta). Tiedämme muutamia erittäin hyviä ja monipuolisia ilmaisia sivupohjia, joista on muodostunut suosikkejamme ja joita on helppoa käyttää uusiin projekteihin. Vaikka ilmaisiin sivupohjiin ei normaalisti kuulu sivurakentajaa, sen voi ostaa helposti erikseen. Suosimme yleensä Beaver-sivurakentajaa, joka on mielestämme selvästi paras ja jota yleensä ole edes saatavilla maksullisten sivupohjien mukana.

Yleisesti ottaen meillä on pitkä kokemus erilaisista sivupohjista (myös maksullisista) ja tiedämme mitkä niistä on hyviä ja mitkä huonoja ja miten kustomoida niitä omanlaisiksi.

Jos sivuista halutaan tarkasti tietynlaiset ja omannäköiset, niin tällöin voi tulla kyseeseen myös kokonaan oman sivupohjan tekeminen (koodaamalla itse).

3. WordPressin asentaminen palvelimelle ja sivupohjan lisääminen

Kun sivupohja on valittu, voidaan aloittaa itse toteutus ja asentaa WordPress testipalvelimellemme. Sivuja varten palvelimella pitää luoda sivuja varten oma tietokantansa sekä säätää jonkin verran asetuksia. Kun WordPress on saatu asennettua palvelimelle, tähän pääsee käsiksi tämän jälkeen testipalvelimen url-tai ip-osoiteessa (esim. http://11.22.33.44/testisivusto).

Asennettuja sivuja voi tämän jälkeen aloittaa kustomoimaan WordPressin hallintapaneelissa. Täällä sivuja varten pitää syöttää perustiedot (sivuston nimi, pääkäyttäjä, aikavyöhyke ym), luoda tyhjät sivut, tehdä navigointivalikko ja säätää url-rakenne kuntoon.

Sivupohjan asentaminen käy myös hallintapaneelin kautta ja se käy yleensä varsin helposti. Kun sivupohja on asennettu sitten alkaakin varsinainen työ, sillä sivupohjat ovat monesti todella monimutkaisia ja ne pitää todella paljon asetuksia ja vipuja. Jos käytetään uutta sivupohjaa, opetteluun menee yleensä melko paljon aikaa, sillä eri sivupohjat toimii yleensä kovin eri tavalla.

4. Sisällön ja kuvien tuottaminen sivuille

Sisällöntuotanto ja kuvien kanssa säätäminen on yleensä projektin selvästi työläin vaihe. Hyvän tekstin ja kuvien hankkiminen (tai ottaminen) vie useimmiten paljon aikaa. Projektin hinnan muodostumisessa tämä kohta näytteleekin varsin isoa roolia. Mikäli pystyt tuottamaan sivuille kaikki tekstit ja kuvat itse sekä kertomaan miten haluat kuvia käytettävän, tarkoittaa tämä useimmiten selvästi pienempää työmäärää meille.

Suosittelemme yleensä että asiakas kirjoittaa sivujen/artikkeleiden tekstit ainakin asiasisällön puolesta kuntoon. Tämän jälkeen voimme tarvittaessa oikolukea ja hioa tekstit lopulliseen kuntoon. Kuvien kanssa ei välttämättä kannata myöskään hirveästi käyttää aikaa itse, vaan antaa ne suosiolla meille käsiteltäväksi, koska se on todennäköisesti tutumpaa puuhaa meille.

5. Toimintojen kehittäminen sivuille lisäosien avulla (tai koodaamalla itse)

Kun sivujen perusrunko on suurin piirtein kasassa, voidaan seuraavaksi lisätä sivuille hyödyllisiä ja/tai tarvittavia toimintoja WordPressin lisäosien avulla. WordPressin laajennushakemistosta on mahdollista löytää laajennuksia valtava määrä ja hyvin erilaisiin käyttötarkoituksiin. Kuten sivupohjiakin, myös lisäosia on saatavilla niin ilmaisia (WordPress.org) kuin maksullisiakin (Envato Market).

Ehkä yleisimmät tarvittavat laajennukset kaikilla sivuilla on SEO-, somejakonapit-, palautelomake- ja sivuanalytiikka-laajennukset. Nämä ovat hyödyllisiä Monet parhaista laajennuksista on maksullisia ja joistain pitää maksaa myös vuosimaksua. lisäosia oikeastaan kaikilla sivuilla.

Seuraavassa on listattu joitain muita yleisimpiä lisätoimintoja, joita on mahdollista lisätä sivuille WordPressin laajennusten avulla. On huomioitavaa, että joidenkin monimutkaisten toimintojen käyttöönotto, kuten vaikka verkkokaupan, voi viedä paljon aikaa ja siten moninkertaistaa koko projektin hinnan.

  • Verkkokauppa
  • Palaute-, tilaus- ja muut lomakkeet
  • Uutiskirjeet
  • Tuoteportfoliot ja referenssisivut
  • Varausjärjestelmä
  • Tapahtumakalenteri
  • Edistynyt hakutoiminto
  • Monitasoiset valikot
  • Keskustelupalsta
  • Kilpailut ja kyselyt
  • Kuvagalleria
  • Integroinnit muihin järjestelmiin/palveluihin
  • Käyttäjäportaalit
  • Facebook -kommentointi

Uusia toimintoja omille sivuille voi kehittää tietysti myös koodaamalla itse (tai omilla lisäosilla), mikä on helppoa sillä WordPress on avointa lähdekoodia, hyvin dokumentoitu ja tarkoitettu helposti laajennettavaksi.

6. Viimeistely ja testaus

Kun sisällöt ja toiminnot ovat valmiina, voidaan sivut viimeistellä. Viimeistelyvaiheessa testataan sivun toiminnot, säädetään lopulliset asetukset, tehdään hakukoneoptimoinnit ja viilataan ulkoasua niin, että kaikki pikselit ovat varmasti paikoillaan.

Viimeistelyssä yksi tärkeimmistä osa-alueista on responsiivisuuden testaus ja säätäminen, jolla varmistetaan että sivuja on sujuvaa käyttää myös mobiililaitteilla.

Hakukoneoptimointiin kuuluu mm. SEO-laajennuksen asetusten säätäminen (esim. Yoast), meta-kuvausten (meta description) kirjoittaminen sivuille sekä käydään läpi yleinen SEO-tarkistuslista.

Tärkeä asia on myös varmistaa lopuksi sivujen nopeat latautumisajat. Sivujen latautumisaikoja voidaan yrittää parantaa optimoimalla kuvia, poistamalla turhia koodinpätkiä sekä ottamalla käyttöön cache-lisäosa (esim. Cache Enabler).

7. Verkkotunnuksen kytkeminen, SSL-sertifikaatin asennus ja sähköpostit

Kun uudet sivut ovat valmiit palvelimellamme (toistaiseksi ip-osoitteessa), voidaan sivut ottaa käyttöön kytkemällä verkkotunnus osoittamaan palvelimemme ip-osoitteeseen. Kytkeminen tapahtuu muuttamalla dns-tietueita domain-palveluntarjoajan hallintapaneelissa. Lisäksi meidän pitää tehdä joitain muutoksia omalla palvelimellamme.

Mikäli teillä ei vielä ole verkkotunnusta, voimme hankkia sellaisen puolestanne. Suosittelemme suomalaisille yrityksille aina fi-tunnusta, koska siihen luotetaan yleisesti ottaen eniten ja se on parempi myös hakukoneoptimoinnin kannalta.

Verkkotunnuksen kytkemisen yhteydessä kannattaa hankkia ja asentaa myös SSL-sertfikaatti, joka mahdollistaa suojatun yhteyden nettisivuille (https). Nykyään oikeastaan kaikki sivustot kannattaa tehdä https-sivustoiksi, koska tästä on hyötyä hakukoneoptimoinnissa (Google palkitsee hyvästä tietoturvasta).

Jos yrityksenne tarvitsee verkkotunnukseen liittyviä sähköpostilaatikoita esim. info@yritys.fi, tämä onnistuu myös helposti ja autamme tässä mielellämme.

8. Perehdytys

Kun sivut ovat valmiina, kannattaa useimmiten järjestää perehdytystilaisuus sivujen tuleville käyttäjille, jotta ihmiset osaavat lisätä jatkossa sisältöä helposti sivuille ja sivuista saadaan optimaalinen hyöty.

Perehdytyksessä käydään läpi WordPressin hallintapaneeli ja sen toiminnot kuten miten päivittää yksittäisiä sivuja ja lisätä artikkeleita blogiin. Lisäksi voidaan käydä läpi miten kirjoittaa hyviä artikkeleita Googlea varten (joilla saadaan lisää kävijöitä sivuille) ja miten voidaan tutkia kävijäanalytiikoita.

Perehdytys voidaan järjestää paikan päällä tai sitten etänä esim. Google Hangoutsissa. Perehdytyksiä voidaan järjestää niin monta kertaa kuin tarpeellista.

Tietoa kirjoittajasta
Terve, olen Tuomas eli Webguru ja kirjoitan tänne Aiheista, jotka liittyvät nettisivujen tekemiseen, web-ohjelmointiin, digimarkkinointiin tai hakukoneoptimointiin.