Typografia Osa kurssimateriaalista Verkkomultimedia ICT1tn004

1. TypografiaOsa kurssimateriaalista Verkkomultimedia ICT1tn004 13.9.2009Elina Ulpovaara

2. Mitä on typografia? Tyyppikirjaimien suunnittelua, muotoja ja asettelua käsittelevä taiteen ja tieteen laji. Päämääränä on viestin välittyminen. Toimii lukijan apuna. typografia Tavoitteena on hyvä luettavuus. Antaa julkaisusta ensivaikutelman. Ilmaiseen ilman lukemista, mistä julkaisun lajityypistä on kysymys. Suunnitellaan kohderyhmän eli vastaanottajan mukaan. Typografisiin valintoihin vaikuttaa myös julkaisun luonne.

3. Typografinen viivasto ylälinjaversaalilinja gemenalinja peruslinja alalinja Hopnk Kirjainten osia poikkiviiva vastamuoto Hopnk yläpidennys kaari pylväs liitoskulma käsi jalka pääte varsi alapidennys

4. Sanastoa Kirjaintyyppi Kirjaintyypillä tarkoitetaan yhtenäisen ulkoasun suunnittelua ja piirrettyä merkistöä. Se sisältää kaikki merkit - kirjaimet, numerot jne. Fontti Kirjaintyypistä käytetään yleisesti arkikielessä termiä fontti. Fontti-sana tulee ranskankielestä fondre, joka tarkoittaa valaa. Alunperin fontilla tarkoitettiin yhtä tiettyä kokoa koko kirjaintyypin sijaan.   Kirjainleikkaus Yhdestä kirjaintyypistä on mahdollisesti suunniteltu erilaisia kirjainleikkauksia esim. kaikki eri lihavuudet ovat omia leikkauksiaan.  Kirjainperhe Kirjainperhe sisältää yhden kirjaintyypin kaikki muunnokset esim. kaikki eri lihavuudet ja kursiivit.  Kirjaintyyli Kirjaintyyli on ryhmä ominaisuuksiltaan toisiaan muistuttavia kirjaintyyppejä.

5. Kirjainten luokittelu Kirjaintyyppejä luokitellaan mm. muotoilun, historian ja käyttötavan mukaan. Yhtä virallista luokitustapaa ei ole olemassa. Yhden tunnetuimmista luokitteluista on tehnyt ranskalainen Maximilien Vox (1954). Siinä luokkia on yhdeksän: neljä ensimmäistä ovat antiikvoja, viides on egyptienne, kuudennessa on kaikki groteskit, seitsemännes on kaiverrettuja muotoja jäljittelevät tyypit, kahdeksas on kaunokirjoitustyypit ja yhdeksäs on sekalainen luokka, joka sisältää kaikki muut. Yksi luokittelutapa on kirjaimen muotoon liittyvä: Antiikvat Groteskit Egyptienne Kalligrafiset Kaiverretun kaltaiset Muut

6. Antiikvat Vanhimmat 1400-luvulta Antiikvoille ominaista: päätteet kirjaimien eri osien paksuusvaihtelut ylöspäin ohuita, alaspäin paksuja Renessanssiantiikvat, siirtymäkauden antiikvat ja uusantiikvat Luettavuus painettuna hyvä. Mm. Garamond, Oldstyle, Bookman, Bembo, Sabon, Didot, Cochin, Bell vahva kontrasti Mopk päätteiden muoto ja liitos akseli pystysuora tai vasemmalle kalteva GaramondCaslonBookmanBodoniBaskervilleTimes New Roman

7. Groteskit Yleistyivät 1920-luvulla Groteskeille ominaista tasavahva tai lähes tasavahva viiva Päätteetön Erityisesti Verdana on suunniteltu www-käyttöön. Mm. Folio, Futura, Gill, Helvetica, Univers, Venus, Bauhaus, Arial Mopk Gill SansArialFranklin GothicVerdana

8. Kontrastit Kontrastit syntyvät eri tekstielementtien välisillä eroilla. Kontrasteja muodostuu myös, kun tekstiin liitetään muita elementtejä kuten kuvia. Käytä kontrastikeinoja harkiten. Mieti tarkkaan, mitä haluat korostaa. Jos korostaa kaikkia, niin mikään ei erotu. Valitse vain yksi tai kaksi kontrastikeinoa typografiseen taittoosi. Kokokontrasti erikokoiset elementit typografiassa: saman fontit erikoot verkkomultimedia verkkomultimedia

