Typografie na webu

1. Dokonalost v detailech Typografie na webu

2. Znak • Binární kód • 1100010010001101 Byte 11000100 Byte 10001101 Znak č

3. Dohromady tvoří text Velmi mnoho Velmi podobné Jednoznačná identifikace = unicode kód (např. ℝ = U+211D) Znak

4. Znaků je více než 100 tisíc Na klávesnici jen několik set (méně než 1 %) Ostatní znaky lze zapsat pomocí Altu(např. Alt + 8477 = ℝ = U+211D) V HTML lze použít entity Zápis speciálních znaků

5. Obyčejná – pomocí mezerníku Zúžená – na webu nepoužitelná Nezalomitelná Mezery

6. U+00A0,  , Alt + 0160 Vkládá se na místa, kde nesmí dojít k zalomení řádku Nezalomitelná mezera

7. Děti si hrály v lese. 450 ml 2 000 lidí 80 % Nezalomitelná mezera – příklady

8. Interpunkce

9. Mezera nenásleduje před nimi Mezera následuje za nimi Pokud je na konci věty zkratka, tak se tečka neopakuje. Tečka, dvojtečka, čárka, …

10. V typografii rozlišujeme • Spojovník (rozdělovník) • Půlčtverčíková pomlčka • Čtverčíková pomlčka • Minus • Na klávesnici je pouze spojovník Pomlčka, spojovník, minus

11. - – — − + Spojovník, půlčtverčíková pomlčka, čtverčíková pomlčka, minus, plus Pomlčka, spojovník, minus

12. - Spojovník

13. U+002D, Alt + 45 • Použití • při dělení slov na konci řádků • na konci slov, která mají pokračování jinde pěti- a šestiúhelník • u složenin vyjadřujících podvojnost nebo vzájemnost Frýdek-Místek • připojení částice „-li“ • Sází se vždy bez mezer Spojovník

14. červeno-žlutý svetr • česko-anglický slovník • léčebně-preventivní • propan-butan • Praha-Východ Spojovník – Příklady

15. – Půlčtverčíková pomlčka

16. U+2013, –, Alt + 0150 • Použití • nahrazuje spojky nebo předložky („a“, „od“, „do“, „proti“) • místo nuly v psaní peněžních částek (Kč 120,–) • naznačuje přestávku v řeči • při opakování stejného výrazu • jako odrážka v seznamech • Pokud nahrazuje spojky nebo předložku a oba výrazy jsou jednoslovné, sází se bez mezer, jinak se odděluje mezerami z obou stran Půlčtverčíková pomlčka

17. Třicetiletá válka probíhala v letech 1618–1648. trenérská dvojice Martinec–Houdek William Shakespeare (1564–1616) vlak Praha–Olomouc utkání Praha – Mladá Boleslav Půlčtverčíková pomlčka – příklady

18. — Čtverčíková pomlčka

19. U+2014, —, Alt + 0151 2× delší než normální pomlčka Používá se pouze ve zvláštních případech, kdy vypadá opticky lépe Čtverčíková pomlčka

20. − Minus

21. U+2212, −, Alt + 8722 • Použití • Záporná čísla (přiléhá k číslu) • Odčítání (odděluje se mezerami) Minus

22. Teplota klesla na −12 °C. 12 − 4 = 8 Minus – příklady

23. … Výpustka, trojtečka

24. U+2026, …, Alt + 0133 • Nejedná se o 3 tečky, ale o samostatný znak • Použití • Neúplný výčet, nedokončená myšlenka • Vynechání části textu • Sází se stejně jako běžná tečka Výpustka, trojtečka

25. Pokud zítra tu omluvenku nepřineseš, tak… Vezměte si s sebou sportovní oblečení (tričko, kraťasy…). Pořád jsme opakovali: jedna, dva, tři, …, deset, … až do dvaceti. Výpustka, trojtečka – příklady

26. Sází se rovnou k textu, bez mezer • Při vnoření se používají jednoduché a ruské • Použití • Přímá řeč • Citace • Ironie Uvozovky

27. Petr potřásl hlavou: „Snažila se mě přesvědčit: ‚Táta ráno povídal: »Do večera ať je to nádobí umyté!«‘“ Uvozovky – příklady

28. Počáteční – dole, 99 resp. 9 Koncová – nahoře, 66 resp. 6 České uvozovky „“ ‚‘

29. Počáteční – šipka doleva Koncová – šipka doprava Francouzské uvozovky • «»‹›

30. Obrácené francouzské Počáteční – šipka doprava Koncová – šipka doleva Ruské uvozovky • »«›‹

31. ’ Apostrof

32. U+2019, ’, Alt + 0146 • Použití • naznačuje vypuštění hlásky na konci slova (nejčastěji v příčestích minulých) • při vynechání prvních dvou číslic letopočtu (pouze do roku 1999) Apostrof

33. Mezery se píší z vnějšku, zevnitř nikoliv Typy: kulaté, hranaté, složené a ostré Při zanoření se vhodné použít jiný typ; obvykle se zanořují naopak než v mate-matice Pokud obsahují celou větu, tak se koncové znaménko píše dovnitř Závorky

34. Micinka si lehla na polštář (taková ta věc, na které se spí). Micinka si lehla na polštář. (Polštář je taková ta věc, na které se spí.) Výrazy končící na -ismus (např. stalinismus [politická teorie a praxe spjatá s J. V. Stalinem {sovětský diktátor v letech 1927–1953}]) vyslovujeme obvykle [-izmus]. Závorky – příklady

35. Další typografická pravidla

36. Tvořeny spojením čísla a dalšího slovanebo značky Mezi číslo a následující výraz se nepíše mezera ani pomlčka Nevkládá se koncová část čísla (-ti, -mi) Psaní složených číselných výrazů

37. 8% = 8procentní roztok 12° = 12stupňové pivo 5m = 5metrový skok 6V = 6voltová baterie 20× = 20krát x-procentní n-tá odmocnina Psaní složených číselných výrazů

38. Jednotka se od čísla odděluje nezalomitel-nou mezerou Nevkládá se koncová část čísla (-ti, -mi) Psaní jednotek

39. 12 m, 10 kg, 100 kWh, 6 °C, 14 %, 17 let od 5 do 8 h (špatně: od 5-ti do 8-mi h) ve 14 letech Psaní jednotek – příklady

40. ° ′ ″ Stupeň, minuta, vteřina Stupně, minuty a vteřiny

41. Pokud stojí samostatně, tak se mezi něa číslo nepíše mezera Stupně, minuty a vteřiny

42. Venku je teplota −8 °C.(mínus osm stupňů Celsia, mezera před °) Preferuji 12° pivo.(dvanáctistupňové, mezera za °) Kolmice svírají úhel 90°.(devadesát stupňů, bez mezery [je přípustná i varianta s mezerou]) Stupně, minuty a vteřiny – příklady

43. Využití kaskádových stylů

44. Rodina písma Nutné deklarovat obecnou rodinu písma Pro delší texty na webu ideální sans-serif Font-family

45. Velikost textu Kvůli přístupnosti vhodné udávat v em. Font-size

46. Tučnost textu Hodnoty bold nebo normal Font-weight

47. Kapitálky Hodnoty small-caps a normal Font-variant

48. Kurzíva Hodnoty italic nebo normal Font-style

49. Řádkování Ideální hodnoty mezi 1.0 a 1.5 Line-height

50. Na webu má smysl zarovnávat text pouze doleva (text-align: left;) Pro vyznačování se používá tag<strong> nebo <em>, lze i prostrkat (letter-spacing) nebo použít kapitálky (font-variant) Sazba