Verkkosivujen sisällöntuotanto – näin onnistut projektissa

Tästä aiheesta puhutaan Sinisen Härän toimistolla melkeinpä päivittäin – eikä suotta. Verkkosivujen sisällön avulla yritys kertoo potentiaaliselle asiakkaalleen, mitä palveluita tai tuotteita tarjoaa ja kenelle. Hyvin optimoidun sisällön avulla yrityksen verkkosivut myös löydetään Googlesta, eli tavoitetaan ne potentiaaliset asiakkaat. ”FUN FACT”: Kerrottakoon myös, että suurin osa viivästyneistä verkkosivuprojekteista johtuu juuri sisällöntuotannon ongelmista. Tässä blogitekstissä avaimet onnistumiseen verkkosivuprojektin tärkeimmässä osassa eli sisällöntuotannossa.

Aseta sisällölle selkeät tavoitteet

Verkkosivuprojektin alkuvaiheen tärkein asia on asettaa uudelle sivustolle selkeät tavoitteet. Halutaanko nostaa yrityksen näkyvyyttä? Halutaanko parantaa yrityksen visuaalista identiteettiä? Halutaanko saada lisää liidejä? Vai ehkä kaikkia edellä mainituista?

Selkeät tavoitteet helpottavat myös verkkosivujen sisällöntuotannon prosessia. Tavoitteet määrittävät, millaista tekstiä verkkosivuille tuotetaan ja miten kävijää ohjataan sivustolla.

Verkkosivujen sisällöntuotanto – Suunnittele rakenne huolella

Tavoitteiden asettamisen jälkeen ehdottomasti seuraava askel on verkkosivujen rakenteen suunnittelu, ja siihen kannattaa käyttää tarpeeksi aikaa. Vastaa esimerkiksi seuraaviin kysymyksiin: Mitä potentiaalinen asiakas yrityksen sivuilta hakee? Mitä hän haluaa löytää ensimmäisenä? Tai vaihtoehtoisesti mihin yritys haluaa asiakkaan ohjata?

Sinisen Härän kanssa verkkosivuprojektia tehdessäsi kustannuksiin sisältyy rakenteen suunnittelu. Tarjouksissa puhumme projektin vaiheesta termillä ”Sivuston käyttöliittymän suunnittelu ja toteutus”. Rakenteen suunnittelu aloitetaan projektin aloituspalaverissa pohtimalla asiakkaan kanssa yhdessä edellä mainittuja kysymyksiä. Lopputuotteena asiakkaalle esitellään verkkosivujen wireframing-malit, eli ns. sivuston rautalankamalli, jossa keskitytään loppuasiakkaan ostoprosessiin.

Aikatauluta ja jaa vastuuta

Seuraavaksi tee selkeä (ja realistinen!) aikataulu sisällön eri vaiheista ja jaa vastuu sisällöistä eri alueiden asiantuntijoille. Suosittelen, että sisällöntuotantoon varataan aikaa reilusti. Ja rehellisesti sanottuna, lisää tähän aikatauluun vielä vähän löysää. Sisällöntuotanto on verkkosivuprojektin tärkein vaihe, eikä sitä tule tehdä kiireessä. Aika usein kuvitellaan, että ”kyllähän ne tekstit nopeasti saadaan tehtyä”, mutta todellisuus onkin toinen. Usein kuulemme asiakkailta myös kommentteja siitä, kuinka vaikeaa omasta tuotteesta tai palvelusta olikaan kirjoittaa – ymmärrettävästi, koska työskentelemme joka päivä niiden asioiden äärellä ja oman yrityksen tuottama arvo saattaakin muodostua jopa itsestäänselvyydeksi.

Mikäli sisällöntuotanto tuntuu edelleen haastavalta, voit kääntyä myös asiantuntijan puoleen. Me Sinisellä Härällä teemme verkkosivujen sisällöntuotantoa päivittäin, ja autamme mielellämme myös tässä projektin osassa.

Verkkosivujen sisällöntuotanto – Optimoi asiakkaille, älä hakukoneille

Särähtääkö otsikko korvaan? Eikö nimenomaan hakukoneoptimointi ja yrityksen näkyvyyden maksimointi ole syy verkkosivu-uudistukseen? Nimenomaan, näinhän se menee. Haluamme silti painottaa, että verkkosivujen sisällön laadun määrittää aina lopulta asiakas, ja asiakkaan toimet sivustolla.

Mitä haluamme sanoa on, että verkkosivujen sisältö ei saa olla pelkkää avainsanojen viljelemistä oikealla tavalla, vaan sisällön tulee oikeasti kiinnostaa asiakasta ja ohjata asiakasta eteenpäin sivustolla. Verkkosivujen sisällön tärkein tehtävähän on kuitenkin tuottaa yhteydenottoja, tilauksia verkkokaupassa tai hankkia laadukkaita liidejä yritykselle.

Syötä sisältö sivustolle siten, että se löydetään

Rakenne suunniteltu – check! Tekstisisältö valmiina – check! Ja ollaan (toivottavasti) vielä aikataulussakin. Enää pitää syöttää sisältö verkkosivuille. Sisällön syötössä tärkeää on esimerkiksi otsikoiden oikeaoppinen merkitseminen, linkkien lisääminen tekstiin sekä asiakkaan ohjaaminen eteenpäin call-to-action -tekstien avulla. Kun sisältö syötetään oikein sivustolle, saadaan hyvin tehdyn sisällön hyöty maksimoitua parantuneen hakukonenäkyvyyden ja entistä selkeämmän sivuston myötä.

Jos teet verkkosivuprojektia yhteistyössä Sinisen Härän kanssa, niin lähtökohtaisesti lisäämme sisällöt rakennusvaiheessa sivustolle asiakkaan puolesta. Näin pystymme takaamaan sen, että myös sisällön syöttö on tehty oikeaoppisesti. Projektin loppuvaiheessa tai sovitusti järjestämme asiakkaalle käyttökoulutuksia sivuston hallintaan ja sisällön syöttöön liittyen. Tämän lisäksi meiltä löytyy myös oma WordPress-ohjeistus, ja laajasti kustomoiduissa verkkosivuprojekteissa suosittelemme lisäksi asiakkaalle kustomoitua käyttöopasta verkkosivujen hallintaan.

Yhteenveto

Kuten kirjoituksessa monta kertaa mainitsinkin, on sisällöntuotanto verkkosivuprojektin tärkein vaihe. Kertaus on opintojen äiti, joten tässä vielä listauksena tärkeimmät opit onnistumiseen:

    • Aseta verkkosivu-uudistukselle selkeät tavoitteet
    • Suunnittele sivuston rakenne ajan kanssa – kysy tarvittaessa apua asiantuntijalta
    • Aseta sisällöntuotannolle realistinen aikataulu
    • Tuota sellaista sisältöä, joka saa asiakkaan kiinnostumaan tarjoamastasi tuotteesta tai palvelusta
    • Kiinnitä huomiota myös sisällön syöttöön

Lataa ilmainen verkkosivujen ostajan opas




Onko teidän yrityksessänne verkkosivu-uudistus käsillä? Siinä tapauksessa, lataa ihmeessä ilmainen oppaamme. Opas on tehty auttamaan yrityksiä verkkosivujen ostamisessa, ja siinä käydään läpi kilpailutuksessa huomioon otettavia asioita aina tarjouspyynnön laatimisesta toteuttajien vertailuun.

