Mainosviisari
VALIKKO
Brändi ja ilme

Typografia brändissä: fontin valinta ja käyttö

Fonttiluokat esimerkkeineen, säännöt valintaan, pariutustaulukko ja se, mitä fonttilisenssi tarkoittaa ilmaiselle ja maksulliselle fontille.

Metallisia kirjasinlaattoja latojan laatikon lokeroissa

Fontit jakautuvat viiteen pääluokkaan, ja valinta kannattaa aloittaa luokasta, ei yksittäisestä fontista:

LuokkaKuvausMissä toimii tyypillisesti
Groteski (sans-serif)Tasapaksut kirjaimet, ei koristeviivoja päätteissäVerkkosivut, sovellukset, moderni ja selkeä ilme
Antiikva (serif)Kirjaimissa päätteet ja vaihteleva viivanpaksuusPerinteinen, arvokas tai asiantunteva ilme, pitkä leipäteksti painetussa muodossa
Kirjoitusfontti (script)Jäljittelee käsinkirjoitusta tai kalligrafiaaOtsikot ja korostukset harvakseltaan, ei leipätekstiin
MonospaceJokainen kirjain vie saman tilanTekninen tai koodimainen ilme, harvinainen brändifonttina
DisplayfonttiVahvasti tyylitelty, usein vain isoja kirjaimia vartenIskulauseet ja pääotsikot pienessä määrässä, ei leipätekstiin

Miten valitsen yritykselle fontin?

Viisi sääntöä kattaa useimmat tilanteet:

  • Luettavuus ennen persoonallisuutta. Leipätekstifontin tärkein ominaisuus on luettavuus pitkässä tekstissä, ei omaleimaisuus – omaleimaisuus kuuluu ennemmin otsikko- tai displayfonttiin.
  • Testaa oikeassa koossa. Fontti, joka näyttää hyvältä suurena esityskuvassa, voi muuttua vaikealukuiseksi pienessä leipätekstikoossa – testaa aina lopullisessa käyttökoossa.
  • Tarkista kielituki. Suomen kieli tarvitsee ä:n, ö:n ja muut erikoismerkit oikein piirrettyinä – kaikki ilmaisfontit eivät tue niitä laadukkaasti.
  • Yksi fontti moneen painoon. Fontti, josta on saatavilla useita painoja (kevyt, normaali, lihavoitu), riittää usein yksinään sekä otsikoihin että leipätekstiin ilman toista fonttia.
  • Sopii ilmeen muuhun tyyliin. Pyöreä, ystävällinen fontti ja terävä, geometrinen logo viestivät ristiriitaisesti – typografian pitää tukea samaa mielikuvaa kuin väri ja muoto, katso visuaalinen ilme.

Kielituki on erityisen tärkeä tarkistaa suomenkieliselle sivustolle, koska monet ilmaiset fontit on suunniteltu ensisijaisesti englannin kielelle: ä ja ö saattavat näyttää oikein otsikkokoossa mutta muuttua epäselviksi pienessä leipätekstissä, jos fontin skandinaaviset merkit on piirretty huolimattomasti. Käytännössä kannattaa kirjoittaa testirivi, jossa on useita ä- ja ö-kirjaimia peräkkäin, ja katsoa fontin omalla esikatselusivulla, pysyvätkö pisteet selkeinä ja erottuvatko ne muusta kirjaimesta myös pienessä koossa – moni ongelma näkyy vasta silloin, ei suuressa otsikkokoossa.

Logo ja typografia ovat kaksi eri asiaa, vaikka molemmat ovat kirjaimia: logossa käytetty fontti on usein muokattu tai tyylitelty juuri sitä nimeä varten, eikä sitä yleensä käytetä sellaisenaan muualla materiaalissa. Otsikko- ja leipätekstifontit valitaan erikseen, sen jälkeen kun logo on jo olemassa – niiden tehtävä on tukea logoa, ei matkia sitä suoraan. Tarkempi ohje logon suunnitteluun on sivulla logo.

Montako fonttia brändi tarvitsee?

Kaksi fonttia riittää useimmalle brändille: yksi otsikko- tai displayfontti persoonallisuutta varten, ja yksi leipätekstifontti luettavuutta varten. Kolmatta fonttia ei yleensä tarvita – jos tarve tuntuu syntyvän, useimmiten ratkaisu löytyy jo valitun fontin toisesta painosta (esimerkiksi lihavoidusta versiosta korostuksiin) sen sijaan että lisättäisiin kokonaan uusi fontti mukaan.

Tämä ei ole tutkittu optimimäärä vaan käytännön nyrkkisääntö: useampi fontti tekee ilmeestä helposti sekavan, koska lukija joutuu tulkitsemaan uudelleen jokaisen fonttivaihdoksen merkityksen. Kaksi fonttia, käytettynä johdonmukaisesti aina samaan tarkoitukseen – yksi otsikoihin, yksi leipätekstiin – pitää ilmeen yhtenäisenä ilman että vaihtoehtoja on liikaa valittavana joka kerta uutta materiaalia tehdessä.

