Typography and formation of interactive texts in the electronic form

Full text

(1)UNIVERZA V MARIBORU FAKULTETA ZA ELEKTROTEHNIKO, RAČUNALNIŠTVO IN INFORMATIKO. Valerija Podpečan. TIPOGRAFIJA IN OBLIKOVANJE INTERAKTIVNIH BESEDIL V ELEKTRONSKI OBLIKI Diplomsko delo. Maribor, avgust 2016.

(2)

(3) UNIVERZA V MARIBORU FAKULTETA ZA ELEKTROTEHNIKO, RAČUNALNIŠTVO IN INFORMATIKO. Valerija Podpečan. TIPOGRAFIJA IN OBLIKOVANJE INTERAKTIVNIH BESEDIL V ELEKTRONSKI OBLIKI Diplomsko delo. Maribor, avgust 2016.

(4)

(5) TIPOGRAFIJA IN OBLIKOVANJE INTERAKTIVNIH BESEDIL V ELEKTRONSKI OBLIKI Diplomsko delo. Študentka: Študijski program: Smer: Mentor: Somentorica: Lektorica:. Valerija Podpečan univerzitetni študijski program Medijske komunikacije Vizualna komunikacija izr. prof. dr. Matjaž Duh asist. dr. Katja Udir Mišič, dipl. oblik. (un).

(6)

(7) SKLEP.

(8)

(9) ZAHVALA.

(10)

(11) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki Ključne besede: tipografija, grafično oblikovanje, elektronska oblika, interaktivnost, pravila tipografskega oblikovanja.. UDK:. Povzetek V diplomskem delu smo se poglobili v pravila oblikovanja posebne različice besedila, ki služi kot podlaga za končno besedilo z dodanimi elementi interaktivnosti. Oblikovanja besedila smo se lotili predvsem s tipografskega stališča. Po analizi najbolj pomembnih tipografskih pravil smo le ta uporabili tudi v praksi, kar smo v drugem, nekoliko bolj praktičnem delu diplomskega dela, tudi podrobneje razčlenili. Za konec smo rezultate komentirali ter prišli do ugotovitev, da je oblikovanje besedila za potrebe dodajanja interaktivnih elementov in za prikazovanje na raznovrstnih zaslonih elektronske multimedije, posebna veja grafičnega oblikovanja, za katero veljajo nekoliko prilagojena pravila, z dodatkom nekaterih novih, po katerih pred pojavom elektronske interaktivne multimedije ni bilo potrebe.. i.

(12) ii.

(13) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki Key words: typography, design, digital form, interactivity, rules of typographic design.. UDK:. Abstract This diploma thesis deals with the rules of a graphic design, in particular with a text design of a text with added interactive elements. The text design was based mostly on the typographic standpoint. After the analysis of the most important typographic rules, these rules were used in practice and were analyzed in greater details in the second part. Finally, the results were explained and the conclusion was reached that a text design, for the text with interactive elements, is a special branch of graphic design for which some adjusted and some new rules apply.. iii.

(14) iv.

(15) KAZALO 1. UVOD.............................................................................................. 1. 2. OSNOVE TIPOGRAFIJE.............................................................. 4. 3. DRUŽINE PISAV.......................................................................... 17. 4. BARVA STRANI........................................................................... 20. 5. HARMONIJA................................................................................ 26. 6. KONTRAST.................................................................................. 30. 7. HIERARHIJA BESEDILA............................................................ 32. 1.1 Opredelitev in predstavitev problema................................................................ 1 1.2 Namen in cilji diplomskega dela........................................................................ 2 1.3 Struktura diplomskega dela............................................................................... 2. 2.1 Sistem štirih linij................................................................................................. 5 2.2 Anatomija črk..................................................................................................... 6. 4.1 Razmak med besedami................................................................................... 20 4.2 Optimalno število znakov v vrstici.................................................................... 22 4.3 Uporaba enojnega presledka.......................................................................... 23 4.4 Nizi inicialk....................................................................................................... 23 4.5 Urejanje razmaka med nizi številk................................................................... 23 4.6 Urejanje razmaka pri majuskulah.................................................................... 23 4.7 Urejanje razmaka med črkami pri minuskulah................................................. 23 4.8 Povprečno število besed na strani................................................................... 24 4.9 Označevanje premorov................................................................................... 25. 5.1 Velikost pisave................................................................................................. 26 5.2 Uporaba navadnih in renesančnih arabskih številk......................................... 27 5.3 Ligature............................................................................................................ 29 5.4 Različice pisav................................................................................................. 29. 7.1 Naslovna stran................................................................................................. 32 7.2 Označevanje začetkov in nadaljevanj besedila............................................... 32 7.3 Naslovi............................................................................................................. 33 v.

(16) 7.4 Podnaslovi....................................................................................................... 34 7.5 Opombe........................................................................................................... 35 7.6 Tabele.............................................................................................................. 37. 8. OPREDELITEV INTERAKTIVNOSTI......................................... 38. 9. PRAKTIČNI DEL.......................................................................... 42. 10. SKLEP........................................................................................ 49. 11. VIRI.............................................................................................. 51. vi. 9.1 Izbor računalniškega orodja............................................................................ 42 9.2 Izbor besedila.................................................................................................. 43 9.3 Standardne ločljivosti in razmerja digitalnih zaslonov..................................... 43 9.4 Rešitev............................................................................................................. 43 9.5 Proces oblikovanja posameznih različic besedila............................................ 43 9.6 Izbira tipografije............................................................................................... 44.

(17) KAZALO SLIK Slika 2.1: Spodnja, črkovna, srednja in zgornja linija .......................................................... 5 Slika 2.2: Najvišja in najnižja linija ....................................................................................... 6 Slika 2.3: Višina verzalke, višina teles in višina x ................................................................ 6 Slika 2.4: Akcent .................................................................................................................. 7 Slika 2.5: Diagonalna poteza ............................................................................................... 7 Slika 2.6: Dno črke .............................................................................................................. 7 Slika 2.7: Hrbtenica ............................................................................................................. 8 Slika 2.8: Kljun ..................................................................................................................... 8 Slika 2.9: Lok osnovne poteze ............................................................................................ 8 Slika 2.10: Notranji del črke ................................................................................................. 9 Slika 2.11: Obel prehod ....................................................................................................... 9 Slika 2.12: Oko .................................................................................................................... 9 Slika 2.13: Okrogla poteza ................................................................................................ 10 Slika 2.14: Osnova poteza ................................................................................................ 10 Slika 2.15: Peta ................................................................................................................. 10 Slika 2.16: Pika ...................................................................................................................11 Slika 2.17: Podaljšek navzdol .............................................................................................11 Slika 2.18: Podaljšek navzgor ............................................................................................11 Slika 2.19: Prečna poteza ................................................................................................. 12 Slika 2.20: Rama ............................................................................................................... 12 Slika 2.21: Razcep ............................................................................................................ 12 Slika 2.22: Rep .................................................................................................................. 13 Slika 2.23: Serif ................................................................................................................. 13 Slika 2.24: Spodnji krak ..................................................................................................... 13 Slika 2.25: Tanka poteza ................................................................................................... 14 Slika 2.26: Uho .................................................................................................................. 14 Slika 2.27: Vez ................................................................................................................... 14 Slika 2.28: Vrh ................................................................................................................... 15 Slika 2.29: Začetna poteza ................................................................................................ 15 Slika 2.30: Zaključna poteza ............................................................................................. 15 Slika 2.31: Zanka ............................................................................................................... 16 Slika 2.32: Zgornji krak ...................................................................................................... 16 Slika 3.1: Hierarhična struktura znotraj velike družine pisave ........................................... 17 Slika 3.2: Sorodstvene vezi znotraj velike družine pisave ................................................. 18 ix.

(18) Slika 4.1: Razmerje med pajko in piko .............................................................................. 20 Slika 4.2: Primer obojestransko poravnanega besedila, pri katerem je razmak med besedami premajhen.......................................................................................................... 21 Slika 4.3: Primer obojestransko poravnanega besedila, pri katerem je razmak med besedami prevelik.............................................................................................................. 21 Slika 4.4: Primer obojestransko poravnanega besedila, pri katerem je razmak med besedami ravno pravšnji.................................................................................................... 22 Slika 5.1: Lestvica najpogosteje uporabljanih velikosti pisav ............................................ 26 Slika 5.2: Seznam imen največkrat uporabljanih velikosti pisav ....................................... 27 Slika 5.3: Uporaba renesančnih in navadnih arabskih številk............................................ 28 Slika 5.4: Pravilna uporaba rimskih številk med besedilom................................................ 28 Slika 5.5: Primeri ligatur...................................................................................................... 29 Slika 6.1: Pravilna raba večje širine reza za namene poudarjanja..................................... 30 Slika 6.2: Pravilna raba kurzive za namene poudarjanja................................................... 30 Slika 6.3: Pravilna raba kapitelk za namene poudarjanja................................................... 31 Slika 7.4: Primer hierarhične lestvice podnaslovov............................................................ 34 Slika 7.5: Zaporedje simbolov za označevanje opomb...................................................... 36 Slika 7.6: Označevanje opomb........................................................................................... 36 Slika 9.1: Računalniški program Adobe Indesign CC 2015................................................ 42 Slika 9.2: Font Helvetica Neue Black Condensed.............................................................. 44 Slika 9.3: Font Helvetica Neue Medium Condensed.......................................................... 45 Slika 9.4: Arno Pro Semibold Italic..................................................................................... 45 Slika 9.5: Font Arno Pro Regular........................................................................................ 45 Slika 9.X: Font Arno Pro Italic............................................................................................. 46. x.