Lataa ilmainen opas!

Hakukone­optimointi osana verkkosivusto­projektia

Hakukoneoptimointi on kokonaisvaltaista markkinointia ja siihen liittyy paljon eri osa-alueita. Meillä Sinisellä Härällä näistä moni otetaan huomioon jo sivuston rakennusvaiheessa, mutta hakukoneoptimointia kannattaa tehdä myös kuukausittain parempien tulosten saavuttamiseksi. Vaikka hakukoneoptimointi saattaa kuulostaa tekniseltä ja haastavalta, on moni tässäkin artikkelissa listatuista asioista lopulta niin sanotusti ihan perusjuttuja.  

Voit lukea netistä hakukoneoptimointiin liittyvistä uusista kikoista tai Googlen algoritmimuutoksista, mutta anna kun kerron sinulle salaisuuden: parhaaseen lopputulokseen pääset tekemällä perusasiat oikein, perusteellisesti ja järjestelmällisesti!

1.   Sisällöntuotanto

Sisällöntuotanto on erittäin suuressa roolissa hakukoneoptimointia ja tämä pitää muistaa jokaista verkkosivustoprojektia toteuttaessa. Meillä Sinisellä Härällä lähtökohta on se, että asiakas toimittaa sivuston sisällön – muodossa tai toisessa. Asiakas on kuitenkin se, jolla on eniten tietämystä ja ammattitaitoa omista palveluistaan. Sisältö voidaan toimittaa esimerkiksi haastattelun kautta, jolloin asiakkaan ei tarvitse itse kirjoittaa sisältöä.

Meidän roolimme sisällöntuotannossa sivustouudistuksen yhteydessä on ohjeistaa asiakasta oikeaan suuntaan. Tätä varten olemme kehittäneet omia prosessejamme, jotta saamme asiakkailta mahdollisimman hyvää sisältöä, jota tarvitsee editoida tai optimoida mahdollisimman vähän.

Käytännössä siis käsittelemme ja optimoimme asiakkaan sisältöjä sopimuksen mukaisesti. Joissain tapauksissa sisällöt voidaan lisätä lähes sellaisenaan ja joissain projekteissa lähdetään liikkeelle kevyellä oikoluvulla.

Jos asiakkaan budjetti antaa periksi, sisällöt optimoidaan jo sivuston toteutusvaiheessa, jotta hakukonenäkyvyys maksimoidaan heti sivuston avauksesta lähtien. Tätä edeltävät tietysti avainsanatutkimus ja kilpailija-analyysi, joista saadaan erittäin tärkeää tietoa siitä, mitä avainsanoja sisällössä kannattaa käyttää.

2.  Sivuston nopeus

Vuosien saatossa sivuston nopeus on nostanut rooliaan myös hakukoneoptimoinnissa. Tähän on johtanut se, että netin käyttäjät odottavat sivustoilta parasta mahdollista suorituskykyä ja latausnopeuksia. Jos jokin ei toimi toivotusti, he äänestävät jaloillaan. Jos sivusto latautuu yli kolme sekuntia, jopa 53 % sivuston vierailuista jää kesken.

Käytännössä siis nopeammat sivustot saavat parempia sijoituksia hakukoneissa. Tämä on tietysti karkea yleistys ja on hyvä muistaa, että mikään yksittäinen asia, kuten nopeus, ei nosta tärkeimpiä sivujasi hakutulosten kärkeen. Sivuston nopeus ja sen optimointi on kuitenkin tärkeää, ja siksi pyrimme aina mahdollisimman nopeisiin sivustoihin niitä suunnitellessamme.

Käytännössä otamme huomioon sivuston nopeuden jo hosting-tasolla, kuten aiemmin kirjoitin. Webhotellimme ovat WordPressille optimoituja ja ne ovat ns. LiteSpeed-palvelimia, mikä mahdollistaa teknisten nopeuteen vaikuttavien työkalujen käytön sivustolla.

Sivuston nopeuteen vaikuttavat myös kuvien optimointi, teeman keveys, optimoitu koodi ja esimerkiksi scriptien, kuten analytiikkatyökalujen yhdistäminen tai lataaminen Google Tag Managerin kautta. Tälläkin kertaa yksittäinen asia ei tuo parempia sijoituksia. Kyse on suuremmasta kokonaisuudesta, jossa pitää ottaa huomioon monia tekijöitä.

3.  Kuvien optimointi

Kuvien optimointi on monesti suurin tekijä, joka hidastaa verkkosivustoja. Käytännössä pahin tilanne on se, että kuvat lisätään WordPressiin suoraan sellaisenaan niitä mitenkään käsittelemättä tai nimeämättä.

Kuvien tiedostokoon optimointi vaikuttaa suoraan sivujen latausaikoihin ja sitä kautta hakukonesijoituksiin. Kuvia saa optimoitua pienissä määrin manuaalisesti esimerkiksi Photoshopilla tai muulla vastaavalla kuvanmuokkaustyökalulla, mutta suurien määrien käsittelyyn vaaditaan jo enemmän automaatiota. WordPressiltä löytyy paljon niin maksullisia kuin ilmaisia lisäosia, joilla saa automaattisesti optimoitua sivustolle ladattavia kuvia.

Me Sinisellä Härällä optimoimme kaikki kuvat vähintään tiedostokoon puolesta, kun lisäämme niitä sivustolle. Käytämme tähän erilaisia työkaluja, jotka olemme testanneet ja todenneet hyviksi. Esimerkiksi Imagify on yksi nimi, jonka tässä uskaltaa mainita. Käytämme myös palvelintasolla integroidun LiteSpeed Cache -lisäosan automaattista kuvien optimointia. Mainittakoon, että jälkimmäinen lisäosa vaatii yhteensopivan hosting-ympäristön.

Muista myös nimetä kuvat hakukoneoptimointia varten. Hakukoneet lukevat myös kuvien nimiä ja jos ne ovat muotoa IMG_07846, ei kuvien nimet ainakaan nosta hakukonenäkyvyyttä. Optimaalisesti nimetyt kuvat löytyvät paremmin hakukoneista ja auttavat keräämään lisää kuukausittaisia kävijöitä.

4.  Mobiilioptimointi

Vuonna 2020 kaikkien sivustojen pitäisi oletusarvoisesti olla mobiilioptimoituja. Puhutaan jopa mobile first -suunnittelusta, mikä tarkoittaa sitä, että sivustot suunnitellaan ensisijaisesti toimimaan mobiililaitteilla. Tähän on johtanut se, että mobiilikäyttäjien osuus on kasvanut yli perinteisten desktop-käyttäjien.

Mobiilioptimointi vaikuttaa myös suoraan hakukonesijoituksiin, sillä Google antaa parempia sijoituksia mobiilioptimoiduille tai niin sanotuille responsiivisille sivustoille. Responsiivinen sivusto tarkoittaa sitä, että sivusto on suunniteltu tunnistamaan käytettävän laitteen näytön koko ja skaalautumaan jokaiselle eri kokoiselle näytölle niin, että sivustoa on mahdollisimman helppo käyttää.  

5.  Otsikkomerkinnät

Oikeanlaisten otsikkomerkintöjen pitäisi olla tänä päivänä itsestäänselvyys, mutta edelleen näkyy sivustoja, joissa tätä tärkeää hakukoneoptimointiin vaikuttavaa toimenpidettä on laiminlyöty.