Kolmas fontti voi olla perusteltu vain kapeassa erikoistilanteessa, esimerkiksi kun tarvitaan erillinen numerofontti laskuihin tai hintoihin, jossa numeroiden erottuvuus on tärkeämpää kuin yhtenäisyys muun tekstin kanssa. Tämäkin kannattaa ensin kokeilla ratkaista jo valitun fonttiparin sisällä – monessa fontissa on omat, erikseen suunnitellut numeromerkit, jotka toimivat ilman kolmatta fonttia. Vasta jos tämä ei riitä, kolmas fontti kannattaa lisätä, ja silloinkin sen käyttö kannattaa rajata tarkasti yhteen toistuvaan tarkoitukseen, ei vapaavalintaiseksi korostuskeinoksi.

Sama pätee kirjoitusfontteihin ja displayfontteihin: ne toimivat parhaiten harvinaisena korosteena, ei jatkuvassa käytössä. Kun tällaista fonttia käytetään useammassa kuin yhdessä paikassa samalla sivulla, sen erottuva vaikutus katoaa – korostus toimii vain, jos se pysyy poikkeuksena eikä muutu toiseksi perusfontiksi.

Miten fontit pariutetaan?

OtsikkofonttiLeipätekstifonttiMiksi toimii
Antiikva (vahva)Groteski (neutraali)Kontrasti erottaa otsikon leipätekstistä selvästi
DisplayfonttiGroteskiPersoonallinen otsikko, luettava leipäteksti
Groteski (lihavoitu)Sama groteski (normaali paino)Yksi fonttiperhe, ero syntyy painosta – yksinkertaisin ja turvallisin yhdistelmä
Kirjoitusfontti (vain iskulauseessa)Antiikva tai groteskiKirjoitusfontti jää harvinaiseksi korostukseksi, ei hallitse kokonaisuutta

Turvallisin yhdistelmä on kahden ensimmäisen sarakkeen sijaan käyttää samaa fonttiperhettä molempiin: otsikko lihavoituna tai isokokoisena, leipäteksti normaalipainoisena samasta perheestä. Tämä välttää tilanteen, jossa kaksi eri fonttiperhettä eivät sittenkään sovi yhteen niin hyvin kuin esikatselussa näytti – riski, joka kasvaa aina kun fontit valitaan kahdesta erillisestä lähteestä ilman että niitä testataan rinnakkain samassa asettelussa.

Pariutusta kannattaa aina testata oikealla tekstillä, ei vain muutamalla sanalla suuressa koossa. Kaksi fonttia, jotka näyttävät sopivan yhteen otsikkotasolla, voivat silti riidellä keskenään heti kun leipäteksti kasvaa kappaleen mittaiseksi – rivinvälit, kirjainten leveys ja painojen ero näkyvät vasta pidemmässä tekstipätkässä.

Mitä fonttilisenssi tarkoittaa?

Fontti ei ole automaattisesti vapaasti käytettävissä, vaikka se löytyisi tietokoneelta esiasennettuna tai ilmaiseksi verkosta. Kahden tyyppisiä lähteitä kannattaa erottaa toisistaan:

Google Fontsin kirjasto on lähes kokonaan julkaistu SIL Open Font License -lisenssillä: se on maksuton kaupalliseenkin käyttöön, mukaan lukien asiakastyö ja brändimateriaali, eikä lisenssi rajoita käyttöä yleisömäärän tai liikevaihdon perusteella. Ainoa merkittävä rajoitus on, ettei itse fonttitiedostoa saa myydä erillisenä tuotteena.

Kaupalliset fonttitalot sen sijaan myyvät yleensä erillisiä lisenssejä eri käyttötarkoituksiin, eikä yhden ostaminen kata automaattisesti muita: työpöytälisenssi kattaa fontin asentamisen suunnitteluohjelmiin ja käytön painetussa materiaalissa, verkkofonttilisenssi kattaa fontin upottamisen verkkosivulle CSS:n kautta (usein hinnoiteltu sivunäyttöjen mukaan), ja sovelluslisenssi kattaa fontin upottamisen mobiili- tai muuhun sovellukseen. Ennen fontin käyttöä uudessa yhteydessä – esimerkiksi kun leipätekstifontti halutaan mukaan myös mobiilisovellukseen – kannattaa tarkistaa, kattaako olemassa oleva lisenssi kyseisen käytön vai tarvitaanko erillinen lisenssi lisää.

Käytännössä tämä tarkoittaa, että sama fontti voi olla sallittu verkkosivulla mutta kielletty mobiilisovelluksessa, jos vain verkkofonttilisenssi on ostettu. Lisenssien rajat eivät ole aina itsestään selviä, joten kannattaa lukea fonttitalon oma lisenssiehto sen sijaan että oletetaan yhden oston kattavan kaiken – varsinkin jos brändimateriaalia tuotetaan useaan eri kanavaan yhtä aikaa.

Fontin valintaa ei kannata tehdä lopulliseksi ennen kuin lisenssin kattavuus on tarkistettu. Ilmainen esikatselu tai kokeiluversio saattaa antaa väärän kuvan siitä, mihin fontti lopulta saa käyttää – erityisesti jos fontti löytyy tietokoneelle esiasennettuna käyttöjärjestelmän mukana, mikä ei tarkoita, että sen saisi upottaa vapaasti yrityksen omalle verkkosivulle tai painotuotteeseen. Turvallisin tapa on valita fontti, jonka lisenssi on tarkistettu kirjallisesti ennen kuin se otetaan käyttöön koko ilmeessä, ei vasta sen jälkeen kun materiaalia on jo julkaistu useassa kanavassa.

Lähteet