(19)

(20)

(21) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. 1. UVOD 1.1 Opredelitev in predstavitev problema. Interaktivni multimedija, ki jo predstavljajo osebni in prenosni računalniki, tablični računalniki, pametni televizorji in pametni mobilni telefoni, grafičnim oblikovalcem ponuja obilo priložnosti in načinov, da besedila in druge grafične elemente oblikujejo na način, ki bralcu omogoči enostavno navigacijo po besedilu. Prav tako jim ponuja možnost, da bralca dodatno pritegnejo in njegovo pozornost učinkovito usmerijo v določene dele besedila, saj bralec, zaradi možnosti interakcije z besedilom, dobi občutek, da z njim lahko manipulira in se sam odloča o tem, kaj bo prebral zdaj, kaj pozneje in s čim bo branje nadaljeval. Skupaj z obilico priložnosti, ki se grafičnim oblikovalcem ponujajo, pridejo tudi izzivi, kako te priložnosti izkoristiti. Glede na starost medijev, ki ne ponujajo interakcije, je interaktivna multimedija zelo mlada. To, kar so grafični oblikovalci skozi stoletja dosegli s strpnim in preciznim izpopolnjevanjem veščin in tehnik, morajo sodobni grafični oblikovalci za potrebe interaktivne multimedije prilagoditi in izpopolniti v bistveno krajšem časovnem obdobju, da dosežejo isto mero berljivosti in logične urejenosti besedila. Čeprav velika večina načel in pravil oblikovanja s stališča tipografije ostaja ista, je potrebno uvesti nekatera nova pravila, po katerih pred pojavom interaktivne multimedije ni bilo potrebe. Izraz multimedija običajno označuje medije, katerih sporočilo poslušalec, gledalec ali bralec prejme preko različnih kanalov, predvsem vidnih in slišnih. Multimedija tako označuje kombinacijo zvoka, fotografij, gibljivih slik oziroma videa in besedila. Izraz interaktivnost v tem primeru označuje lastnost medija, ki poslušalcu, gledalcu ali bralcu nudi možnost vpliva na potek podajanja podatkov in informacij ali na možnost vpliva na končno obliko sporočila [18]. Kot pomoč pri razmisleku o tem, kaj pomeni izraz interaktivnost, je smotrno razmisliti tudi o medijih, ki ne ponujajo interaktivnosti. Taki mediji so na primer fotografije, slike, filmi, knjige in glasbena dela. Kritiki interaktivnih medijev radi izpostavijo idejo, da našteti mediji vendarle niso povsem ne interaktivni. Čeprav je njihova oblika resda fiksna, je lahko samo dejanje uporabe medija zelo interaktivno. Poslušalci, gledalci in bralci lahko tekom spremljanja medija nezavedno izvršijo dejanja, ki na koncu vplivajo na doživljanje izkušnje kot celote.. 1.

(22) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. Na primer: gledalec, ki gleda film, konstantno prilagaja svoj nivo pozornosti, notranjih referenc, identifikacije, čustvenih odzivov in pripravljenosti vključevanja osebnih izkušenj, ki temeljijo na socialnem in etničnem položaju ter spolu [18]. Uspešne vrste medija, ki od poslušalca, gledalca ali bralca ne bi zahteval visoke mere interaktivnosti, ni [18]. Kljub temu med interaktivnimi mediji in mediji, ki kot taki niso interaktivni, obstaja nekaj poglavitnih razlik. Pri interaktivnih medijih sta prilagajanje oziroma možnost izbire obvezna; sporočilo je strukturirano na način, ki od uporabnika zahteva določeno mero vpletenosti. Poudarek je na nelinearnosti sporočila; tam kjer je to možno, je priporočeno zaporedje sporočila izpuščeno. Proces izbire je konkretiziran na tak način, da so uporabnikova dejanja očitna. Razvijalci interaktivne multimedije in oblikovalci interaktivnih multimedijskih vsebin morajo posebno mero pozornosti posvečati temu, da jih vključitev koncepta proste izbire s strani uporabnika ne zavede. Možnost proste izbire s strani uporabnika še ne pomeni, da bo ta, zaradi tega, sporočilu posvetil več pozornosti kot običajno. Ravno nasprotno; možnost proste izbire, v določenih primerih, lahko za uporabnika predstavlja motnjo, saj zmoti njegovo pozornost in prekine določene čustvene procese.. 1.2 Namen in cilji diplomskega dela Cilj diplomskega dela je skrbna navedba najpomembnejših načel in pravil tipografije, podroben opis le-teh ter njihova uporaba na praktičnem primeru. Naše diplomsko delo je jedrnat pregled nad celotnim postopkom oblikovanja, ki se zaključi z izdelkom. Naš namen je opozoriti na aspekte pravilnega grafičnega oblikovanja, predvsem s stališča tipografije.. 1.3 Struktura diplomskega dela Diplomsko delo smo razdelili na dva ključna dela. V prvem delu smo predstavili teoretična izhodišča, v sklopu katerih smo navedli najpomembnejša načela in pravila tipografije ter jih podrobneje opisali.. 2.

(23) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. V drugem delu, ki temelji na praktičnem delu, smo pripravili primer besedila, ki smo ga oblikovali na podlagi teoretičnih načel in pravil iz prvega dela diplomskega dela. Prav tako smo v tem delu podrobneje argumentirali naše odločitve. Za konec smo dodali še zaključni komentar in kratek sklep, v katerem smo dokončno umestili naša opažanja, odločitve in ugotovitve, ki se navezujejo na drugi del diplomskega dela.. 3.

(24) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. 2. OSNOVE TIPOGRAFIJE. Osnovni izziv grafičnega oblikovanja je postavitev črk, številk in drugih tipografskih znakov na prazen zaslon. Katero družino pisav uporabiti? Katero različico pisave izbrati? Kakšna naj bo velikost pisave? Kakšna naj bo barva pisave? Kako naj bodo črke, besede in odstavki poravnani, urejeni, kakšen naj bo razmak med njimi? To je le nekaj najbolj osnovnih vprašanj, na katera je v procesu grafičnega oblikovanja potrebno poiskati najboljši odgovor. Možnih odgovorov je več; nekateri so odlični, drugi so dobri, spet tretji so zanič. Da lahko na katero izmed zastavljenih vprašanj podamo odgovor, je potrebno poznavanje osnovnih pojmov in pravil tipografije ter tega, kaj tipografija sploh je. Tipografija je umetnost. Hkrati je tudi tehnika urejanja črk, številk in drugih tipografskih znakov na tak način, da pisani jezik postane čitljiv, berljiv in privlačen na pogled. Tehnika urejanja vključuje izbiro družine pisav, izbiro različice pisave iz izbrane družine pisav, izbiro velikosti, izbiro dolžine vrstice, prirejanje razmaka med vrsticami, prirejanje razmaka med besedami in prirejanje razmaka med posameznimi črkami, številkami in drugimi tipografskimi znaki [2]. Termin tipografija pogosto enačimo tudi s končnim rezultatom grafičnega oblikovanja; to je s stilom, postavitvijo in izgledom črk, številk in drugih tipografskih znakov, ki so nastali v procesu. Oblikovanje pisav je zelo sorodna obrt, ki jo pogosto smatramo kot del tipografije. Večina stavcev sicer ne oblikuje pisav, prav tako se grafični oblikovalci, ki oblikujejo pisave zelo redko identificirajo kot stavci. Tipografija kot taka ima lahko tudi povsem dekorativno vlogo, brez komunikacijske vrednosti. Služi lahko kot dopolnilo k dekoraciji ali kot samostojna dekoracija [2]. V nadaljevanju bomo pozornost posvetili definicijam nekaterih najbolj osnovnih pojmov na področju tipografije, ki bi jih moral poznati vsak grafični oblikovalec, za tem pa sledijo nanizana in podrobneje opisana pravila tipografije, ki jih je potrebno upoštevati, da lahko premagamo izzive na področju grafičnega oblikovanja.. 4.