Käytännössä sivun taustarakenteessa olevat otsikkomerkinnät, esimerkiksi <h1> ja <h2>, kertovat hakukoneille, mitkä tekstikohdat ovat sivun otsikoita. Näin hakukoneet tunnistavat, mitä aiheita eri tekstiosiot käsittelevät, mikä taas liittyy suoraan hakukonenäkyvyyteen.

Hyvissä verkkosivuotsikoissa on otettu huomioon myös avainsanojen sisällyttäminen niihin sekä otsikoiden muotoilu. Otsikkomerkintöjä käytetään sivuston muotoilussa, jolloin otsikot näyttävät aina visuaalisesti samalla tavalla. Tämä helpottaa sivuston päivitettävyyttä.

6.  URL-rakenne ja käyttöliittymä

URL-rakenne tarkoittaa sivujen osoiterakennetta. On tärkeää hakukoneiden sekä käyttäjien kannalta, että sivuston osoiterakenne on tehty ja suunniteltu järkevästi. Yksinkertaisimmillaan puhutaan siitä, onko sivu nimetty esimerkiksi /palvelu?id=29/ vai /palvelut/hakukoneoptimointi/. Mieti mitä rakenne ja sivujen osoitteet kertovat hakukoneille tai käyttäjälle?

Osoiterakenteen suunnittelun lisäksi verkkosivustoprojektiin kuuluu olennaisesti myös käyttöliittymän suunnittelu. Tällä tarkoitetaan sitä, että ratkaistaan, miten ja minne verkkosivukävijää ohjataan sivustolla. Periaatteessa käyttöliittymän suunnittelu on siis potentiaalisen asiakkaan ostoprosessin optimointia.

7.  Ristiin linkitys

Varmaan huomasitkin, että tämän artikkelin sisällössä on linkkejä muihin meidän kirjoittamiin artikkeleihin. Niiden tarkoitus on tarjota lukijalle lisää mielenkiintoista sisältöä tähän aiheeseen liittyen. On tutkittu, että mitä enemmän aikaa potentiaalinen asiakas viettää yrityksen sisällön kanssa, sen todennäköisemmin asiakas päätyy jossain vaiheessa ottamaan yhteyttä. 🙂

Ristiin linkitys on tärkeää hakukoneoptimoinnin näkökulmasta ja sillä kerrot hakukoneille oman sivustosi tärkeimmästä sisällöstä. Mitä enemmän sisäisiä linkkejä sivustollasi on yhdelle tietylle sivulle, sen tärkeämmässä roolissa se on hakukoneiden näkökulmasta. Esimerkiksi navigaatio löytyy jokaiselta sivustosi sivulta, eli linkität navigaatiossa mainituille sivuille jokaiselta sivustosi sivulta.

8.  Sivustokartta ja Search Console

Yleensä uudet sivut halutaan näkyville mahdollisimman nopeasti. Sivustokartta auttaa tässä. Se on käytännössä hakukoneita varten tehty tiedosto, jonka tehtävä on listata kaikki sivuston indeksoitavaksi haluttavat sivut yhteen listaan, jota hakukoneiden on helppo tulkita.

Sivustokartta kannattaa ladata esimerkiksi Googlen Search Consoleen (entinen verkkovastaavan työkalut). Search Consolessa on myös monia muita hyviä ominaisuuksia, joihin kannattaa tutustua. Mainittakoon, että sivustokartankaan lisäys ei aina välttämättä takaa sitä, että kaikki sivut indeksoidaan, mutta ainakin se auttaa ja nopeuttaa prosessia useimpien sivujen kohdalla. Voit myös pyytää hakukoneita indeksoimaan sivusi Search Consolen kautta.

9.  Teema, vähän lisäosia, koodin siisteys ja SSL

Hakukoneoptimointiin vaikuttaa myös moni muu tekijä. Google on ilmoittanut, että heidän hakutulossijoituksia määrittelevään algoritmiin vaikuttaa yli 200 yksittäistä tekijää. Tässäkin kohtaa, kun perusasiat on tehty hyvin, päästään jo pitkälle.

Me Sinisellä Härällä halutaan, että kaikki meidän tekemät sivustot näkyvät hakukoneissa mahdollisimman hyvin. Siksi myös nämä oletusarvoiset asiat, kuten kevyt ja hakukoneoptimoitu Sinisen Härän oma teema, pieni määrä lisäosia, sivuston koodin siisteys ja tiivistys sekä SSL-sertifikaatti, ovat osa jokaista sivustoprojektia.

Yhteenveto

Tämän blogin alussa se tiivistys jo tuli:

Voit lukea netistä hakukoneoptimointiin liittyvistä uusista kikoista tai Googlen algoritmimuutoksista, mutta anna kun kerron sinulle salaisuuden: parhaaseen lopputulokseen pääset tekemällä perusasiat oikein, perusteellisesti ja järjestelmällisesti!

Tietysti myös hyvä kumppani, joka ottaa sivustouudistuksessa myös hakukoneoptimoinnin huomioon, on avainasemassa menestyksekkäässä projektissa.

Ps. Joku SEO-konsultti tai asiasta enemmän tietävä ajattelee nyt, että ”aijai identtistä sisältöä”. Jos luit tänne asti, klikkasit yhtäkään linkkiä tai opit tästä jotain uutta, on tuplasisältö noihin verrattuna taas pieni yksityiskohta, jonka merkitys on tässä yhteydessä lähes merkityksetön. Lue uudestaan edellinen lause ja olet oikealla radalla. 🙂

Jos kiinnostuit omien sivujesi SEO-tilanteesta, tilaa ilmainen arvio sivustosi hakukoneoptimoinnista

Burgerjoint.fi-sivustolle pronssia Finnish Web Awardsissa

Pronssi on voitettu, hopee hävitty 🥉

… tai näin ainakin sanottiin aina, kun junnuvuosina jääkiekkoturnaus päättyi pettymykseen pronssimitalit kaulassa. Huolimatta junnuvuosien voiton mentaliteetista, tästä pronssimitalista ollaan koko Sinisen Härän tiimin enemmän kuin ylpeitä!

Kuten täällä blogissakin tuossa kesän korvilla huudeltiin, niin osallistuimme toistamiseen Finnish Web Awardsiin (neitsytvuonna pokattiin Gold- ja Paras blogi -palkinnot Hatsolo.fi sivustolla). Tällä kertaa Euroopan parhaista burgereista palkitun Social Burgerjointin keväällä 2019 uusitulla sivustolla. Ja kuten otsikosta näkee, niin kovassa joukossa pronssimitalihan sieltä napsahti!

Sanotaanko näin, että ei hävitty huonoille. Kilpailun aatelia (eli Grand Prix -palkinnon voitti) edusti suorastaan dramaattinen ruokangas.com-sivusto. Seuraavan Gold-sijan jakoivat Kiss My Turku -sivusto ja Helsingin uuden kirjaston Oodin sivusto. Sinisen Härän suunnitteleman ja toteuttaman Burgerjoint.fi-sivuston kanssa jaetulla pronssipallilla seisoivat Contrast Digitalin suunnittelema makiaclothing.com sekä Gigantin itsensä kehittämä gigantti.fi.

Kilpailun edustajisto luonnehti finalisteja seuraavasti:

Kilpailun taso oli edelleen maamme kovinta ja oli ilo saada esitellä työnne. Palkinnot toimitetaan voittajille henkilökohtaisesti ja vuoden 2020 kilpailun suunnittelu on jo hyvässä vauhdissa. Jokainen osallistunut sivusto edusti erinomaista osaamista.

Lue halutessasi myös tarkempi kuvaus Social Burgerjointin verkkosivuprojektista referenssiartikkelin muodossa.

ISO KIITOS taas kaikille yleisöäänestyksessä äänestäneille, Social Burgerjointin jengille ja tietysti Finnish Web Awardsin järjestäjille!

Pitäiskö tehdä teillekin mitalin arvoiset verkkosivut?

Vallilassa Sinisen Härän toimistolla todistetusti valmistuu mitalin arvoisia verkkosivuja. Jos teillä on tarvetta uudistukselle, haluat saada varmistuksen nykyisen sivuston toimivuudesta tai muuten vaan morottaa, niin klikkaa itsesi ottamaan yhteyttä tai tilaa ilmainen arvio verkkosivuista alta. ⤵️

Tilaa ilmainen arvio

TOP 7 – Parhaat WordPress-lisäosat

Lisäosa, englanniksi plugin, devaajaksi plugari. WordPressin lisäosakirjastossa on tällä hetkellä ladattavissa 55 464 lisäosaa erilaisiin tarkoituksiin. Lisäosilla verkkosivustoon saadaan helposti käytännöllisiä lisätoiminnallisuuksia ja ominaisuuksia ilman riviäkään omaa koodia – näppärää! Tohdin väittää, että harvassa ovat ne WordPress-sivustot, joilla ei olisi ainuttakaan lisäosaa ladattuna. Tässä artikkelissa käyn nopeasti läpi, mitä on hyvä ottaa huomioon ennen WordPressin lisäosien lataamista ja vinkkaan Sinisen Härän työkalupakista 7 parasta lisäosaa.

Lisäosat, uhka vai mahdollisuus?

Vaikka omaa työtä helpottavien WordPress-lisäosien lataaminen sivustolle onkin parin klikkauksen päässä, kannattaa varoa, ettei talsi suoraan sudenkuoppaan. Kuten jo mainitsinkin, lisäosakirjastossa on aikamoinen kirjo erilaisia lisäosia, joista kaikki eivät ole todellakaan parhaan käytännön mukaisia. Vanhentuneet, sivuston teeman tai muiden lisäosien kanssa yhteensopimattomat lisäosat voivat heikentää tietoturvallisuutta tai kuormittaa sivuston latausnopeutta ja toimivuutta. Loppujen lopuksi riittää, että lataat sen yhden lisäosan, joka ei ole yhteensopiva jonkin toisen lisäosan kanssa, tai jossa jokin koodinpätkä ei ollutkaan ihan kohdillaan ja tyylikäs sivustosi muuntautuu järjettömän näköiseksi sotkuksi rikkoontuneilla toiminnoilla. Not fun.

Siispä mitä vähemmän lisäosia sivustolla on, sen parempi.  Kuitenkin huolella valitut lisäosat helpottavat verkkosivuston ylläpitämistä ja parantavat käyttökokemusta. Oma suositukseni onkin, että kun jonkin ominaisuuden saitille halajaa, kannattaa tehdä vähän taustatyötä lisäosan ajantasaisuudesta, käyttäjäarvioista, ominaisuuksista, tuesta sekä yhteensopivuudesta ennen Lataa-napin painamista.

Parhaat WordPress-lisäosat

Meillä on käytössämme oma kustomoitu WordPress-teema, jonka pohjalle rakennamme asiakkaillemme räätälöidyt verkkosivut ja -kaupat. Suuri osa saittien kustomoinnista pystytään hoitamaan koodilla, mutta täysin ilman lisäosia mekään emme kuitenkaan selviä. Niinpä seuravaksi tulee perusteluineen parhaat lisäosat, joita me käytetään sivustoprojekteissamme – olkaapa hyvät!

Advanced Custom Fields Pro eli lyhyemmin ACF

Advanced Custom Fields Pro on maksullinen lisäosa, joka nimensä mukaisesti mahdollistaa kustomoitujen lisäkenttien lisäämisen WordPressin editointinäkymään. Käytännössä WordPressin perusmuokkaimessa oletuksena olevien tekstieditorin, artikkelikuvan ja kategorioiden lisäksi näkymään saadaan joustavasti lisättyä lisää tekstikenttiä, kuvia, videoita… Aika lailla mitä vaan.

Me käytetään ACF:ää kaikissa sivustoprojekteissamme. Rakennamme sivustot dynaamisesti helpottaen siten sivuston sisältöjen päivitettävyyttä asiakkaiden kannalta. ACF antaakin reilusti mahdollisuuksia räätälöidä WordPressin perusmuokkainta halutulla tavalla.

CPT UI Custom Post Type

Custom Post Type eli CPT kuuluu ehdottomasti vakiovarusteisiin Sinisen Härän saittiprojekteissa. Sen syvemmälle WordPressin perusajatukseen menemättä, WP:n julkaisualustassa on kaksi tapaa lisätä sisältöä sivustolle: sivut ja artikkelit. CPT-lisäosan avulla sivustolle saadaan lisättyä kustomoituja artikkelityyppejä, kategorioita ja taksonomioita. Niin ja mikä parasta, tämä lisäosa toimii ACF-lisäosan kanssa saumattomasti yhteen!

Sivustoprojekteissamme CPT-lisäosan avulla tehdään omia kustomoituja artikkelityyppejä muun muassa erilaisille palveluille, tapahtumille tai vaikkapa ruokalistoille. CPT-osiot nousevat WordPressin ohjausnäkymään omana osionaan (aivan kuten artikkelit) ja niiden hallinnointi on siten tehty käyttäjälle helpoksi. Esimerkiksi, kun asiakas haluaa lisätä uuden palvelun sivustolleen, tämän ei tarvitse, kun täyttää (luonnollisesti ACF:llä kustomisti lisätyt) sisältökentät halutuilla sisällöillä ja valmista tuli. Palvelulistaus ja palvelun oma sivu haetaan dynaamisesti verkkosivustolle ennalta määriteltyjen ulkoasujen mukaisesti, joten mitään ulkoasuun liittyvää osaamista ei tarvita.

Yoast SEO / Rank Math

Verkkosivuston hakukoneoptimoinnista huolehtiminen on eittämättä melkoisen merkittävässä roolissa nykyaikana. Jos siis meinasit selvitä mahdollisimman pienellä määrällä lisäosia, niin hakukoneoptimoinnin lisäosaa ei kannata ensimmäisenä tipauttaa pois ladattavien lisäosien listalta. Meillä hyviksi todettuja SEO-lisäosia ovat Yoast SEO ja Rank Math. Molemmissa ehdoton etu on se, että yhdellä lisäosalla saat käyttöösi kokonaisen hakukoneoptimoinnin työkalupakin, joka sisältää käytännössä kaiken mm. avainsana-analyysistä, sivustokarttoihin, metatietojen muokkaamiseen sekä tekstisisällön optimointiin.

LiteSpeed Cache

