Avaa mikä tahansa pohjagalleria ilman selkeää tavoitetta, ja kahdenkymmenen minuutin kuluttua vaihtoehdot alkavat sulaa yhteen. Se ei ole sinun vikasi. Niin käy, kun yrität valita verkkosivupohjaa tietämättä, mitä sen pitäisi oikeasti tehdä. Suodatin tulee ensin. Galleria tulee toiseksi.
Avaa mikä tahansa verkkosivupohjien kirjasto, ja löydät satoja vaihtoehtoja, jotka kaikki näyttävät viimeistellyiltä ja ammattimaisilta. Mitä enemmän selaat, sitä vaikeammaksi valinta muuttuu, ei siksi että vaihtoehdot olisivat huonoja, vaan koska et ole vielä päättänyt, mitä oikeasti tarvitset. Ilman suodatinta ennen katsomisen aloittamista jokainen pohja on yhtä uskottava ja yhtä vakuuttamaton.
Verkkosivupohjat ovat valmiita sivuasetteluja, jotka antavat sivustollesi visuaalisen rakenteen ensimmäisestä päivästä. Oikea pohja säästää tunteja suunnittelutyötä ja antaa kävijöillesi selkeän, yhtenäisen kokemuksen. Väärä taistelee sinua vastaan joka käänteessä, pakottaa asetteluun, joka ei sovi sisältöösi, ja jättää sinut puristamaan yritystäsi toiselle tehtyyn muottiin.
Tämä opas käy läpi päätökset, joilla pohjan valinnassa oikeasti on väliä, siinä järjestyksessä, jossa ne kannattaa tehdä.
Mitä sivustosi oikeasti pitää tehdä?
Aloita tästä, älä galleriasta. Ennen kuin katsot yhtään pohjaa, kirjoita ylös yksi asia, jonka sivustosi pitää saada tapahtumaan. Onko se se, että kävijät soittavat sinulle? Ostavat tuotteen? Varaavat ajan? Täyttävät lomakkeen? Lataavat jotain?
Tuo vastaus ratkaisee lähes kaiken muun siitä, mikä pohja sopii. Suuriin tuotekuviin ja ostoskoripainikkeeseen perustuva pohja on oikea rakenne verkkokaupalle. Pääotsikkoon ja yhteydenottolomakkeeseen perustuva pohja on oikea rakenne paikalliselle palveluyritykselle. Molemmat voivat näyttää siisteiltä ja ammattimaisilta, mutta ne ohjaavat kävijöitä täysin eri toimintoihin.
Jos ohitat tämän vaiheen ja valitset pohjan, koska se näyttää hyvältä, käytät viikkoja yrittäen pakottaa sen muotoon, jota varten sitä ei ole suunniteltu. Päädyt tuotekuvaruudukkoon, jossa ei ole luontevaa paikkaa palvelulistallesi, tai minimalistiseen referenssiasetteluun, jossa ei ole tilaa hinnoillesi.
Kirjoita tavoitteesi ylös. Katso sitten pohjia sen linssin läpi. Jos asettelu ei nosta tavoitetta keskiöön, siirry seuraavaan.
Vastaako pohja verkkosivusi tyyppiä?
Katso pohjia, jotka sijoittuvat jatkuvasti hyvin alallasi, ja huomaat niiden jakavan rakenteellisia kaavoja. Ei siksi, että kaikki olisivat kopioineet toisiaan, vaan koska tietyt asettelut ratkaisevat tiettyjä ongelmia tehokkaammin. Kävijöillä on myös odotuksia, jotka on rakennettu kaikista muista käyttämistään saman luokan sivustoista. Pohja, joka rikkoo noita kaavoja liikaa, luo kitkaa ennen kuin kukaan lukee sanaakaan.
Ravintolapohja aloittaa tyypillisesti vahvalla ruokakuvauksella, lyhyellä sijainti- ja aukioloaikalohkolla ja pöytävarauspainikkeella ensimmäisen vierityksen sisällä. Asianajotoimiston pohja aloittaa yleensä luottamuslauseella, toimialueiden yleiskatsauksella ja helposti löytyvällä puhelinnumerolla. Henkilökohtaisen valmentajan pohja aloittaa usein muutokseen keskittyvällä otsikolla ja ”varaa tapaaminen” -painikkeella.
Nämä eivät ole sattumanvaraisia kaavoja. Ne toimivat, koska asettelu vastaa sitä, mitä tuo yleisö etsii sivulle saapuessaan.
Valitse pohja, joka on tehty sivustotyyppisi mielessä pitäen. Useimmat pohjakirjastot on järjestetty luokkiin juuri tästä syystä. Käytä noita suodattimia ennen selaamista.
Jos et vielä tiedä, minkä tyyppistä sivustoa rakennat, verkkosivun suunnittelu ennen rakentamista on hyvä paikka aloittaa.
Toimiiko pohja mobiilissa?
Tarkista kaikkien harkitsemiesi pohjien mobiiliesikatselu ennen kuin kiinnyt siihen, miltä se näyttää tietokoneella. Useimmat pohjat ovat nykyään teknisesti ”responsiivisia”, eli ne mukautuvat eri näyttökokoihin. Mutta responsiivinen ja hyvin mobiiliin suunniteltu ovat kaksi eri asiaa.
Pohja, joka näyttää upealta leveänä tietokoneasetteluna, voi romahtaa sekavaksi osioiden pinoksi puhelimella. Vaakasuunnassa levittyvät navigointivalikot muuttuvat joskus vaikeiksi napautettaviksi pienellä näytöllä. Suuret pääkuvat, jotka hallitsevat kauniisti monitorilla, voivat työntää varsinaisen viestisi mobiilissa taitteen alapuolelle, missä useimmat kävijäsi ovat.
Käy mobiiliesikatselu läpi kuin olisit asiakas. Löydätkö pääasiallisen toimintakehotuksen vierittämättä neljän osion ohi? Aukeaako valikko siististi? Pysyykö teksti luettavana? Onko puhelinnumero tai yhteydenottopainike helppo napauttaa?
Jos pohjakirjasto ei näytä mobiiliesikatselua, avaa demo puhelimellasi ennen päätöstä. Jotta ymmärrät, miksi tällä on väliä teknisellä tasolla, kannattaa tutustua aiheeseen responsiivinen suunnittelu.
Sopiiko asettelu sisältöön, joka sinulla oikeasti on?
Ota mikä tahansa pohjan demo ja vaihda kuvapankkikuvat ja paikkatäyteteksti siihen, mitä sinulla oikeasti tulee olemaan. Toimiiko se vielä?
Tässä monen pohjavalinnan perustelut romahtavat. Demo näyttää upealta, koska siinä on tusina ammattimaista elämäntyylikuvaa, siististi sijoitetut suositukset viideltä tyytyväiseltä asiakkaalta ja tekstintekijän kirjoittamat lyhyet iskevät otsikot. Todellinen tilanteesi voi olla kolme kelvollista tuotekuvaa, yksi suositus toistaiseksi ja palvelukuvaus, joka on pidempi kuin pohja odottaa.
Jotkin pohjat tarvitsevat paljon visuaalista sisältöä toimiakseen. Toiset on tehty kantamaan tekstipainotteisia sivuja. Jotkin olettavat, että sinulla on tiimin kasvokuvaosio, referenssisivu, blogi ja täysi UKK. Toiset ovat suunnittelultaan hoikkia ja minimalistisia.
Sovita pohjan sisältöodotukset siihen, mitä sinulla on nyt, ei siihen, mitä toivot olevan kuuden kuukauden päästä. Pohja, joka näyttää ontolta todellisella sisällölläsi, ei ole oikea pohja, olipa demo kuinka hyvä tahansa.
Kiinnitä huomiota siihen, miten pohja käsittelee näitä alueita
- Kuinka monta kuvaa se vaatii ja millä laatutasolla?
- Missä navigointi sijaitsee ja kuinka monta sivua se mahtuu sisältämään?
- Onko asettelussa tilaa pidemmälle palvelukuvaukselle vai odottaako se kahden rivin tiivistelmää?
- Onko suosituksille luonteva paikka, ja tarvitseeko se kolme vai kymmenen näyttääkseen tasapainoiselta?
Kuinka paljon voit oikeasti muuttaa?
Pohjat ovat lähtökohtia, eivät valmiita tuotteita. Sinun täytyy vaihtaa värejä, fontteja, säätää välejä ja järjestää osioita uudelleen tehdäksesi siitä omasi. Kysymys on, kuinka paljon voit tehdä ilman koodin kirjoittamista.
Jotkin pohjat ovat joustavia ja antavat siirrellä osioita, lisätä uusia lohkoja, muuttaa yksittäisten rivien asettelua ja mukauttaa lähes kaiken visuaalisella editorilla. Toiset ovat jäykempiä ja antavat vaihtaa värejä ja kuvia mutta pitävät rakenteen tarkasti lukittuna.
Kumpikaan lähestymistapa ei ole väärä. Jäykempi pohja voi olla nopeampi julkaista, jos se jo sopii hyvin sisältöösi. Joustavampi pohja on parempi, jos yritykselläsi on erityisiä asettelutarpeita, joita tavallinen pohja ei kata.
Ole rehellinen teknisestä mukavuustasostasi. Jos et ole joku, joka alkaa selvittää asetteluongelmia tai opetella pohjan mukautettuja asetuksia, suosi pohjaa, joka tarvitsee vähemmän säätöä. Jos haluat täyden hallinnan ja viihdyt editorissa, etsi pohjaa, joka mainostaa osiotason joustavuutta.
Tämä kannattaa miettiä yhdessä sivustotyökalun valinnan kanssa. Miten sivustotyökalut toimivat vaikuttaa siihen, kuinka paljon hallintaa sinulla on minkä tahansa pohjan mukauttamiseen.
Onko pohja tehty SEO huomioiden?
Katso pohjan demosivun lähdekoodia, niin huomaat, että jotkin on tehty siistillä, jäsennellyllä HTML:llä ja toiset ovat sekasotku päällekkäisiä elementtejä ja inline-tyylejä, jotka vaikeuttavat hakukoneiden lukemista. Sinun ei tarvitse olla tekninen tarkistaaksesi muutaman pintatason merkin.
Hyvät pohjat käyttävät asianmukaista otsikkorakennetta, alkaen yhdestä H1:stä sivua kohti ja edeten loogisesti H2- ja H3-osioihin. Ne latautuvat nopeasti, koska niissä ei ole ylisuuria kuvatiedostoja eikä käyttämätöntä koodia. Ne eivät piilota tärkeää tekstiä kuviin tai dynaamisiin tehosteisiin, joita hakukoneet eivät helposti indeksoi.
Nopeus on erityisen tärkeä. Pohja, joka latautuu hitaasti suurten taustavideoiden tai turhien animaatioiden vuoksi, sijoittuu huonommin hakutuloksissa ja turhauttaa kävijöitä hitaammilla yhteyksillä. Tarkista pohjan demosivu nopeustestityökalulla ennen sitoutumista.
Jos haluat ymmärtää, miten SEO vaikuttaa sivustosi rakenteeseen, mitä SEO on ja miten se toimii selittää perusteet.
Sopivatko värit ja tyyli oikeasti brändiisi?
Tämä tuntuu itsestään selvältä, mutta se kannattaa täsmentää. Pohjissa on oletusvärimaailma ja fonttiyhdistelmä. Useimmat niistä voi vaihtaa. Mutta pohjan perustyyliä, sen välejä, energiaa ja sitä, tuntuuko se minimalistiselta, rohkealta, lämpimältä vai yritysmäiseltä, ei yleensä voi muuttaa pelkillä väreillä.
Pohjalla, jossa on paksut reunat, voimakkaat kontrastit ja ylisuuri typografia, on tietty persoonallisuus. Jos yrityksesi on hiljainen, luottamukseen perustuva palvelu kuten terapia tai talousneuvonta, tuo persoonallisuus sopii huonosti, vaikka vaihtaisit kaikki värit neutraaleiksi. Virtaava, taiteellinen pohja pehmeällä typografialla ja runsaalla tyhjällä tilalla voi tuntua täysin väärältä alalle, jonka pitää viestiä tehokkuutta ja luotettavuutta.
Ennen kuin ihastut pohjan väriskeemaan, riisu se mielessäsi ja kysy, mitä taustalla oleva rakenne sanoo. Onko tahti rauhallinen vai energinen? Onko se suunniteltu saamaan sisältö tuntumaan lähestyttävältä vai arvovaltaiselta? Leviääkö asettelu vai tiivistyykö se?
Valitse pohjan luonteen mukaan, älä vain nykyisten värien.
Mitä tapahtuu, kun yrityksesi kasvaa?
Pohja, joka toimii hyvin viiden sivun sivustolle, voi tuntua ahtaalta, kun olet lisännyt blogin, resurssiosion, tiimisivun ja kaksi uutta palvelualuetta. Kannattaa ajatella yksi askel eteenpäin ennen sitoutumista.
Tarkista, onko pohjassa navigointirakenne, joka kestää enemmän sivuja. Katso, onko asettelussa luontevia paikkoja uusille osioille vai tuntuuko se suunnitellulta pysymään täsmälleen sellaisena kuin on. Jos pohjakirjasto näyttää useita sivupohjia, esimerkiksi erillisen blogiasettelun, referenssiruudukon ja yhteystietosivun, se on yleensä hyvä merkki siitä, että se on tehty kasvu mielessä.
Mieti myös, mitä ominaisuuksia saatat tarvita myöhemmin. Verkkokauppa, varauskalenteri, jäsenalue. Kaikki pohjat eivät tue näitä lisäyksiä siististi. Jos taustalla oleva alusta ei tue noita ominaisuuksia, pohjalla ei ole väliä.
Alustan valinta, joka kasvaa mukanasi, on osa tätä päätöstä. Näin valitset oikean verkkosivutyökalun kattaa, mitä kannattaa tarkistaa ennen alustaan sitoutumista.
Katsotko sitä omin silmin vai asiakkaidesi silmin?
Tämä on tarkistus, joka jää useimmin väliin. Tulet viettämään paljon aikaa oman sivustosi katselemiseen, joten on luonnollista valita jotain, mistä itse pidät. Mutta pohja ei ole sinua varten. Se on sitä ihmistä varten, joka saapuu sivustollesi etsiessään sitä, mitä myyt.
Mieti, kuka tuo ihminen on. Kuinka vanha hän on? Onko hänellä kiire vai aikaa? Onko hän jo valmis ostamaan vai vielä vertailemassa vaihtoehtoja? Selaako hän puhelimella työmatkalla vai istuuko pöydän ääressä tutkimassa huolellisesti?
Siisti, minimalistinen pohja pitkillä vieritysosioilla voi tuntua sinusta tyylikkäältä mutta hitaalta ja epäselvältä kävijästä, joka haluaa vain tietää hinnan ja soittaa. Pohja, jossa on paljon visuaalista energiaa ja liikettä, voi tuntua sinusta jännittävältä mutta kaoottiselta ja epäammattimaiselta jollekulle, jonka täytyy luottaa sinuun ennen kuin hän antaa tietonsa.
Käytä asiakasprofiiliasi pohjien suodattamiseen. Valitse se, joka olisi heille järkevin, ei se, jonka valitsisit itsellesi rakentaessasi henkilökohtaista sivua.
Miten WEMASY hoitaa pohjat?
WEMASYn verkkosivutyökalu sisältää pohjakirjaston, joka on järjestetty alan ja sivustotyypin mukaan. Pohjia voi mukauttaa visuaalisella editorilla ilman koodin kirjoittamista. Hosting, SSL ja analytiikka kuuluvat samaan tilaukseen, joten erillistä käyttöönottoa ei tarvita pohjan valinnan ja mukauttamisen jälkeen. Katso, mitä pakettiin kuuluu, hintasivulta.
Usein kysytyt kysymykset verkkosivupohjan valinnasta
Vaikuttaako valitsemani pohja SEO:oni?
Kyllä, epäsuorasti. Hyvin jäsennelty pohja käyttää siistiä otsikkohierarkiaa, latautuu nopeasti ja on mobiiliresponsiivinen. Nämä ovat kaikki tekijöitä, joita hakukoneet huomioivat. Paisunut tai huonosti koodattu pohja voi hidastaa sivustoasi ja vaikeuttaa hakukoneiden sisältösi indeksointia. Pohja ei suoraan määritä sijoituksiasi, mutta teknisesti heikko pohja luo esteitä, joita hyvä sisältö yksin ei ylitä. WEMASYn verkkosivutyökalulla voit asettaa tämän suoraan sivustollesi.
Voinko vaihtaa pohjaa myöhemmin rakentamatta sivustoa uudelleen?
Se riippuu alustasta. Joissakin sivustotyökaluissa pohjan vaihtaminen on suhteellisen helppoa ja sisältösi siirtyy mukana. Toisissa pohjan vaihtaminen tarkoittaa sivujen rakentamista alusta, koska sisältö on sidottu pohjan rakenteeseen. Ennen kuin sitoudut pohjaan, tarkista, miltä vaihtoprosessi näyttää alustallasi. Jos se on tuskallinen, se on syy käyttää enemmän aikaa oikean pohjan valintaan etukäteen.
Onko parempi valita omalle alalleni suunniteltu pohja?
Yleensä kyllä. Alakohtaiset pohjat on tehty yleisösi odotukset mielessä pitäen. Kampaamopohja aloittaa ajanvarauksella ja visuaaleilla. Konsultointipohja aloittaa uskottavuudella ja yhteydenotolla. Sellaisella aloittaminen, joka on suunniteltu juuri sinun yritystyypillesi, tarkoittaa vähemmän uudelleenjärjestelyä, jotta se toimii niin kuin asiakkaasi odottavat. Tärkeämpi suodatin on silti se, sopiiko se sisältöösi ja tavoitteisiisi. Alasopivuus on vahva lähtösignaali, ei ehdoton sääntö.
Montako pohjaa minun pitäisi vertailla ennen päätöstä?
Pidä lyhytlista kolmessa tai viidessä. Liian monen pohjan katsominen saa ne sulautumaan yhteen, etkä enää pysty erottamaan, mikä on oikeasti parempi. Parempi tapa on soveltaa suodattimia ensin (mobiili, sisältösopivuus, sivustotyyppi, mukautettavuus) ja katsoa vain pohjia, jotka läpäisevät ne kaikki. Tuossa lyhytlistassa teet lopullisen valinnan.
Tarvitsenko ammattisuunnittelijan pohjan mukauttamiseen?
Et, jos käytät alustaa, jossa on visuaalinen editori. WEMASYn verkkosivutyökalulla voit säätää värejä, fontteja, kuvia ja asetteluosioita ilman suunnittelu- tai koodauskokemusta. Useimmat pohjan mukautukset, kuten brändivärien vaihtaminen, logon lisääminen ja osioiden järjestäminen uudelleen, ovat helppoja visuaalisessa editorissa. Suunnittelija tuo lisäarvoa merkittävämmissä rakenteellisissa muutoksissa tai mukautettujen grafiikoiden luomisessa, jotka ylittävät editorin kyvyt.