(25) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. 2.1 Sistem štirih linij Osnova vsake pisave je sistem štirih linij. Tvorijo spodaj naštete osnovne linije: – spodnja linija (angleško descender line), ki predstavlja spodnjo mejo celotne črkovne podobe in sega v spodnji črkovni pas (zgornji levi del slike 2.1), – črkovna linija (angleško baseline), ki predstavlja spodnjo mejo glavne mase črkovne podobe brez podaljškov navzdol (zgornji desni del slike 2.1), – srednja linija (angleško mean line), ki predstavlja zgornjo mejo glavne mase črkovne podobe brez podaljškov navzgor (spodnji levi del slike 2.1) in – zgornja linija (angleško ascender line), ki predstavlja zgornjo mejo celotne črkovne podobe in sega v zgornji črkovni pas (spodnji desni del slike 2.1) [5, 6].. Slika 2.1: Spodnja, črkovna, srednja in zgornja linija [7].. Poleg štirih osnovnih linij poznamo še dve dodatni liniji: – najvišjo linijo (angleško ascent line), ki označuje največjo razdaljo med višino najvišjega glifa in črkovno linijo, gledano od črkovne linije navzgor (levi del slike 2.2) in – najnižjo linijo (angleško descent line), ki označuje največjo razdaljo med višino najvišjega glifa in črkovno linijo, gledano od črkovne linije navzdol (desni del slike 2.2) [7].. 5.

(26) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. Slika 2.2: Najvišja in najnižja linija [7].. Prav tako poznamo še tri različne višine, ki jih imenujemo: – višina verzalke (angleško cap height), ki označuje višino verzalke merjeno od črkovne linije navzgor (levi del slike 2.3), – višina teles (angleško body height), ki označuje celotno višino vseh znakov znotraj ene pisave (osrednji del slike 2.3) in – višina x (angleško x-height), ki označuje višino minuskul, na podlagi višine minuskule x. Višina x je razdalja med črkovno linijo in vrhom minuskul, neupoštevajoč podaljške navzgor oziroma podaljške navzdol (desni del slike 2.3) [7].. Slika 2.3: Višina verzalke, višina teles in višina x [7].. 2.2 Anatomija črk Za konec poglavja, ki nam bo v veliko pomoč pri razumevanju našega zaključka diplomskega dela, si podrobneje oglejmo še anatomijo črk. V anatomijo številk in drugih tipografskih znakov se podrobneje nismo poglabljali, saj le ti na naš zastavljen problem nimajo bistvenega vpliva. Za lažjo navigacijo, so pojmi, ki sledijo, nanizani in obrazloženi po abecednem vrstnem redu [6, 13].. 6.

(27) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. – Akcent (angleško accent) je znamenje za naglas, ki se navadno nahaja nad črko. Lahko se nahaja tudi pod njo oziroma kjer koli okoli črkovnega znaka, izjemoma pa tudi čezenj (slika 2.4).. Slika 2.4: Akcent [7].. – Diagonalna poteza (angleško diagonal stroke) je nagnjena osnovna poteza črke (slika 2.5).. Slika 2.5: Diagonalna poteza [7].. – Dno črke (angleško vertex) je spodnji del črkovne podobe, ki pogosto sega preko črkovne črte (slika 2.6).. Slika 2.6: Dno črke [7].. 7.

(28) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. – Hrbtenica (angleško spine) je osredji del črk s, S, š in Š. Pri pisavah s tankimi in podebeljenimi potezami, je ta poteza podebeljena (slika 2.7).. Slika 2.7: Hrbtenica [7].. – Kljun (angleško beak) je posebna oblika serifa, podobna ptičjemu kljunu, značilna za zaključek prečne črte (slika 2.8).. Slika 2.8: Kljun [7].. – Lok osnovne poteze (angleško arc of stem) je zaobljena poteza črke, ki izhaja iz ravne osnovne poteze črke (slika 2.9).. Slika 2.9: Lok osnovne poteze [7].. 8.

(29) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. – Notranji del črke (angleško counter) je zaprta, delno odprta ali odprta notranjost podobe črke (slika 2.10).. Slika 2.10: Notranji del črke [7].. – Obel prehod (angleško bracket), ki tvori obli serif, je značilna obla poteza med serifom in osnovno potezo črke (slika 2.11).. Slika 2.11: Obel prehod [7].. – Oko (angleško eye) je notranjost minuskule e (slika 2.12).. Slika 2.12: Oko [7].. 9.

(30) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. – Okrogla poteza (angleško bowl) je zaprta ali samo delno zaprta okrogla oziroma ovalna poteza (slika 2.13).. Slika 2.13: Okrogla poteza [7].. – Osnovna poteza (angleško stem) je glavna poteza črkovne podobe. Pri nekaterih črkah je navpična, pri nekaterih je vodoravna, pri nekaterih pa tudi poševna (slika 2.14).. Slika 2.14: Osnova poteza [7].. – Peta (angleško spur) je dodatna poteza pri nekaterih vrstah pisav, značilna za majuskulo G (slika 2.15).. Slika 2.15: Peta [7].. 10.

(31) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. – Pika (angleško dot) je poseben akcent v obliki majhnega kroga, ki se nahaja nad osnovno potezo črke (slika 2.16).. Slika 2.16: Pika [7].. – Podaljšek navzdol (angleško descender) je del črkovne podobe, ki sega pod črkovno linijo, v spodnji črkovni pas (slika 2.17).. Slika 2.17: Podaljšek navzdol [7].. – Podaljšek navzgor (angleško ascender) je del črkovne podobe, ki sega čez srednjo linijo, v zgornji črkovni pas (slika 2.18).. Slika 2.18: Podaljšek navzgor [7].. 11.

(32) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. – Prečna poteza (angleško crossbar) je poteza črke, ki je na obeh straneh omejena z drugima potezama (slika 2.19).. Slika 2.19: Prečna poteza [7].. – Rama (angleško shoulder) je zaobljena poteza, ki se namesto v okroglo, nadaljuje v ravno potezo (slika 2.20).. Slika 2.20: Rama [7].. – Razcep (angleško crotch) tvori notranji ostri kot, v katerem se srečata dve ravni potezi črke (slika 2.21).. Slika 2.21: Razcep [7].. 12.

(33) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. – Rep (angleško tail) je značilna poteza v spodnjem delu majuskule Q (slika 2.22).. Slika 2.22: Rep [7].. – Serif (angleško serif) je nastavek pri potezi črke. Različne vrste pisav imajo različno oblikovane serife. Tako ločimo: obli serif, oglati serif, trikotni serif, tanek serif, serif ostrega prehoda, zaobljen serif in kljunast serif (slika 2.23).. Slika 2.23: Serif [7].. – Spodnji krak (angleško leg) je poševna poteza, ki poteka od zgoraj navzdol in je spodaj prosta (slika 2.24).. Slika 2.24: Spodnji krak [7].. 13.

(34) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. – Tanka poteza (angleško hairline) je značilna predvsem za serifne pisave s kombinacijo tankih in podebejenih potez (slika 2.25).. Slika 2.25: Tanka poteza [7].. – Uho (angleško ear) je manjši dodatek pri okrogli potezi, ki ga ima minuskula g, pri nekaterih vrstah pisav (slika 2.26).. Slika 2.26: Uho [7].. – Vez (angleško link) je navadno krajša poteza, ki povezuje dve potezi oziroma dva dela črke. Pri minuskuli g vez povezuje okroglo potezo in zanko (slika 2.27).. Slika 2.27: Vez [7].. 14.

(35) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. – Vrh (angleško apex) je zgornji del črkovne podobe, ki pri nekaterih pisavah sega preko črte verzalke (slika 2.28).. Slika 2.28: Vrh [7].. – Začetna poteza (angleško terminal) je prva poteza črke. Lahko je v obliki kaplje oziroma kroga (slika 2.29).. Slika 2.29: Začetna poteza [7].. – Zaključna poteza (angleško finial) je končna poteza črke, ki je pri različnih pisavah različna. Pri pisavah s tankimi in podebeljenimi potezami je zaključna poteza vedno tanka (slika 2.30).. Slika 2.30: Zaključna poteza [7].. 15.

(36) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. – Zanka (angleško loop) je spodnji del minuskule g. Značilna je samo za nekatere vrste pisav (slika 2.31).. Slika 2.31: Zanka [7].. – Zgornji krak (angleško arm) je poševna poteza, ki je poteka od spodaj navzgor in je zgoraj prosta (slika 2.32).. Slika 2.32: Zgornji krak [7].. 16.

(37) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. 3. DRUŽINE PISAV. Font (angleško font ali typeface) je računalniški zapis nabora vseh črkovnih in nečrkovnih znakov ene različice pisave, kakor tudi določene velikosti različice pisave. Pred dobo digitalizacije je pojem font označeval vse svinčene črkovne in nečrkovne znake ene različice pisave in ene velikosti. Na drugi strani pa je vrsta pisave, pogosto imenovana tudi družina pisav, skupina vseh različic pisave enega imena [17].. 1. raven: 2. raven:. 3. raven:. 4. raven:. 5. raven:. 6. raven:. roman lower case Roman Upper Case roman small caps roman text figures: 1 2 3 italic lower case True Italic (Cursive) Upper Case & Swash italic text figures: 123 sloped small caps Roman Titling Figures: 1 2 3 bold lower case False Italic (Sloped) Upper Case Bold Upper Case bold small caps bold text figures: 1 2 3 bold italic lower case Italic Titling Figures: 1 2 3 Bold False Italic (Sloped) Upper Case bold italic text figures: 1 2 3 Bold Titling Figures: 1 2 3 Bold Italic Titling Figures: 1 2 3. Slika 3.1: Hierarhična struktura znotraj velike družine pisave [1].. 17.

