Typografie

<< | Tvorba webu | Fonty >>

Základní pojmy

• Typografie - zásady pro správné použití písma v textových dokumentech
• Typografie webu - vzhled a uspořádání obsahu na webové stránce

Typografické zásady pro web

Patkové a bezpatkové fonty

• patkové - serif - vhodné pro denní tisk a knihy s vysokou hustotou znaků
• bezpatkové - sans-serif - vhodné pro časopisy, technické publikace a texty pro čtení na monitorech

Kombinace fontů

• střídání většího počtu fontů vede k rozpadu vzhledu stránek a ke snížení čitelnosti textů
• doporučuje se jeden font na běžné texty a další font na nadpisy

Speciální fonty

• měly by podpořit vizuální účinek webu a fungovat jen jako upoutávka
• delší texty se speciálními fonty se stávají nečitelné nebo neúsporné

Řádkování (line-height)

• pro zajištění dobré čitelnosti je třeba volit optimální odstupy textových řádků
• optimální výška řádku - o 0.3 - 0.5 em větší než výška písma (font-size)
  • font-size: 1em; line-height: 1.4em (line-height: 140%;)

Proložení znaků (letter-spacing)

• vhodné jen pro nadpisy a důležitá slova
• volit malé hodnoty - 0.2 - 0.5px jinak se snižuje čitelnost
• náhrada znaku mezera mezi znaky ve slově (s l o v o)

Členění textů do odstavců

• vizuální oddělení odstavce pomocí vlastnosti margin-top a margin-bottom
• možnost odsazení prvního řádku text-indent
• nedělitelné mezery za předložkami a spojkami - kód  

Zvýraznění nadpisů

• převod na velká písmena - text-transform: uppercase

Testování vzhledu textových stran

• Generátor testovacích textů
• Český generátor textů

Zajímavé odkazy

• Onlio - Typografie na webu
• Typografický rychlokurz
• Nedivse.cz - doplňování pevných mezer
• Tvorba webu - fonty a css
• HTML Guru - písmo
• České webové fonty
• Testování fontů
• Font-face
• Nové webové fonty
• Přehled českých webových fontů
• Nové fonty ke stažení z Fonts 2U