Typografia

Verkkopalveluissa ei aina ole mahdollista käyttää mitä tahansa kirjasinta, vaan valinta on tehtävä vastaanottajan koneelle asennettujen kirjasinten välillä. Käyttöjärjestelmien, kuten Windowsin ja MACin mukana tulee joitakin oletuskirjasimia, jotka ovat automaattisesti käytettävissä myös verkopalveluissa ja joista valinnan voi tehdä. Eli vaikka organisaation graafisessa ohjeistuksessa sanotaan, että kaikkiin töihin pitää käyttää leipätekstissa Century Gothicia, se on korvattava jollakin verkossa yleisessä käytössä olevalla kirjasimella. Hyvä graafinen ohjeistus ottaa huomioon myös netin ja siellä käytettävät elementit.

Onneksi verkkopalveluissa voi nykyään käyttää vapaammin itse määriteltyjä fontteja. Tällöin käytetään kirjasimia, jotka ovat saatavilla netissä houstattuna eli ne sijaitsevat pysyvästi toisella palvelimella ja nitä vain referoidaan omalla sivustolla. Yksi hyvä esimerkki tästä on Googlen tarjoamat fontit. Google tarjoaa satoja vapaita kirjasinleikkauksia, joista löytyy perusfontteja ja mielenkiintoisia erikoiskirjasimia maustamaan verkkopalvelua. Suunnittelija voi jopa hakea kirjasimet koneelleen ja käyttää niitä omassa suunnitteluohjelmassaan. Uusia fontteja lisätään listaan jatkuvasti.

Googlen fonttien lisäksi on muitakin tarjoajia, joiden fontteja voidaan käyttää. Tässä esimerkkejä:

  • Fonts.com (kaikki mahdolliset kaupalliset fontit - Adobe, Linotype, Monotype, ITC jne.)
  • Font Squirrel (ilmaisia fontteja)
  • Fontdeck (kaupallisia fontteja, maksullinen)

Koska sivustolla käytetyt kirjasimet haetaan käyttäjän omalle koneelle, useamman erilaisen kirjasimen käyttämistä ei suositella. Esimerkiksi hyvä idea on käyttää yhtä tai kahta tällaista houstattua fonttia otsikoissa ja leipätekstissä taas käyttäjän omalla koneella olevaa perusfonttia.

Otsikot kuvana?

Julkaisujärjestelmien otsikoissa – kuten myös navigaatiossa – on hyvä välttää kuvapohjaisia ratkaisuja koska niiden muokkaaminen saattaa osoittautua vaikeaksi. Joissakin järjestelmissä otsikot luodaan automaattisesti kuvaksi etukäteen määritellystä kirjasimesta, mutta niiden tarkkuus, laatu ja skaalautumiskyky jäävät yleensä jälkeen normaalista kirjasimesta. Samoin hakukonelöydettävyys ei ole sitä luokkaa kuin oikeilla kirjasimilla saatu hyöty.

Tavutus

Nettisivuilla ei ole automaattitavutusta, kuten tekstinkäsittelyohjelmissa. Tämä tarkoittaa sitä että sanat näkyvät aina kokonaisina eikä niihin tule automaattisesti tavuviivoja. Tekstiä voi kyllä tavuttaa itse pakottamalla sopivaan kohtaan tavuviivan ja tekemällä rivivaihdon. Ongelmana tässä on kuitenkin Macintosh- ja PC-koneiden erilaiset tavat esittää kirjasimia. Yleensä MACeissä kirjaimet vievät pienemmän tilan kuin vastaava samankokoinen teksti PC:ssä. Tämä saattaa aiheuttaa sen ettei tavuviiva osu kohdalleen rivin lopussa. Esimerkiksi itsetavutettu teksti MAC:ssä:

Lorem ipsum dolor sit amet, consec-
tetuer adipiscing elit, sed diam.

Voi näkyä PC:ssä näin:

Lorem ipsum dolor sit amet,
consec-
tetuer adipiscing elit, sed diam.

Käytettävät kirjasimet

Ohessa yleisimmät verkkokäytössä olevat Windows-kirjasimet ja niiden MAC-vastineet.

Windows MAC
Arial Arial, Helvetica
Arial Black Arial Black, Gadget
Comic Sans MS Comic Sans MS
Courier New Courier New
Georgia Georgia
Impact Impact, Charcoal
Lucida Console Monaco
Lucida Sans Unicode Lucida Grande
Palatino Linotype Book Antiqua, Palatino
Tahoma Geneva
Times New Roman Times
Trebuchet MS Helvetica
Verdana Verdana, Geneva
Webdings (Webdings) Webdings (Webdings)
Wingdings (Wingdings) Zapf Dingbats (Zapf Dingbats)
MS Serif New York

Verkkopalvelun typografiassa ei yleensä jättäydytä yhden fontin varaan, vaan kirjasimet määritellään fonttiperheinä. Esimerkiksi leipätekstin voi määritellä muodossa "Arial, Helvetica, Verdana". Tällöin selain tarkistaa käyttäjän koneelta onko sivulla tarvittavia kirjasimia saatavilla ja näyttää tekstin ensimmäistä osumaa vastaavalla kirjasimella. Jos esimerkiksi Arialia ei ole saatavissa, teksti näytetään Helvetica-kirjasimella.

– Torsti Niiranen

« Edellinen sivu


Päivitetty viimeksi 17.4.2012. Artikkeli perustuu osittain Ryan Cramerin Desig for CMS-Powered Web Sites -artikkelisarjaan.

Kirjoittajasta

Torsti Niiranen on Thule Digital Oy:n projektipäällikkö ja AD. Hän on toteuttanut vuodesta 1996 lähtien satoja erilaisia verkkopalveluja. Drupal-julkaisujärjestelmää Niiranen alkoi käyttää vuonna 2006.

Palvelut mainostoimistoille

Thule Digitalin yksi erikoistumisalue on tarjota mainostoimistoille verkkopalveluiden suunnittelu- ja tuotantoapua. Pitkän ammattikokemuksemme ansiosta pystymme luottamuksellisesti ja kilpailukykyisin hinnoin toteuttamaan tuottamanne ilmeen tai suunnitelman pohjalta laadukkaan ja standardien mukaisen sivuston, uutiskirjepohjan, Flash-animaation tai muun digitaalisen median projektin.

Ota yhteyttä ja pyydä tarjous: torsti [dot] niiranen [at] thuledigital [dot] fi
Puh. suora 040 717 7096

Jaa/Tallenna

Thule Digital Oy  //  Teknologiantie 1, 90590 Oulu  //  myynti [at] thuledigital [dot] fiAA-luottokelpoisuus