(38) 18. BOLD CAPS. bold lower case. small caps. Slika 3.2: Sorodstvene vezi znotraj velike družine pisave [1]. BOLD SLOPED CAPS. bold italic lower case. FULL CAPS. roman lower case. italic lower case. SWASH CAPS & SLOPED CAPS. small caps. sloped. Tipografija in oblikovanje interaktivnih besedil v elektronski obliki.

(39) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. Kot v vsaki družini, tudi v družini pisav obstajata določena hierarhija in splet sorodstvenih vezi. Ker slovenski jezik ne pozna vseh prevodov za angleške izraze, smo grafiki, ki jih prikazujeta slika 3.1 in slika 3.2 opremili z angleškimi izrazi za različice pisav. Slika 3.2 prikazuje sorodstvene vezi znotraj dobro členjene velike družine pisave. Vezi, označene z odebeljeno črto, predstavljajo nuklearno družino znotraj veliko večje, razširjene družine. Poleg prikaza sorodstvenih vezi grafika služi kot neke vrste pravilnik; tipograf sme od enega fonta do drugega prehajati le, v kolikor med njima obstaja sorodstvena vez. V kolikor sorodstvena vez ne obstaja, vendar se tipograf vseeno odloči za prehod na drug font, se lahko zgodi, da pride do “kratkega stika”, ki ruši konvencije tipografske slovnice.. 19.

(40) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. 4 BARVA STRANI Predpogoj za kvalitetno oblikovanje besedila, naj bo to interaktivno ali ne, je poznavanje osnovnih teoretičnih načel in pravil tipografije. Prvo izmed teh osnovnih načel je načelo barve. Gostoto teksture pisane ali tiskane strani imenujemo barva. S tem ne mislimo na barvo besedila kot na njegovo fizikalno lastnost, temveč na temnost mase, ki jo tvorijo oblike črk, številk in ostalih tipografskih znakov [10]. Pravila, ki so našteta in opisana v nadaljevanju tega poglavja, določajo optimalno barvo strani.. 4.1 Razmak med besedami Po anglosaškem merskem sistemu je osnova enota vertikalne razdalje oziroma višine pajka, ki meri 4,218 mm. Pajka je razdeljena na 12 pik; vsaka pika meri 0,351 mm [17]. Razmerje med pajko in piko prikazuje slika 4.1.. Slika 4.1: Razmerje med pajko in piko [17]. 20.

(41) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. Horizontalno razdaljo oziroma širino namesto v pajkah in pikah merimo v enoti imenovani em. Dolžina enote em je enaka velikosti pisave. V kolikor je velikost pisave 12 pik (velikost pisave predstavlja razdalja med spodnjo in zgornjo linijo), je dolžina enote em enaka 12 pikam. Poleg enote em poznamo tudi enoto en, ki je enaka polovici enote em [17]. Za pisavo standardne velikosti (govorimo o pisavah katerih velikost je med 8 in 14 pikami) je običajna vrednost razmaka med besedami enaka četrtini enote em, kar smemo zapisati kot m/4. Pri obojestranski poravnavi besedila je zaželeno, da razmak med besedami ni manjši od petine enote em (m/5) in večji od polovice enote em (m/2); stremimo k temu, da je razmak med besedami enak četrtini enote em (m/4) [1].. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque finibus neque ante, cursus condimentum nibh varius non. In porttitor elementum dictum. Duis quis nisi est. Donec non dui ac est suscipit faucibus quis sit amet tortor. Sed ante tellus, semper nec dignissim sit amet, rutrum sit amet justo. Proin consequat lorem sit amet lectus fringilla, ullamcorper posuere ligula gravida. Praesent venenatis tortor sit amet varius blandit.. Slika 4.2: Primer obojestransko poravnanega besedila, pri katerem je razmak med besedami premajhen.. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque finibus neque ante, cursus condimentum nibh varius non. In porttitor elementum dictum. Duis quis nisi est. Donec non dui ac est suscipit faucibus quis sit amet tortor. Sed ante tellus, semper nec dignissim sit amet, rutrum sit amet justo. Proin consequat lorem sit amet lectus fringilla, ullamcorper posuere ligula gravida. Praesent venenatis tortor sit amet varius blandit.. Slika 4.3: Primer obojestransko poravnanega besedila, pri katerem je razmak med besedami prevelik.. 21.

(42) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque finibus neque ante, cursus condimentum nibh varius non. In porttitor elementum dictum. Duis quis nisi est. Donec non dui ac est suscipit faucibus quis sit amet tortor. Sed ante tellus, semper nec dignissim sit amet, rutrum sit amet justo. Proin consequat lorem sit amet lectus fringilla, ullamcorper posuere ligula gravida. Praesent venenatis tortor sit amet varius blandit.. Slika 4.4: Primer obojestransko poravnanega besedila, pri katerem je razmak med besedami ravno pravšnji.. V primeru, da imamo opravka s pisavo, ki ima bolj ohlapno razporejene znake, razmak med besedami ne sme biti manjši od četrtine enote em (m/4), povprečje h kateremu stremimo, pa je tretjina enote em (m/3) [1]. V primeru, da je besedilo sestavljeno iz samih majuskul, se lahko zgodi, da bo razmak med besedami enak ali celo večji od polovice enote em (m/2) [1]. Z izrazom majuskula označujemo veliko tiskano črko, ki obsega srednji in zgornji črkovni pas, izjemoma tudi spodnji črkovni pas. Pogosto namesto izraza majuskula uporabljamo tudi izraz verzalka [17].. 4.2 Optimalno število znakov v vrstici Na strani z enim samim stolpcem besedila, kot zadovoljivo dolžino vrstice, smatramo od 45 do 75 znakov. Idealna dolžina vrstice je 66 znakov, upoštevajoč tako črke in številke, kot ostale znake, vključno s presledki. Na strani z dvema ali več stolpci, kot zadovoljivo dolžino vrstice, smatramo od 40 do 50 znakov. V kolikor je stran skrbno urejena, lahko število znakov v vrstici seže vse do 90 znakov in hkrati ne predstavlja ovire pri branju. Govorimo o besedilih s pogostimi prekinitvami oziroma o opombah v glavi ali nogi strani [1]. Pri obojestranski poravnani je zaželeno, da število znakov v vrstici ne pade pod 40 [1]. V kolikor se to vseeno zgodi, se na strani lahko pojavijo bele lise, ki so posledica neenakomernih razmikov med besedami in oziroma ali prekomernega števila deljenih besed. Manjše število znakov je sprejemljivo le v opombah ob robu strani. Takrat lahko število znakov pade tudi pod 15 znakov na vrstico [10]. 22.

(43) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. 4.3 Uporaba enojnega presledka V 19. stoletju je bila uporaba dvojnega presledka med povedmi zaželena. V 20. stoletju se je trend nadaljeval, vendar počasi izgubljal na svoji moči. Tako je v zadnjih nekaj desetletjih uporaba dvojnega presledka postala nezaželena, domala prepovedana. Za vsako piko, vejico ali katerim drugim ločilom se tako uporablja samo en presledek [1].. 4.4 Nizi inicialk Imena kot so W.B. Yeats in J.C.L. Prillwitz potrebujejo zelo malo oziroma nič razmika med vmesnimi pikami. Normalen presledek sledi šele zadnji piki v nizu. Akronimi, kot so na primer cia in fbi, so, prav tako kot nekatere druge okrajšave, v določenih besedilih zelo pogosti. Običajna vrednost razmaka med črkami v takih zaporedjih je od 5 do 10 odstotkov vrednosti velikosti pisave. Če računalniški program enoto em interpretira kot 1000 PostScript enot, potem to pomeni od 50 do 100 enot razmaka med črkami [1].. 4.5 Urejanje razmaka med nizi številk Veliko stavcev ureja razmak med znaki pri nizih številk, v kolikor so ti nizi daljši in neprekinjeni. Številkam, ki so postavljene v pare, ni potrebno posebej urejati razmaka. Nizi treh ali več številk, pa običajno potrebujejo nekoliko večji razmak med številkami [10].. 4.6 Urejanje razmaka pri majuskulah V naslovih in podnaslovih je zaželeno, da je razmak med črkami nekoliko večji. Prav tako obojestransko poravnane vrstice majuskul običajno uredimo tako, da je razmak med črkami enak petini oziroma četrtini enote em (m/4 oziroma m/5). To predstavlja razmak med črkami, ki je enak četrtini oziroma petini velikosti pisave [1].. 4.7 Urejanje razmaka med črkami pri minuskulah V splošnem velja pravilo, da minuskule ne potrebujejo dodatnega razmaka med znaki. Obstajajo pa izjeme. Te izjeme se pojavijo takrat, kadar je potrebno dodati razmak med črkami zato, da je besedilo lažje berljivo.. 23.