Sivuston latausnopeus vaikuttaa paitsi sivuston käytettävyyteen, myös sen sijoittumiseen hakukoneiden hakutuloksissa. LiteSpeed Cache on ilmainen lisäosa verkkosivuston kokonaisvaltaiseen latausnopeuden optimointiin.  LiteSpeed -lisäosa tallentaa välimuistia koko sivustolta palvelintasoisesti, mikä parantaa sivuston latausnopeutta merkittävästi enemmän, kun vain pelkän sivuston välimuistia tallentavat lisäosat.  Lisäksi se sisältää kattavat työkalut sivuston nopeuden optimoimiseksi, minkä vuoksi se asennetaankin oletuksena meidän tekemille sivustoille sivuston latausnopeutta parantamaan.

WooCommerce

WooCommerce on ilmainen ja ylivoimaisesti suosituin verkkokauppalisäosa WordPressille. Se on kevyt ja avoimeen lähdekoodiin perustuva lisäosa, joka taipuu moneen käyttötarkoitukseen, oli kyseessä sitten iso tai pieni verkkokauppa. WooCommerce on helposti räätälöitävissä ja siihen on saatavilla erilaisia lisämoduuleja niin WooCommercen omasta lisäosatarjonnasta kuin muista WooCommercen kanssa yhteensopivista lisäosista. Sinisellä Härällä WooCommercea on käytetty niin suurten verkkokauppojen (Suomen Luonnonmaalit) rakentamiseen kuin katalogimallisten verkkosivustojen tekemiseen (Biozell).

Redirection

Uudelleenohjausten tavoitteena on huolehtia siitä, että käyttäjä ohjataan esimerkiksi Googlesta oikeaan osoitteeseen, vaikka sivuston osoite olisikin muuttunut. Näin säilytetään vanhalla sivulla saavutettu hakukonenäkyvyys ja estetään kävijän eksyminen 404-sivuille. Uudelleenohjaustyypeissä on eroja ja niillä on myös oma merkityksensä hakukonenäkyvyydessä. Siksi kannattaakin olla tarkkana, minkä uudelleenohjauksen valitsee. Käydäänpä nopeasti tähän väliin vielä uudelleenohjausten erittäin lyhyt oppimäärä:

  • 301-uudelleenohjaus > Pysyvä
  • 302-uudelleenohjaus > Väliaikainen
  • 303-uudelleenohjaus > Korvattu

Me huolehdimme Sinisellä Härällä sivuston uudelleenohjaukset Redirection-plugarilla, joka on ilmainen ja hyväksi todettu lisäosa sivuston uudelleenohjausten hallinnointiin. Redirectionilla pystytään toteuttamaan muun muassa ehdollisia uudelleenohjauksia ja saamaan logeja 404 erroreista sekä aktiivisista uudelleenohjauksista.

Polylang Pro

Kun sivustolle ei riitä yksikielinen toteutus, ovat käännöstyöhön tarkoitetut lisäosat, kuten Polylang korvaamaton apu. Polylang Pro-lisäosalla sivuston sisältöjen käännöstyöt onnistuvat  helposti ja käyttölogiikaltaan yksinkertaisesti. Sinisellä Härällä monikieliset sivustototeutukset hoidetaan Polylang Prolla sen tarjotessa kattavat integraatiot myös Custom Post Typejen sekä ACF-kenttien käännöksiin.

Tilaa arvio verkkosivujesi nykytilasta

Hyvät verkkosivut tarkoittavat meille teknisesti ja visuaalisesti toimivia, mutta ennen kaikkea myyntiä tukevia kokonaisuuksia. Verkkosivut ovat monesti asiakkaan ja yrityksen ensimmäinen myyntikohtaaminen, eikä markkinoinnista saada kaikkea irti, mikäli sivusto ei tue mainonnan tavoitteita.

Tilaa ilmainen arvio

UX- ja UI-design – mitä sinunkin tulisi tietää web design -jargonista

Työskentely nopeasti kehittyvällä alalla takaa sen, että työ saa jatkuvasti uusia ulottuvuuksia ja trendejä. Myös termistö kehittyy, ja koska trendit lähtevät monesti liikkeelle englantia puhuvan väestön keskuudesta, ovat termit luonnollisesti ensin englanniksi. Ammattislangin ja -termistön kehittyessä hurjaa vauhtia, käännöksiä ei usein tehdä ja termit vakiintuvat suomalaiseenkin suuhun englanninkielisinä. Kaksi tällaista ratkaisevaa työmme uutta ulottuvuutta ja termiä ovat UX- ja UI-design. Tässä blogiartikkelissa avaan perustasolla mitä nämä käsitteet tarkoittavat, ja miten ne liittyvät ratkaisevasti Sinisen Härän verkkosivustoprojekteihin.

UX-design eli User Experience Design

Voidaan vapaasti suomentaa esimerkiksi käyttöliittymän suunnitteluksi, käyttäjäkokemuksen muotoiluksi tai palvelun muotoiluksi. Käyttäjäkeskeinen UX-design kattaa sateenvarjon lailla alleen monia erilaisia alueita, joiden avulla pyritään parempaan käyttäjäkokemukseen. Muutamia mainitakseni:

– Käyttäjätutkimus ja palvelun testaaminen käyttäjillä. Palvelua kehitetään käyttäjille sopivaksi keräämällä dataa käyttäjistä ja heidän preferensseistään, joiden perusteella pystytään tekemään oletuksia ja käyttäytymismalleja kehityksen pohjalle. Datan perusteella voidaan ratkoa niitä ongelmia, mitä käyttäjät kohtaavat. Palvelun testaamisen järjestäminen oikeilla käyttäjillä esimerkiksi prototyyppivaiheessa on myös UX-designia, toimiiko datan perusteella tehdyt hypoteesit oikeasti ja miten käyttäjä kulkee suunniteltuja polkuja.

Informaatioarkkitehtuuri, eli verkkopalvelun hierarkia, vielä käytännöllisemmin valikkorakenteen suunnittelu. Eli miten asiat ja informaatio jäsennellään ja rakennetaan ymmärrettävään muotoon.

Wireframing, eli rautalankamalli on yksi vaihe suunnittelussa. Tässä vaiheessa keskitytään nimenomaan verkkosivuston tai -palvelun toimivuuteen, käyttäjän polkuihin saavuttaa tavoite ja niin edelleen. Rautalankamalli on ikään kuin luuranko, ja visuaalinen UI-puoli on vaatetus.

Analytiikka ja mittarit ovat oma taiteenlajinsa, mutta liittyvät vahvasti käyttäjätutkimukseen. Erilaiset työkalut, kuten lämpökartat, antavat arvokasta dataa käyttäjistä, mikäli sitä osaa tulkita ja hyödyntää palvelun kehityksessä.

Copywriting, eli tekstin tuotto. Tekstisisältö ohjailee ja helpottaa käyttäjää verkkopalveluissa ratkaisevasti, joten myös tekstin suunnittelu on osa UX-designia.

UI-design eli User Interface Design

Vapaasti suomennettuna ulkoasun suunnittelu, eli visuaalinen puoli suunnittelusta. Ulkoasun suunnittelu on myös osa käyttäjäkokemusta ja käyttöliittymän suunnittelua, joten kahtiajako UX:n ja UI:n välillä ei ole tasapuolinen. Maalaisjärjelläkin ajateltuna visuaalinen puoli vaikuttaa ratkaisevasti käyttäjän kokemukseen. Ulkoasun suunnittelu on eriytetty kuitenkin omaksi palveluksi sen takia, että myös tämä suunnitteluprosessi on täynnä omia sääntöjään, lainalaisuuksiaan ja kommervenkkejään, joihin visuaalinen suunnittelija/UI designer/graafikko/tmv. on erikoistunut. Muutamia näistä mainitakseni:

Värien käyttö sivustolla niin, että se on yrityksen graafisen ohjeiston mukaista, mutta myös käyttäjäystävällistä. Esimerkkinä tilauksen lähetys verkkokaupassa: ”Lähetä”-napin ei tulisi koskaan olla punainen, koska miellämme punaisen napin tarkoittavan asioita, kuten keskeytä tai tyhjennä valinnat.

Fonttien käyttö sivustolla jälleen niin, että mukaillaan yleistä ilmettä, mutta ei tuhota käytettävyyttä hankalasti luettavilla fonteilla.

Kuvien käyttö mukaillen tavoiteltavia tunnetiloja ja toimintoja.

– Ulkoasun suunnittelun on tarkoitus toki myös luoda palvelulle arvoisensa ilme, ja olla näin osaltaan tukemassa tavoitteita.

Miten termit liittyvät Sinisen Härän verkkosivustoprojekteihin?

Kuten yllä on avattu, niin UX- ja UI-design eivät ole verkkosivustoprojekteista eroteltavia palveluita, vaan kriittisiä osia verkkopalveluiden suunnittelussa. Kun Sinisellä Härällä asiantuntijuus on kasvanut, on myös UX- ja UI-designin menetelmiä ja toimintatapoja integroitu osaksi prosessejamme. Nykyinen käytäntömme viedä projektit läpi sisältääkin paljon aiempaa enemmän erilaisia ja aiempaa parempia suunnittelun menetelmiä liittyen esimerkiksi wireframingiin, mittareihin sekä hierarkiaan. Näin voimme paremmin taata verkkopalveluiden toimivuuden ja tavoitteisiin pääsemisen. Meille verkkosivut eivät ole vain käyntikortti, vaan tärkeä, joskus ratkaisevakin pala yrityksen markkinointia.

TLDR: et voi rakentaa verkkosivustoja tekemättä UX- ja UI-designia. Se, miten paljon näihin panostetaan vaikuttaa ratkaisevasti lopputuloksen laatuun.

 

Lataa ilmainen verkkosivujen ostajan opas




Onko teidän yrityksessänne verkkosivu-uudistus käsillä? Siinä tapauksessa, lataa ihmeessä ilmainen oppaamme. Opas on tehty auttamaan yrityksiä verkkosivujen ostamisessa, ja siinä käydään läpi kilpailutuksessa huomioon otettavia asioita aina tarjouspyynnön laatimisesta toteuttajien vertailuun.

Lataa ilmainen opas!

Sivuston nopeuden optimointi

Nopeus on tämän päivän ehdoton edellytys toimivalle sivustolle – varsinkin jos odottaa hyviä tuloksia. Käyttäjät ovat verkossa entistä malttamattomampia ja poistuvat hitaalta sivustolta yllättävänkin nopeasti. Ihmiset haluavat kaiken ja heti, ja tätä todistaakin se, että jos sivustosi latautuu yli kolme sekuntia, jopa 53% sivustosi vierailuista jää kesken. Samasta tutkimuksesta käy ilmi myös, että joka toinen sivustojen käyttäjistä odottaa sivuston latautuvan alle kahdessa sekunnissa. Artikkelin lopusta löytyy linkki, josta pääset testaamaan oman sivustosi nopeutta, mutta käydään läpi ensin nopeuteen vaikuttavia tekijöitä.

Sivuston nopeuteen vaikuttavat tekijät

Google ja muut hakukoneet arvostavat nopeita sivustoja entistä enemmän, mikä taas tarkoittaa sitä, että nopeat sivustot saavat lähtökohtaisesti parempia sijoituksia myös hakutuloksissa. Sivuston nopeuteen vaikuttaa kokonaisuudessaan todella moni tekijä ja netistä löytyykin monia artikkeleita aiheesta. Ei käydä niitä kaikkia tässä artikkelissa läpi, koska aihe on sen verran laaja. Yksi maininnan arvoinen artikkeli, joka käsittelee aihetta tarkemmin on kuitenkin esimerkiksi Elementorin kirjoittama How to Speed Up Your WordPress Website.

Sininen Härkä ottaa sivustojen nopeuden tosissaan ja rakennammekin kaikki verkkosivustot yleisiä parhaita käytäntöjä käyttäen.

  1. Suosittelemme, että kaikki sivustot hostataan WordPress-optimoiduilla webhotelleilla
  2. Käytämme omaa kustomoitua, optimoitua ja kevyttä teemaa
  3. Pidämme huolen siitä, että kaikki* sivustolle ladattavat kuvat optimoidaan
  4. Pyrimme välttämään ylimääräisiä lisäosia ja minimoimaan niiden määrän
  5. Käytämme palvelintason välimuistityökaluja latausaikojen minimoimiseksi
  6. Tarvittaessa käyttöön otetaan myös CDN (Content Delivery Network)
  7. GZIP kompressointi käytössä jokaisella sivustolla

*Emme voi taata kaikkien kuvien manuaalista optimointia, jos sitä ei ole erikseen budjettiin laskettu, mutta asia käydään läpi jokaisen asiakkaan kanssa parhaan käytännön löytämiseksi.

Tavoitteenamme on nopein mahdollinen alusta WordPress-sivustoille. Litespeed-palvelin ja LiteSpeed Cache -välimuisti sekä taustalla toimiva SSD-levyjärjestelmä ja skaalautuva pilvialusta tekevät sivuistasi salamannopeat. Nämä kaikki nopeuttavat sivuston toimintaa jo itsessään, mutta sivuston nopeutta voidaan viedä vielä uudelle tasolle sivustokohtaisten asetusten avulla.

Sivuston nopeusoptimointityökalut

Tarjoamme seuraavia sivuston nopeuteen positiivisesti vaikuttavia työkaluja sivustoprojektien yhteydessä, mutta myös jälkeenpäin käyttöönotettuna. Jokainen tekniikka testataan ja otetaan käyttöön asiakaskohtaisesti. Esimerkiksi sininenharka.fi-sivuston latausnopeus putosi paketin avulla keskimäärin n. 4,9 sekunnista alle sekuntiin, mikä on sanomattakin valtava muutos.

Kuvien optimointi

Liian suuret kuvatiedostot on varmastikin tämän päivän yleisin ja suurin ongelma, joka hidastaa sivustoja. Kuvat kannattaa optimoida kuvakoon ja SEO:n puolesta jo ennen sivustolle lataamista, mutta automaattinen koneellinen kuvien optimointi pakkaa ja pienentää kuvien kokoa entisestään latausaikojen minimoimiseksi.

Lazy Load -kuvien lataus

Lazy Load lataa yksittäisillä sivuilla olevat kuvat ja iframet vasta sitten, kun niitä tarvitaan eli juuri ennen kuin käyttäjä selaa niiden kohdalle. Asynkronisesti kuvia lataamalla selain säästää aikaa, koska se lataa vain sen median, joka tarvitaan nykyisen näkymän täyttämiseen.

CSS/Javascript -tiedostojen yhdistäminen

Kaikessa yksinkertaisuudessaan nerokas tekniikka yhdistää useita JavaScript- tai CSS-tiedostoja yhteen. Tiedostojen yhdistäminen vähentää selaimen tekemien pyyntöjen määrää ja poistaa mahdollisesti kaksoiskoodin, mitkä näkyvät nopeuden parantumisena.

