Skip to content

Konversio-optimointi osa 3: Serif vai sans serif?

Fonttityylillä ilmaistaan tunnetta, vahvistetaan brändiä ja luodaan mielikuvia. Millaisia ovat konversion kannalta hyvät verkkofontit?

Fontin anatomia on monimutkainen

Kirjaisimen eli fontiin selkeyteen vaikuttaa moni asia.

Serif vs. sans serif

Serifit ovat ne pienet ”hipsukat”, jotka ovat tuttuja printtikirjojen fonttien päätteinä. Näiden merkityksestä tekstin luettavuudelle on väitelty pitkään. Erityisesti verkossa käytettäväksi onkin kehitetty useita päätteettömiä fontteja.

sansserif.gif

Pistekoko

Pistekoolla on merkitystä luettavuuden kannalta, mutta usein yhdessä esim. tekstin värin kanssa. Kirjasimen liiallinen ohuus voi myös olla syynä huonolle luettavuudelle.

pistekoko.gif

Korkeus ja päätteet

Fonttityyppi muodostuu peruskirjaimesta ja päätteistä. X-korkeus on uusimmissa verkkofonteissa optimoitu korkeaksi päätteiden osuuden kokonaisuudesta jäädessä pieneksi.

skin.jpg

Tasapeli serifin ja sans serifin välillä

Päätteellisten ja päätteettömien fonttien selkeydestä, silmäiltävyydestä ja luettavuudesta on mitelty vuosikymmenien ajan ilman aukotonta näyttöä kumpaankaan suuntaan. Alex Poole listaa ansiokkaasti tehdyt tutkimukset ja niiden sisältämät argumentit.

Päätteiden käyttöä perustellaan muun muassa sillä, että niiden käyttö helpottaa hahmottamista ja tekstin ennakoitavuutta. Kirjasinpäätteiden ajatellaan sitovan tekstin helpommin hahmotettaviksi sanoiksi ja nopeuttavan näin lukemista. Kysyttäessä ihmisten mielipidettä asiasta, päätteellisistä fonteista pidetään enemmän.

Päätteettömien fonttien taas yleisesti väitetään olevan luettavampia ja selkeämpiä verkossa. Jonkin verran tutkimusnäyttöä on siitä, että pienellä fonttikoolla ovat päätteettömät fontit helpompia lukea.

Fonttityylin merkitys suurempi kuin päätteiden

Tekstin luettavuuden kannalta olennaisempaa kuin päätteiden käyttö fonteissa on itse fonttityyli. Kun tyyli on hyvin koristeellinen, hahmottaminen vaikeutuu ja sitä kautta lukeminen ja luetun ymmärtäminen. Mielikuva koko sisällön ymmärrettävyydestä voi muuttua pelkästään vaikeaselkoisen fontin vuoksi. Luettavuuteen vaikuttavat kuitenkin myös kirjainten välistykset, paksuus, x-korkeus ja esimerkiksi rivivälit.

Kun haluat saada viestisi ymmärretyksi, käytä perustyylisiä fontteja ja vältä turhaa koristeellisuutta.

Capture.jpg

Käytä verkossa perusfontteja ja jätä koristeelliset fontit pois. Voit kokeilla esim. käyttää päätteellisiä fontteja otsikoissa ja päätteettömiä leipätekstissä. Jos käytät päätteellistä fonttia leipätekstissä, varmista fontin riittävä koko, paksuus ja kontrasti.

Vinkki: tee kokeiluja ja kysy käyttäjiltä mielipidettä. Nauhoita käyttäjien vierailuja, vertaa myös sivulla vietettyä aikaa ja konversioiden määrää, kun vaihtelet fontin tyyliä.

Esimerkki: tutustu miten leikkisästi asiakkaamme Mjolk.se käyttää sivuillaan erilaisia fonttityylejä ja –päätteitä. Ihan raikasta vai mitä?

Artikkeliin on lainattu Alex Poolen 2008 julkaisemaa artikkelia Which Are More Legible: Serif or Sans Serif Typefaces?

Kirjoittaja Outi Aramo on pitkän linjan käyttäjätutkimus-, web-analytiikka- ja digitaalisen markkinoinnin asiantuntija. Parhaillaan Knowit Experience tiimissä Helsingissä. Blogi on kolmas osa konversio-optimoinnin käytännön vinkkeihin keskittyvää blogisarjaa.

Konversio-optimoinnin palvelut

Knowit Experience kaikki palvelut