(44) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. Nedoslednosti pri ujemanju nekaterih parov črk so neizogibne. Prirezovanje (angleško kerning) je proces izenačevanja beline z zmanjševanjem ali povečevanjem prostorov med parom črk, s katerim lahko te nedoslednosti učinkovito odpravimo. V digitalni dobi imajo pisave običajno že vgrajene prirezovalne tabele (angleško kerning table), s pomočjo katerih računalniški program samodejno prilagodi razmak med problematičnimi pari črk. Oblikovanje pisav je umetnost, ki jo prakticira zelo malo ljudi; še manj ljudi pa jo obvlada. Sodobni računalniški programi za izdelavo in obdelavo besedil tudi laikom omogočajo, da posegajo v obliko črk in znakov, ki jim je umetnik posvetil leta študij, inspiracije, koncentracije in veščin. Moč, ki nam jo tovrstni programi ponujajo, je potrebno uporabljati zelo previdno. V kolikor je le mogoče, naj se širina in oblika znakov ne spreminjata. S spreminjanjem širine in oblike znakov namreč lahko hitro porušimo razmerja, ki so bila skrbno izbrana. Z uničenjem razmerij uničimo harmonijo in tok pisave. Seznami, kot so kazala in recepti, so priložnosti, da elemente med sabo ločimo in obenem povežemo. Dva najpogostejša načina, kako tako priložnost zapravimo, je s poravnavo prvega elementa skrajno levo in s poravnavo drugega elementa skrajno desno, glede na stran, oziroma z uporabo pik, ki vodijo od enega do drugega elementa, preko cele strani.. 4.8 Povprečno število besed na strani Posamezna stran večine knjig nosi od 30 do 45 vrstic. Povprečna dolžina vrstice znaša od 60 do 66 znakov. Upoštevajoč, da je povprečna dolžina besede 5 znakov (6, če dodamo še presledek na koncu vsake besede), potem eno vrstico v povprečju tvori od 10 do 11 besed. Polna stran besedila posledično šteje od 300 do 500 besed [1]. Tudi pri izbiri števila besed na strani, obstajajo izjeme. Če si besedilo zasluži to čast, lahko stran s 17 vrsticami in 36 znaki v vsaki vrstici nosi le 100 besed. Na drugi strani, lahko stran s 45 vrsticami in 70 znaki v vsaki vrstici nosi tudi več kot 520 besed. Občasno se pojavi potreba po tem, da stran nosi 750 ali celo 1000 besed. Da berljivost take strani ni potisnjena na stranski tir, se je najbolje zateči k uporabi večjega stolpcev besedila, najpogosteje dveh [1]. Ne glede na to, kako prazna ali polna mora biti stran, naj le ta kljub vsemu diha. Daljša, ko je vrstica, večji mora biti razmak med posameznimi vrsticami. To pojasni, zakaj lahko stran z dvema stolpcema nosi večje število vrstic in s tem besed, od strani z enim stolpcem; razmak med vrsticami je pri strani z dvema stolpcema lahko bistveno manjši, kot pri strani z enim stolpcem [5].. 24.

(45) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. 4.9 Označevanje premorov Premor najpogosteje označujemo z zamikanjem prve vrstice v odstavku v notranjost strani. V kolikor odstavek sledi naslovu ali podnaslovu, je zamik odvečen, zato ga izpustimo. Pri urejanju daljših besedil je zaželeno, da prve vrstice vseh odstavkov, razen prvega, zamaknemo vsaj za eno enoto en v desno. Občasno lahko prazen prostor zamika nadomestimo z okraskom; je pa odstotek besedil, ki bi na ta način karkoli pridobila na berljivosti, zelo majhen. Sicer bolj poredko, pa vendarle, je moč zaslediti tudi uporabo ornamentov in drugih posebnih znakov, da odstavke ločimo znotraj vrstice. Čeprav so rezultati tovrstnega početja lahko presenetljivi pri posebej dolgih in le redko členjenih besedilih, je kljub temu potrebno upoštevati dejstvo, da tovrstno ločevanje odstavkov lahko privede do obilice dela in večjih stroškov ob morebitnih popravkih in drugih spremembah [1]. Poleg prve navedene metode, je druga najpogosteje uporabljena metoda ta, pri kateri prvo vrstico namesto v desno, zamaknemo v levo smer, v levi rob strani. To nam odpre priložnost, da uporabimo povečano (ali okrašeno) začetno črko ali črke v prvi besedi prve vrstice posameznega odstavka. Najbolj pogosta velikost zamika je ena enota em. Druga najpogostejša velikost zamika je enaka velikosti razmika med posameznimi vrsticami v odstavku. Če imamo velikost besedila 11/13, potem lahko zamik meri bodisi 11 pik, torej eno enoto em ali 13 pik, torej velikost razmika med posameznimi vrsticami v odstavku. Absolutni minimum zamika je polovica enote em ali na kratko, enota en. Kadar je vrstica dolga, robovi ob stolpcu pa obilni, je bolj primeren zamik velikosti 3/2 enote em ali 2 enoti em. Ne glede na dolžino vrstice, je kontra produktivno uporabiti zamik, ki je večji od 3 enot em, saj le ta lahko povzroči razcefranost strani [1].. 25.

(46) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. 5. HARMONIJA. S pojmom harmonija označujemo ubranost, skladnost elementov. V tipografiji na harmonijo v glavnem vplivajo velikost pisave, oblika oziroma različica pisave, oblika oziroma različica številk ter ligature.. 5.1 Velikost pisave Zgodnji renesančni stavci so za oblikovanje posamezne knjige pogosto uporabili en sam font; celotna knjiga je bila zapisana v enotni velikosti ene od različic črk določene vrste pisave. Kot dopolnilo temu so služile velike, unikatne in ročno oblikovane inicialke, ki so označevale začetek novega poglavja. Knjige iz obdobja zgodnje renesanse služijo kot odličen primer doseganja čutne enakosti teksture in pestrosti ritma, z uporabo enega samega fonta [4]. V 16. stoletju se je med evropskimi stavci izoblikovala lestvica pogosto uporabljanih velikosti pisav, ki je z nekaj manjšimi spremembami in dopolnili z lahkoto preživela nadaljnjih 400 let in je v uporabi še danes (slika 5.1) [1].. 6. 7. 8. 9. 10. 11. 12. 14. 16. 18. 21. 24. 36. 48. 60. 72. Slika 5.1: Lestvica najpogosteje uporabljanih velikosti pisav [1].. Sprva so stavci za poimenovanje velikost pisave omenjene lestvice namesto številčne oznake uporabljali posebna imena (slika 5.2) [1], [17].. 26.

(47) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. 3 pike 4 pike 5 pik 6 pik 7 pik 8 pik 9 pik 10 pik 11 pik 12 pik 14 pik 18 pik 20 pik. briljant (minikin) diamant (diamond) perl (pearl) nonparej (nonpareil) kolonel (minion) petit (brevier) borgis (bourgeois ali galliard) garmond (long primer ali garamond) mala pajka (small pica ali philosophy) pajka (pica) medija (english ali augustin) tercija (great primer) tekst (paragon). Slika 5.2: Seznam imen največkrat uporabljanih velikosti pisav [1].. Podroben pogled in poznavanje glasbenih voda razkrijeta, da je lestvica velikost pisav pravzaprav ekvivalent diatonični lestvici; diatonična lestvica je lestvica, ki ima v svojem obsegu oktave cele tone in poltone. Čeprav sodobni računalniški programi grafičnim oblikovalcem in stavcem omogočajo uporabo poljubnih velikost pisav, je bolj smiselno uporabljati že uveljavljeno in preverjeno lestvico. Razlog za to je ohranitev razmerij in harmonije, ki jih lahko neizkušen grafični oblikovalec, z nepotrebnim eksperimentiranjem, poruši.. 5.2 Uporaba navadnih in renesančnih arabskih številk Pri uporabni navadnih in renesančnih arabskih številk veljata pravili, da se navadne arabske številke uporabljajo v primeru, ko je preostanek besedila zapisan s samimi majuskulami, in da se renesančne arabske številke uporabljajo v vseh ostalih primerih (slika 5.3) [1].. 27.

(48) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. Datum je 11. april 1992; ura je 21:30. V apartmaju 7-a je prijetnih 25°c. Cena nočitve je 59,99€. 2. SVETOVNA VOJNA SE JE KONČALA 2. SEPTEMBRA 1945.. Slika 5.3: Uporaba renesančnih in navadnih arabskih številk.. Arabske številke (v arabskem svetu poznane kot indijske številke, saj so jih Arabci prevzeli od Indijcev) so v uporabo na evropskem ozemlju prešle šele v 13. stoletju. Pred tem so bile v uporabi rimske številke, ki so jih pisarji zapisovali z majuskulami, kadar je preostanek besedila bil zapisan z majuskulami in z minuskulami, kadar je preostanek besedila bil zapisan z minuskulami (slika 5.4). Stavci so to navado, zaradi lepšega ujemanja rimskih številk z ostalim besedilom, prevzeli in je v uporabi še danes [1].. Število xiv zapisano najprej v minuskulah, ŠTEVILO XIV ZAPISANO V MAJUSKULAH, število xiv zapisano še v kapitelkah in za konec še enkrat število xiv v kurzivi.. Slika 5.4: Pravilna uporaba rimskih številk med besedilom.. Ko so se arabske številke pridružile evropskim abecedam, so tudi same dobile dve različici; različico za male tiskane črke in različico za velike tiskane črke. Prvo različico imenujemo renesančne arabske številke, drugo različico pa navadne arabske številke [1].. 28.