9. Vahvuuskontrasti typografiassa: eri lihavuutta olevat kirjaimet tummat ja vaaleat elementit Värikontrasti eri värit, vastavärit värikuva harmaan tekstipinnan kanssa typografiassa: eri väriset fontit Muotokontrasti eri fonttiperheet normaalit pystykirjaimet vastaan kursiivi/lihavoitu teksti säännölliset ja epäsäännölliset ladelmat: esim. suorakaiteen muotoiset kuvat ja liehureunatekstit verkkomultimedia verkkomultimedia verkkomultimedia

10. Typografinen suunnittelu kirjain sana rivi kappale palsta fonttikirjain- leikkaus kokoväri fonttikirjain- leikkaus kokoväri fonttikirjain- leikkaus kokoväri fonttikirjain- leikkaus kokoväri fonttikirjain- leikkaus kokoväri merkkivälit merkkivälit merkkivälit merkkivälit sanan välitrivin pituus sanan välitrivin pituus sanan välitrivin pituus rivivälitpalstan muotosisennys rivivälitpalstan muotosisennys Muokaten:Markus Itkonen, Typoteeseja – Tarkan typografian opas, 1999, Tammer-Paino palstaväli

11. Kirjaintyyppi on tärkein typografinen valinta. Päätteetön fontti esim, Arial, Verdana on luettavampaa näytöltä kuin päätteellinen fontti esim. Times New Roman. Käytä vain muutamaa tyyppiä eli fonttia samassa tuotteessa. Valitse hyvin erilaiset fonttiperheet. Muista, että eri fonteilla on myös todellisten ominaisuuksien lisäksi kuvitteelliset ominaisuudet eli luonteet. Tekstityypillä herätetään myöskin mielikuvia. Toiset fontit on tehty selvästikin pitkiin teksteihin ja toiset vain otsikoihin. Yleisnimitys CSS:sä päätteelliselle fontille on serif ja päätteettömille sans-serif. CSS:n avulla voidaan suunnitella eri fontti paperille kuin ruudulle: @media print { paperille tulevat tyylit } fonttikirjain- leikkaus kokoväri Kirjaintyyppi

12. Kirjaintyypin valinta Kirjaintyyppiä valittaessa kiinnitä huomiota kirjaimen muotoilussa seuraaviin yksityiskohtiin: versaalikorkeuteen eli suuraakkosten korkeuteenTässä kaikkien kirjaimien pistekoko on 36. Yleisin versaalikoko on n. 70% pistekoosta. x-korkeuteen eli pienen x-kirjaimen korkeus suhteessa koko korkeuteen kirjaimen leveyteen

13. päätteisiin viivojen paksunnoksiin, hiusviivan ja perusviivan eroihin silmukan akselin kulmaan

14. Näytölle luettavaksi sopivat parhaiten kirjaimet, joissa on vähän kaaria ja vinoja viivoja, koska kirjaimetmuodostetaan neliön muotoisten pikselien avulla näytölle. on suuri x-korkeus, jolloin saadaan suurempi teksti samalla rivivälillä on suorat kirjainrungot ja silmukoiden akselit on ylä- ja alapidennykset mahdollisimman lyhyitä ei ole päätteitä ArialVerdanaTahoma

15. Kirjaimen koko Jos valitsee tekstin eriosille eri kirjainkoot, niin koko erojen täytyy olla riittävän suuri. Kokovalinnoissa myöskin kuten muussakin suunnittelussa kerrannaiset rauhoittavat. Esimerkiksi kultaisen leikkauksen suhde on toimiva: 3:5:8:13:21. Kultaisen leikkauksen suhde muutettuna pisteiksi: 3:5:8 , 3:8:21 10p –16p – 28p, 10p – 28p – 70p 12p – 20p – 32p, 12p – 28p – 84p 14p – 24p – 36p, 14p – 36p – 98p Jos muutat fonttikokoja, käytä suhteellisia arvoja. Hyvä mittayksikkö on em.

16. Typografisia linkkejä: Kun antiikva fraktuuran seljätti70-vuotinen fonttien sota vaati perääntymisliikkeitäkin http://www.viestintaliitto.fi/kirjatyo/2004/12/muut/#alku1 Kansalliskirjaston julkaisu: Kiehtova kirja Painokirjaimet http://www.lib.helsinki.fi/julkaisut/kiehtovakirja/mainp_typo.html Jere Majava: Verkkojulkaisemisen opas http://blogit.helsinki.fi/web/index.htm Maritta Inkinen: Taittotaidon perusteet http://www.valt.helsinki.fi/staff/mainkine/3typogr.pdf W3C CSS tekstit http://www.w3.org/TR/CSS21/fonts.html http://www.w3.org/TR/CSS21/text.html