CSS/Javascript/HTML -tiedostojen minimointi

Tiedostojen minimointi poistaa CSS-, JavaScript- ja HTML-tiedostoista kaiken ylimääräisen, kuten turhat rivivälit, ylimääräiset merkit ja kommentit. Minimoimalla lähdekoodin, minimointi mahdollistaa sen nopeamman käsittelyn ja esittämisen verkossa.

Palvelintason kokosivun välimuisti

Kommunikoi suoraan LiteSpeed Web Serverin kanssa dynaamisesti luotujen web-sivujen staattisten kopioiden tallentamiseksi. Palvelintason välimuisti toimii huomattavasti nopeammin kuin vain sivuston puolella käytössä oleva välimuistityökalu.

Yksityinen välimuisti

Kykenee tallentamaan sivun henkilökohtaisia kopioita tilanteissa, joissa sisältö on tarkoituksenmukainen vain sen pyytävän käyttäjän kannalta.

Tietokannan optimointi

Pitää WordPress-tietokannan ohuena, karsittuna ja mahdollisimman tehokkaana. Työkalu nopeuttaa tietokantakyselyjä poistamalla ajan mittaan kertyvää sotkua, kuten vanhojen sivujen ja postausten versioita.

Edge Side Includes (ESI) -tuki

ESI mahdollistaa sen, että koko yksittäisen sivun välimuistia ei tarvitse tyhjentää aina, kun joku sivun osio päivittyy, riittää, että vain osa sivusta päivitetään.

Sivuston nopeustesti

Nyt sitten se mitä osa lukijoista ei välttämättä malttanut odottaa, vaan selasi suoraan tänne. Oman sivuston latausnopeus – tietysti!

Voit testata sen esimerkiksi täältä:

https://tools.pingdom.com/

Valitse ”Test from” -kohtaan esim. UK tai Saksa, jos asiakkaasi tulevat pääsääntöisesti Suomesta. Jos asiakkaasi tulevat ympäri maailmaa, voit testata latausnopeuksia myös muista maista.

Mainittakoon kuitenkin sen verran, että vaikka Pingdomin ja muiden vastaavien työkalujen, kuten GT-Metrixin ja Google Page Speed Insightsin onkin tarkoitus antaa teknisiä vinkkejä nopeuden kehittämiseksi – sivuston latausnopeus on ennen kaikkea pisteitä tärkeämmässä roolissa. Monet sivustojen kehittäjät ovat jopa sitä mieltä, että pisteillä ei ole mitään väliä, kunhan sivusto toimii nopeasti.

Härkävinkki

Jos olet kiinnostunut oman sivuston nopeuden kehittämisestä tai konversio-optimoinnista, ole rohkeasti yhteydessä, niin katsotaan mitä voidaan asialle tehdä.

8 periaatetta verkkosivu­suunnitteluun

Verkkosivusuunnittelua tehdään aina tapauskohtaisesti kun suunnitellaan uniikkeja kokonaisuuksia, mutta tietyt periaatteet pätevät aina sivustosta riippumatta. Periaatteita voi jaotella visuaalisen suunnittelun tai käytettävyyden alle, mutta seuraavat kahdeksan periaatetta pätevät yleisesti projektista riippumatta.

Hierarkia on sivuston selkäranka

Sivuston hierarkia on yksi ensimmäisenä suunniteltavista asioista sivustolla. Hierarkia tarkoittaa sivustolla sisällön esittämisen järjestystä ja järjestämistä. Sisältöä järjestellään pääotsikoiden alle, mahdollisesti kahteen navigaatioon ja erilaisten määreiden alle. Hierarkia ja järjestely on välttämätöntä sivuston pohjalle ja loppukäyttäjälle, sillä se toimii sivuston selkärankana. Hierarkian perusteella pystytään tekemään myös päätöksiä teknisistä ratkaisuista ja toteutuksista loogisesti. Hierarkia voidaan määritellä joko tarpeen mukaan kevyin perustein tai siihen voidaan käyttää tarpeen vaatiessa runsaasti aikaa ja erilaisia työkaluja. Laajuuteen vaikuttaa pitkälti sisällön määrä ja esitettävän konseptin monisyisyys.

Navigointi, eli kuinka päästä paikasta A paikkaan B (ja paikkaan konversio)

Navigoinnin ilmeisin osa on tietenkin sivuston navigaatiot. Navigaatiota tärkeämpää on kuitenkin sivuston sisällä navigointi eli asiakkaan polku. Tässä vaiheessa suunnittelua on tärkeää tietää sivuston tavoitteet, eli minne haluamme loppukäyttäjää ohjata. Erilaisilla suunnittelun keinoilla saamme ohjattua kävijää haluttuun suuntaan ja mahdollistamme myös sen, että kävijä tietää missä kulkee.

Samankaltaisuus/tuttuus on suunnittelun kulmakivi

Asia, mihin jokainen meistä törmää joka päivä muotoiltuja palveluita käyttäessä, mukaan lukien verkkopalvelut. Kaikki meistä on tottunut kahvipaketin muotoon, liikennevalojen napin sijaintiin tai siihen, että miten päin sinulta kysytään kirjautuessa käyttäjätunnus ja salasana. Samankaltaisuus on erittäin tärkeää minkä tahansa palvelun suunnittelussa, niin myös verkossa. Kun suurimmassa osassa verkkosivustoja logo löytyy vasemmalta ylhäältä ja navigaatio yläreunasta, on ne syytä asettaa myös omalla sivustolla näille paikoille. Monesti tässä kohtaa haluttaisiin ’erottautua’ ja tehdä ’jotain repäisevää’, mutta jos käyttö vaatii loppukäyttäjältä aivopähkinän pureksimista, niin käyttäjä on ehtinyt siirtyä sillä aikaa jo kilpailevalle sivustolle.

Visuaalinen jatkuvuus

Aasinsiltana aikaisempaan kohtaan – jatkuvuus ja tuttuus on ehdotonta myös brändin sisällä. Visuaalisen ohjeiston avulla sivustosta rakennetaan jatkuva kokonaisuus brändin muiden elementtien kanssa. Näin varmistamme, että käyttökokemus säilyy loppukäyttäjällä mediasta riippumatta samanlaisena.

Basic SEO-palikat paikalleen

Vaikka sivuston rakentaminen ei varsinaista hakukoneoptimointia olekaan, niin sivustoa rakennettaessa huolehditaan silti SEO:n peruspalikoiden kuntoon laitosta. Sivuston URL:it pidetään loogisina, sivuille rakennetaan paikat tärkeille elementeille, kuten pääotsikolle, kuvat nimetään SEO-periaatteiden mukaan ja niin edelleen.

Nopeuden varmistaminen alusta asti

Sivuston nopeus vaikuttaa sekä SEM-menestykseen, mutta ennen kaikkea käyttäjäkokemukseen. Nopeuden optimoimiseksi voi sivustolla tehdä runsaastikin eri asioita, mutta jokaista sivustoa rakentaessa huomioidaan nopeuteen vaikuttavia tekijöitä. Sivustot pyritään rakentamaan mahdollisimman nopeaksi ruohonjuuritasolta asti, minkä takia esimerkiksi teemat, lisäosat ja muotoilujen sijoitukset huomioidaan jo alkuvaiheessa.