(49) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. 5.3 Ligature Pri določenih parih in trojicah zaporednih črk ali znakov, nekateri znaki segajo v prostor sosednjih znakov, kar posledično vodi do neželenega prekrivanja in zmanjšanja berljivosti besedila. V ta namen so stavci razvili posebne znake, imenovane ligature (slika 5.5). Ligatura je znak, ki problematične pare in trojice črk ali znakov nadomesti z alternativno obliko črk in znakov, v kateri se le ti ne prekrivajo [17]. Pisave z dobro zasnovo imajo običajno vključeno zajetno število ligatur, od tistih najbolj pogostih, do tistih, ki so specifične za posamezne jezike in celo ligature, ki služijo v okrasne namene. Nekateri računalniški programi za obdelavo besedil sami, avtomatično vstavljajo ligature. Pri uporabi takih programov je potrebno biti še posebej pozoren, da jih vstavljajo pravilno in konsistentno.. ff. fi. fj. fl. ffi. ffl. ct. Slika 5.5: Primeri ligatur.. 5.4 Različice pisav Čeprav pisave običajno vključujejo več različic (krepke, ležeče, pomanjšane velike črke, okrasne variacije ipd.), to še ne pomeni, da jih je potrebno v enem besedilu uporabiti čisto vse. Vzemimo za primer uporabo krepkejše in ležeče različice pisave. Še posebej neizkušeni oblikovalci se pogosto zatekajo k popolnoma nepotrebni in napačni uporabi teh dveh različic pisave [11]. Krepkejše različice imajo svoj namen. Uporabljajo se za označevanje postavk v seznamih, za oblikovanje naslovov in podnaslov v manjših velikostih, za označevanje začetnega dela besedila na kompleksno strukturiranih straneh ali za namene lažjega tiska na posebne vrste papirja. V kolikor smo pri uporabi racionalni, se smejo uporabiti tudi za poudarjanje številk in posameznih besed ali besednih zvez, kot so recimo iztočnice, ključne besede in nekateri elementi slovarjev. [1] Imajo tudi bolj nekonvencionalno rabo. Besede in besedne zveze zapisane krepko, lahko uporabimo za kričanje na bralca, lahko jih uporabimo za to, da bralca držimo na trnih ali da ga popolnoma odbijemo stran. Ena izmed možnih rab je tudi razbijanje monotonosti besedila in njegove hierarhije. 29.

(50) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. 6. KONTRAST. Spreminjanje parametrov pisave naj bo postopno. Zaželeno je spreminjanje enega samega parametra naenkrat. Če se spremeni velikost pisave, naj se širina reza, to je širina posameznih potez črke, ne spremeni in obratno. V kolikor se pojavi potreba po tem, da se velikost pisave za določen del besedila poveča, naj se uporabi večja pisava iste širine reza in ne večja pisava večje širine reza. Velja pravilo, da se s povečevanjem velikosti pisave mora širina reza nekoliko manjšati [12]. Kadar pisava z večjo širino reza poudarja določene besede ali besedne zveze, je morebitna ločila potrebno zapisati v isti širini reza, kot jo ima nepoudarjeno besedilo (slika 6.1) [1].. … na otokih Lombok, Bali, Flores, Timor in Sulawesi, isto blago uporabljajo …. Slika 6.1: Pravilna raba večje širine reza za namene poudarjanja.. Če so iste besede ali besedne zveze zapisane v kurzivi, je smiselno, da tudi ločila zapišemo v kurzivi (slika 6.2). To poleg ujemanja stilov omogoči boljše optično izenačevanje med črkami in številkami ter ločili in zbuja manj nezaželene pozornosti [1].. … na otokih Lombok, Bali, Flores, Timor in Sulawesi, isto blago uporabljajo …. Slika 6.2: Pravilna raba kurzive za namene poudarjanja. 30.

(51) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. V kolikor so poudarjene besede ali besedne zveze zapisane v kapitelkah, ni potrebe po spreminjanju stila ločil, ki stojijo pred ali za njimi (slika 6.3). Potrebno je zgolj preveriti, da ne pride do nedoslednosti med praznimi prostori med znaki [1].. … na otokih Lombok, Bali, Flores, Timor in Sulawesi, isto blago uporabljajo …. Slika 6.3: Pravilna raba kapitelk za namene poudarjanja.. 31.

(52) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. 7. HIERARHIJA BESEDILA 7.1 Naslovna stran. Naslovna stran mora predstavljati simbol dostojanstva in navzočnosti besedila. Če je besedilo zadržano in dostojanstveno, naj naslovna stran nositi iste lastnosti; če besedilu primanjkuje dostojanstvenosti, potem naj bo že naslovna stran tista, ki bralca na to opozarja. Oblikovanje naslovne strani ni tako preprosto, kot se sprva zdi. Ni dovolj, da na prazno stran papirja postavimo naslov, ki zaradi velikosti znakov bode v oči. Prav tako ni dovolj, da tak naslov povrhu vsega postavimo v center strani, zato, da bi pritegnili bralčevo pozornost. Čeprav so lahko črke velikih dimenzij lepe in uporabne, velikost še zdaleč ni vse. Bolj kot velikost črk je pomembna njihova oblika, eleganca ki jo izžarevajo. V vodah tipografije, je najpomembnejši faktor, ki vpliva na eleganco črk, praznina. Veliko kvalitetnih in z občutkom oblikovanih naslovnih strani, je pretežno praznih. Običajno so sestavljene iz ene ali dveh skromnih vrstic besedila na vrhu strani in iz ene ali dveh vrstic besedila na dnu strani, ki jih ločuje ličen in uravnotežen prazen prostor [15].. 7.2 Označevanje začetkov in nadaljevanj besedila V sodobnih tiskovinah, v katerih so naslovi krajši, robovi pa čedalje manjši, stavci pogosto pustijo tretjino strani prazno, da proslavijo začetek novega poglavja [12]. Najbolj preprost način, kako začeti besedilo, je ta, da prvo, kakor tudi vse ostale vrstice besedila, poravnamo skrajno levo, ob levi rob navideznega okvira besedila. Na strani, kjer je besedilo naznanjeno s pomočjo naslova poglavja oziroma podpoglavja, je to več kot dovolj [1]. V primeru, da se odsek besedila prične na vrhu nove strani, in da le ta ni naznanjen s pomočjo naslova poglavja oziroma podpoglavja, je potrebno uporabiti drugačno metodo. Enako velja za primere, ko se na vrhu strani, oziroma pred novim odsekom besedila, nahajajo epigrafi, opombe, fotografije z besedilom in drugi elementi [4].. 32.

(53) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. Fleuroni (rastlinski okraski) se pogosto uporabljajo za označevanje začetkov in ponovnih začetkov besedila. Pogosto so natisnjeni v barvi, ki ni enaka barvi besedila, še posebej rdeči, saj le ta velja za sekundarno barvo stavcev [1]. Uvodne fraze ali celotne prve vrstice besedil občasno najdemo zapisane v kapitelkah, ali krepkih velikih in malih tiskanih črkah. Še eden izmed odličnih načinov, kako označiti začetek besedila, je s pomočjo verzalke [11]. Verzalka ali inicialka je začetna črka v prvi vrstici poglavja ali dela besedila, ki je za več stopenj velikosti večja od glavnega besedila [17]. Sega lahko čez eno ali čez več vrstic besedila in je lahko navadna, okrašena ali ilustrirana. Običajno je, tako kot fleuroni, natisnjena v rdeči barvi oziroma barvi, ki ni enaka barvi besedila. Pogosta praksa je, da prvo besedo ali frazo, ki sledi verzalki, zapišemo z majuskulami, kapitelkami ali krepko, da ustvarimo neke vrste most med verzalko in ostalim besedilom. V primeru, da se besedilo prične z enojnim ali dvojnim narekovajem, je uveljavljena konvencija ta, da narekovaja ne izpustimo, temveč ga postavimo pred verzalko (tako, kot bi ga drugače postavili v ostalih delih besedila). Prilagodimo mu seveda velikost, barvo in položaj, glede na verzalko [1].. 7.3 Naslovi Prva odločitev, ki jo je pri oblikovanju naslovov in podnaslovov potrebno sprejeti, je njihova poravnava. Bodo simetrični ali bodo asimetrični? Bodo centrirani glede na stolpec z besedilom ali bodo poravnani levo oziroma desno, bodisi skrajno ali pa z rahlim zamikom od navideznega roba stolpca z besedilom [13]? Običajno se odločimo za naslove in podnaslove, ki so poravnani levo, glede na stolpec z besedilom. Razlog za to tiči v zagotavljanju čim boljše berljivosti besedila. Bralčevo oko namreč pričakuje začetek besedila, v katerega sodijo tudi naslovi in podnasloviob levem robu strani. Če je to potrebno, jih z rahlim zamikom ločimo od navideznega skrajnega levega roba stolpca besedila. V kolikor se odločimo za naslove in podnaslove, ki so poravnani desno, glede na stolpec z besedilom, in so le ti enovrstični, je potrebno upoštevati, da mora biti velikost pisave takih naslovov in podnaslovov nekoliko večja oziroma pisava krepka, da jih bralčevo oko ne zgreši v celoti [1]. Tretji način je postavitev naslovov in podnaslovov v prostor robov strani, običajno levega oziroma desnega. V tem primeru potrebe po večanju velikosti pisave ali širine reza ni [1].. 33.

(54) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. 7.4 Podnaslovi V splošnem velja pravilo, da naj bodo podnaslovi ali pretežno simetrični ali pretežno asimetrični. Mešanje simetričnih in asimetričnih podnaslovov ni zaželjeno, saj vodi do zmede. V kolikor je simetričnim podnaslovom potrebno dodati asimetrične podnaslove ali obratno, naj se le ti pojavijo na vrhu ali na dnu hierarhične lestvice, kakor na sliki 7.4. Število členitev podnaslovov pa po drugi strani ni omejeno. Zahtevno besedilo, ki je močno členjeno, lahko zahteva uporabo tudi šestih ali večih nivojev podnaslovov [1].. 2 Consectetur adipiscing elit 2. N. ullam aliquam convallis dui, sit amet tempor nibh viverra ut. Donec vel libero eget velit dignissim viverra et non sapien. Phasellus rhoncus magna enim, sit amet ultricies nisi hendrerit sit amet. Nam tristique tincidunt diam, eget ullamcorper enim dapibus eu. DUIS NEC CONGUE DIAM. 1 Pellentesque eget nunc cursus, mattis enim consectetur, pretium turpis. Fusce ac dictum arcu, in fringilla nulla. Suspendisse egestas vitae ex sit amet lobortis. Phasellus consectetur leo id euismod scelerisque. Suspendisse potenti. 1 Ut sed felis et velit pulvinar vestibulum. Duis nec congue diam. Pellentesque sit amet sagittis dolor. Morbi auctor eros in tincidunt condimentum. Aliquam pellentesque tellus eget rutrum fermentum. Ut in congue felis. 1 Suspendisse nec placerat dui, non lobortis purus. Phasellus nec ante dignissim, pulvinar erat non, molestie mauris. Proin quis sapien euismod, interdum dui sit amet, varius orci. Phasellus eget rutrum.. Slika 7.4: Primer hierarhične lestvice podnaslovov. 34.

(55) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. 7.5 Opombe Velikost pisave opomb, podrejenih glavnemu besedilu, naj bo znatno manjša od velikosti pisave glavnega besedila. Postavitev opomb na dno strani ali na konec glavnega besedila ni pravilo, temveč zgolj akademska navada. V kolikor obstaja možnost, smejo opombe stati tudi ob robovih strani oziroma tam, kjer njihova postavitev poživi in obogati dogajanje na strani [1]. Čeprav imajo svoj namen, so opombe v nogi strani običajno simbol zmešnjave. V kolikor so kratke in redke, omogočajo ekonomično izrabo prostora. Zlahka jih je moč najti, še lažje jih je ignorirati. Dolge opombe v nogi strani so moteče; na pogled so utrujajoče, zaradi majhne velikosti pisave težko berljive. Opombe v nogi strani, ki se nadaljujejo še na naslednji strani, so pokazatelj slabo opravljenega grafičnega oblikovanja. Opombe na koncu glavnega besedila so učinkovite pri izrabi prostora. Bistveno lažje jih je oblikovati, njihova dolžina pa načeloma ni omejena. Razen minimalno motečih označb med besedilom, ne kazijo izgleda strani. Potrebujejo pa zelo vestnega bralca, ki je od glavnega besedila pripravljen preskakovati na konec in se vračati nazaj. Opombe ob robovih strani, strani vlivajo več življenja in razgibanosti in so najbolj enostavne za lociranje in branje. V kolikor so skrbno oblikovane, ne rabijo povečevati formata strani in s tem večati stroškov morebitnega tiska. Velikost pisave za opombe v nogi strani naj običajno ne presega 8 ali 9 pik. Velikost pisave za opombe na koncu glavnega besedila je običajno nekoliko manjša od velikosti pisave glavnega besedila, torej nekje od 9 do 10 pik. Velikost pisave za opombe ob robovih strani sme biti enaka ali manjša od velikosti pisave glavnega besedila, odvisno od pogostosti opomb, njihove pomembnosti in formata ter celostnega izgleda strani [1]. V kolikor opombe ob robovih strani niso prepogoste, označevanje med besedilom ni potrebno. Kvečjemu jih smemo označiti s simbolom, na primer asteriskom oziroma zvezdico. Za označevanje opomb na koncu glavnega besedila med glavnim besedilom je uporaba označb v obliki eksponentov nujna. Za označevanje manjšega števila opomb v nogi strani je standardna praksa uporaba simbolov, ki jih prikazuje slika 7.5 [1]. Ker večina bralcev na področju tipografije ni strokovno podkovana, je uporaba številk, namesto simbolov, kljub temu bolj smiselna, vsaj v besedilih, ki so namenjena širši, laični javnosti.. 35.

(56) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. * † ‡ § ¶. Slika 7.5: Zaporedje simbolov za označevanje opomb. Zajetno število pisav sicer vsebuje posebej oblikovane sete eksponatov, vendar ti pogosto niso zadovoljivih velikosti ali oblik za označevanje opomb. Uporaba klasično oblikovanih številk manjših velikosti, dvignjenih nekaj pik nad črkovno črto, običajno predstavlja rešitev tovrstnega problema. Ker se eksponati za označevanje opomb praviloma pojavljajo na koncu stavkov in povedi, je pred koncem oblikovanja smotrno preveriti, da eksponati stojijo pred in ne za končnimi ločili. Med besedilom morajo opombe označevati eksponati, saj zaradi svoje majhnosti predstavljajo najmanjšo prekinitev toka besedila. Hkrati jih je, ker so rahlo dvignjeni nad ostale znake v vrstici z besedilom, ob hitrem preletavanju besedila lažje najti. Kadar opombe številčimo, recimo na koncu glavnega besedila, naj njihov začetek označujejo številke običajne velikosti in ne eksponati (slika 7.6). V tem primeru namreč opombe niso več nekaj postranskega, temveč glavna bralčeva tarča. Dodatna uporaba ločil ni potrebna [1].. Nam congue enim eu est tempor, at hendrerit felis tincidunt. Maecenas eros lacus, iaculis in enim non, ultricies varius turpis¹. In blandit ante urna, ac iaculis leo sodales eu. Maecenas ac lacinia purus. Aliquam erat volutpat. Phasellus quis lobortis tortor. Suspendisse tortor est, viverra sed volutpat non, tincidunt eget orci². Vestibulum ornare tempus purus, quis dictum est molestie sed. 1 Curabitur ullamcorper mi eget mauris facilisis porttitor sagittis sed. 2 Fusce tristique neque ac viverra tempor.. Slika 7.6: Označevanje opomb.. 36.

(57) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. Bralca ne smemo siliti v iskanje opomb. Opombe naj se ne pojavljajo v majhnih gručah na koncih posameznih poglavij. Bolj smotrno jih je nanizati na koncu glavnega besedila. V kolikor je to mogoče, jih lahko številčimo z obzirom na poglavje, v katerem se pojavijo. V primeru, da se odločimo za tak sistem označevanja, je potrebno poglavja jasno in pravilno označiti, da ne pride do zmede.. 7.6 Tabele Oblikovanje tabel je eno izmed najbolj zamudnih opravil pri oblikovanju besedila. Kljub temu si zasluži isto mero pozornosti in še večjo mero skrbnosti, saj lahko le na tak način besedilo, ki je prikazano s pomočjo tabel, postane enakovredno in enako berljivo kot ostalo besedilo. Tako kot katerokoli drugo besedilo, je tudi tabele mogoče oblikovati narobe. Do napak pride še posebej takrat, kadar se grafični oblikovalci oblikovanja lotijo s preveč tehničnega stališča. Vzrok za to ponavadi tiči v želji po tem, da se v eno celico strpa čim večja količina podatkov. Pri oblikovanju besedila v tabelah je potrebno upoštevati določena pravila. Vso besedilo v tabelah naj teče horizontalno, razen kadar je jezik besedila japonski ali kitajski. Pisava, ki je premajhna ali preveč zgoščena ni nikoli primerna za uporabo, kaj šele, da bi bila primerna za uporabo v tabelah. Raznoraznih dodatkov v obliki črt, obrob, pik in ostalih grafičnih elementov naj bo čim manj. Besedilo v tabeli naj diha. Potrebno ga je obdati z dovolj belega oziroma praznega prostora, da bralcu ne daje občutka utesnjenosti. Besedilo naj bo poravnano tako, da daje občutek urejenosti, stabilnosti in preglednosti. Obarvanim celicam, razen kadar je to nujno potrebno za boljšo berljivost tabele, se je najbolje povsem odpovedati [1]. Števke 0, 2, 3, 4, 5, 6, 7, 8 in 9 imajo v večini pisav enako širino. Izjema je le števka 1, ki ima ponavadi dve različni širini; eno, enako širini ostalih števk in eno, ki je nekoliko ožja. Ožja oblika števke 1 je najbolj primerna za uporabo med besedilom, zaradi lepšega prileganja in ujemanja z ostalimi znaki. Števka 1 s širino, ki je enaka širini ostalih števk, je po drugi strani bolj uporabna za prikazovanje številčnih podatkov v seznamih in tabelah [10].. 37.