Kohderyhmä, jolle sivustoa rakennat

Kaikilla sivustoilla on oma kohderyhmänsä ja kaikilla kohderyhmillä omat tarpeensa. Kohderyhmän tarpeet tulee huomioida jo suunnittelun alkuvaiheessa, että lopullinen kokonaisuus palvelee ostavaa asiakasryhmää.

”Less is more”

Viimeisimpänä, muttei todellakaan vähäisimpänä pointtina – vähemmän on enemmän. Suunnitteluvaiheessa monesti kaikille osapuolille tulee paljon ideoita ja asioita, jotka olisi niin siistiä saada sisällytettyä sivustolle. Esimerkiksi video houkuttelisi ja animaatiot innostaisi, tai ensinäkymään haluttaisiin tuoda peruselementtien lisäksi myös lisäpalikoita. Totuus on kuitenkin se, että mitä selkeämpi design on ja mitä vähemmillä elementeillä se on toteutettu, niin sitä selkeämpää se tekee käyttökokemuksesta. Liian useat rinnakkaiset call to action-kehotukset tai visuaaliset ärsykkeet saavat loppukäyttäjän hämääntymään tavoitellulta polulta ja pahimmassa tapauksessa poistumaan ennen aikojaan.

HÄRKÄVINKKI

Verkkosivuprojektia aloittaessa, keskustele yhteistyökumppanin kanssa tärkeistä periaatteista ja prioriteeteista. Näin pääsette kaikki kärryille siitä, mitä toinen sivustolla arvostaa.

 

Lataa ilmainen verkkosivujen ostajan opas




Onko teidän yrityksessänne verkkosivu-uudistus käsillä? Siinä tapauksessa, lataa ihmeessä ilmainen oppaamme. Opas on tehty auttamaan yrityksiä verkkosivujen ostamisessa, ja siinä käydään läpi kilpailutuksessa huomioon otettavia asioita aina tarjouspyynnön laatimisesta toteuttajien vertailuun.

Lataa ilmainen opas!

Hatsolo.fi-sivustolle Gold-palkinto ja parhaan blogin palkinto Finnish Web Awardsissa

Kuten ehkä oletkin jo huomannut, Sininen Härkä osallistui vuoden 2018 Finnish Web Awardsiin Johannes ”Hatsolo” Hattusen sivustolla hatsolo.fi. Valitsimme sivuston fwa.fi-kilpailuun monestakin syystä:

Onnistunut käyttöliittymän suunnittelu

Hatsolon laaja palveluvalikoima on saatu tuotua erittäin onnistuneesti esille sivustolla, ja kävijää ohjataan sulavasti eteenpäin haluamaansa osioon. Sivusto on suunniteltu kuitenkin siten, että myös muut brändille tärkeät elementit, kuten ainutlaatuinen blogi, innostavat podcastit ja Hatsolon aktiivinen somepresenssi tuodaan hyvin esille.

Raikas sisällöntuotanto

Ehdottoman tärkeänä asiana sivustoa rakennettaessa pidettiin myös Hatsolon henkilöbrändin ja elämänilon tuomista esiin sivustolla. Asiakkaan aiemman sivuston tekstisisällöt, lukuunottamatta blogiartikkeleita, olivat sekä meidän että asiakkaan mielestä liian virkamiesmäisiä. Ja jos olet nähnyt Johanneksen puhumassa, niin miehen presenssi ei ole sitä alkuunkaan. Virkamiesmäisyys heitettiinkin romukoppaan, ja tilalle sijoitettiin leikitteleviä sloganeita, kuten ”Tilaa mun jutut”, ”Nää mut” ja ”Kuule mun jutut”.

Visuaalisuus ja ammattimaiset valokuvat

Sivuston visuaalisuudessa käytettiin erittäin paljon hyödyksi Hatsolon laadukasta valokuvamateriaalia, joka tukee entisestään vahvemman henkilöbrändin luomista edellä mainittujen seikkojen kanssa. Isot ja hallitsevat bannerikuvat auttavat jo sivustolla luomaan fiilistä Hatsolon ainutlaatuisista, viihdyttävistä ja motivoivista puheenvuoroista.

Lopputulos miellytti molempia osapuolia

Itse olimme erittäin tyytyväisi sivustoon sen valmistuttua, ja myös tulokset ovat puhuneet puolestaan. Ehdottomasti tärkein asia kuitenkin toteutui myös – asiakas oli silminnähden tyytyväinen projektiin: ”Heti palaverin alkuminuuteista lähtien tuntui, että tää on se juttu. Sinisellä Härällä on tajuttu äärimmäisen tärkeä pointti. Jokainen asiakas on uniikki ja tarvitsee uunikin ratkaisun.”

Jaettu kultainen FWA-palkinto ja toinen sija yleisöäänestyksessä

Finnish Web Awardsin yleisöäänestys kesti alkukesästä pitkälle syksyyn asti, ja äänestys keräsi kokonaisuudessaan yli 35 000 ääntä. Hatsolo.fi roikkui koko ajan äänestyksen kärjessä. Äänestysajan loputtua saimme tietää, että olimme koko yleisöäänestyksen toinen! Kiitos todella paljon kaikille äänestäneille. 🙂

Yleisöäänestyksen jälkeen arvovaltainen tuomaristo (johon kuuluivat Jorma Ollila, Ilkka Paananen, Tarja Virmala, Heikki Ahdekivi, Jaakko Tapaninen, Jorma Silvasti ja tuomariston puheenjohtaja Pekka Nuikki) otti finaaliin edenneet sivustot tiukkaan syyniin. Tuomarien mukaan kolme parasta sivustoa erottui selvästi muista – Sinisen Härän toteuttama hatsolo.fi jakoi lopulta kultaisen FWA-palkinnon Evermaden toteuttaman Helsingin Diakonissalaitoksen sivuston kanssa. Tuomaristo kommentoi toteuttamaamme sivustoa seuraavasti: ”Hatsolon vilpittömyys ja positiivisuus on sivuston punainen lanka ja sivuston toteutus johdonmukainen.”

Kultaisen FWA-palkinnon lisäksi Hatsolo.fi nappasi vielä kilpailun Paras blogi -palkinnon. Ehdottoman ansaitusti!

Kiitos Johannes, FWA ja kaikki äänestäjät!

Iso kiitos lienee kohdallaan. Kiitos Johannes hienosta projektista ja yhteistyöstä, Finnish Web Awards hyvistä järjestelyista ja asian mahdollistamisesta, sekä tietysti kiitos kaikille yleisöäänestyksessä meitä jeesanneille! Tästä on hyvä lähteä viettämään rentouttavaa joulua – katsotaan, mikä sivusto valitaan ensi vuonna mukaan kilpaan. 😉

Finnish Web Awardsin tulokset
Hatsolon ja Sinisen Härän yhteistyö
Hatsolon artikkeli Finnish Web Awardsista

 

Lataa ilmainen verkkosivujen ostajan opas




Onko teidän yrityksessänne verkkosivu-uudistus käsillä? Siinä tapauksessa, lataa ihmeessä ilmainen oppaamme. Opas on tehty auttamaan yrityksiä verkkosivujen ostamisessa, ja siinä käydään läpi kilpailutuksessa huomioon otettavia asioita aina tarjouspyynnön laatimisesta toteuttajien vertailuun.

Lataa ilmainen opas!

Näytä