(58) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. 8. OPREDELITEV INTERAKTIVNOSTI. Interaktivnost opredeljujemo kot stopnjo razvitosti, pri kateri informacijsko komunikacijska tehnologija ustvarja okolje, ki uporabnikom omogoča medsebojno komunikacijo in pomoč pri izmenjavi sporočil. [3] Lahko jo opredelimo tudi kot komunikacijski proces med človekom in programsko računalniško opremo. [8] Najbolj pogosto obliko interaktivnosti najdemo pri računalniških igrah, saj le te zahtevajo nenehno interakcijo z igralcem. Podatkovne baze, finančne, inženirske in trgovske aplikacije prav tako sodijo med tipične primere interaktivnih elektronskih vsebin. [8] Interaktivnost lahko povežemo tudi z vrednotami, kot so posameznikova svoboda do izbire, politična neodvisnost in samonadzor. Ker je pojem interaktivnosti tako močno razvejan, ga je težko jedrnato in natančno identificirati in opredeliti. [9] Najbolj pogosta oblika interakcije, s katero se srečujemo, so spletni brskalniki. Med brskanjem po spletu ima spletni brskalnik vlogo interaktivne aplikacije. Dober primer interakcije so spletni obrazci, ki vsebujejo prazna polja za vpis željenih podatkov, v katere uporabnik sam vnaša podatke, ki jih od njega zahteva spletna stran. Povsem drugačen primer interakcije so oglasi, ki jih je moč zaslediti na veliki večini spletnih strani. V primeru, da nas oglasno sporočilo prepriča, nas klik nanj po navadi prestavi na povsem drugo spletno stran, ki nam običajno postreže z obširnejšo obrazložitvijo sicer skrajšanega oglasnega sporočila. Dasiravno sicer ne vedno in ne najbolj prepričljivo, tovrstna interakcija dejansko omogoča in zagotavlja večjo berljivost in razumljivost sporočil za uporabnika. Pri računalniških sistemih interaktivnost predstavlja dialog med računalniškim programom in njegovim uporabnikom. Prva asociacija tovrstne interakcije so nam računalniške igre. Tudi v službi lahko uporabniki doživljajo določeno mero interakcije z računalniškimi programi, ki so namenjeni opravljanju dela, vendar je mera interakcije bistveno bolj omejena, saj omenjene programske rešitve običajno ponujajo vnaprej določeno število možnosti za interakcijo.. 38.

(59) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. Definicija interaktivnih medijev je ena izmed definicij, ki jih je najtežje definirati. Težave se pojavijo zaradi močne razvejanosti pojma interaktivnosti skozi več različnih področij. Eno izmed teh področij so tudi interaktivni mediji, ki jih lahko imenujemo tudi hibridna medijska tehnologija, ker združujejo več različnih vsebin. Govorimo o spletnih, tiskanih, zvočnih, slikovnih in drugih vsebinah, ki uporabniku omogočajo interakcijo. Primarna karakteristika, ki nam otežuje definiranje interaktivnih medijev, je naglo spreminjanje in napredovanje omenjenega področja. Tiskani mediji zagotavljajo zelo lahkotno interakcijo z bralcem. Obračanje strani knjige, z namenom, da bi bralec nekaj prebral, zahteva njegovo minimalno vpletenost. Dasiravno je knjigo moč definirati kot multimedijski format, saj na svoji strani lahko vključuje slike, grafe, zemljevide in druge grafične elemente, v obliki prilog pa tudi druge medije, knjiga in z njo vse tiskovine ne niso interaktivni mediji, saj so oblikovane z namenom, da bralca usmerjajo na način, ki ga je prej določil avtor. Bralec sicer lahko uporabi kazalo na zadnji strani knjige ali morebiti preskoči katero stran, vendar ima vsebina še vedno sledi eni hierarhiji poglavij in je napisana tako, da jo je potrebno prebrati od začetka do konca. Interaktivni multimedijski programi ponujajo možnosti neobičajnega hranjenja podatkov in omogočajo možnosti računalniškega materiala. To je posebej pomembno za šole, knjižnice in univerze, kjer knjige težko obdržijo in nagrajujejo. Multimedijska vsebina omogoča dostop do drugih vrst nedostopnega materiala, kot so zgodovinski filmi, ki jih je težko najti, redki zvočni posnetki pomembnih govorov, ilustracij iz različnih obdobij … Multimedija lahko postavi v ospredje primarne in sekundarne vire materialov, ki jih lahko najdemo preko različnih lokacij na svetu. Ni samo dostop do stvari, ki naredi medije pomembne, ampak je pomemben tudi nadzor, ki ga nudi uporabniku za dostop do različne vsebine. Interaktivni programerji lahko omogočijo uporabnikom, da lahko skozi hiperpovezave, ločevanja, iskanja in komentiranja manipulirajo z materialom. Pri diplomskem delu smo se v praktičnem delu osredotočili na oblikovanje vsebine za različne ločljivosti zaslonov. pri različnih kvalitetah resolucije. Za ta interaktiven odnos smo se odločili zaradi tega, ker starejša generacija ljudi ni ravno modernizirana in marsikomu še vseeno bolj odgovarja, da ima pred sabo namesto monitorja, list papirja s katerega lahko prebira. Oblikovanje smo zato naredili s takšnim namenom, da vsebina, ki si jo lahko ogledamo na spletu, še vedno vizualno ostane ista, če jo prenesemo na papir.. 39.

(60) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. 8.1 razlika med klasičnim in interaktivnim besedilom V čem se oblikovanje interaktivnega besedila razlikuje od oblikovanja klasičnega besedila, namenjenega tisku? Velika večina pravil, ki veljajo za oblikovanje klasičnega besedila, namenjenega tisku, velja tudi za oblikovanje interaktivnega besedila; najbolj pomemba razlika je le v tem, da je pri oblikovanju interaktivnega besedila potrebno poskrbeti za to, da bralec z lahkoto prepozna interaktivne elemente in njihove funkcije. Dodatno je potrebno poskrbeti tudi za natisljivo različico interaktivnega besedila, ki mora po sporočilni vrednosti ostati enaka izvirniku. Največja prednost interaktivnega besedila v primerjavi s klasičnim besedilom, namenjenim tisku, so takoimenovane hiperpovezave. Pod izrazom hiperpovezava v računalništvu pojmujemo referenco na podatke, ki ji lahko neposredno, preko grafičnih elementov ali niza tipografskih znakov, sledimo. Hiperpovezava običajno kaže na nov spletni dokument ali na specifični element znotraj spletnega dokumenta, v katerem se nahaja. Nemalokrat hiperpovezava vodi tudi do avtomatskega prenosa datotek, kot so razne brošure, fotografije, gonilniki, računalniški programi itn. Tako kot v spletnih brskalnikih hiperpovezavo običajno prikažemo različno od preostalega besedila, na primer z drugačno barvo ali pisavo, je potrebno tudi znotraj interaktivnega besedila poskrbeti za razločevanje hiperpovezav od preostalega neinteraktivnega dela besedila.. 40.

(61) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. 41.

(62) Tipografija in oblikovanje interaktivnih besedil v elektronski obliki. 9. PRAKTIČNI DEL 9.1 Izbor računalniškega orodja. Zaradi široke palete možnosti in zaradi izjemne kontrole nad besedilom, ki nam jo le ta ponuja, smo se odločili za uporabo računalniškega programa Adobe InDesign CC 2015 (slika 10.1). Uporabili smo različico programa 11.0.0.72, ki je tekla na platformi Windows 10 Home, različica 1607.. Slika 9.1: Računalniški program Adobe Indesign CC 2015.. Čeprav program Adobe InDesign omogoča dodajanje interaktivnih elementov, delujočega primera interaktivnega besedila nismo izdelali, saj to ni bil naš cilj. Naš cilj je bil oblikovati besedilo na takšen način, da bi bilo primerno za naknadno dodajanje interaktivnih elementov.. 42.

No results found