Ne morate biti dizajner da bi vaša aplikacija izgledala profesionalno. Ovih sedam osnova tipografije pokriva 80% puta — i sve se mogu primeniti za jedan dan.
1. Koristite maksimalno dva fonta
Jedan serif font za naslove (Merriweather, Playfair Display, Georgia), jedan sans-serif za tekst (Inter, Roboto, System UI). Više od dva fonta znaci vizuelni haos. Manje znaci koheziju.
2. Velicina fonta: minimum 16px za tekst
Sve ispod 16px za paragrafe je mracno i nescitljivo. Naslovi treba da budu najmanje 2x velicina tela teksta. Koristite clamp() za responsive tipografiju: font-size: clamp(1rem, 2.5vw, 1.25rem).
3. Razmak izmedju redova (line-height)
Za dugacak tekst: 1.6 do 1.8. Za naslove: 1.1 do 1.3. Vecina developera ostavlja default koji je preuzak. Dva minuta podesavanja line-height cini tekst 50% citljivijim.
4. Duzina reda: 60-75 karaktera
Optimalna duzina reda za citanje je 60 do 75 karaktera. Koristite max-width: 65ch na paragrafu. "ch" jedinica je sirina karaktera "0" u trenutnom fontu — savrsena za ovo.
5. Kontrast teksta
WCAG AA standard zahteva kontrast 4.5:1 za normalan tekst. Proverite na webaim.org/resources/contrastchecker. Sivi tekst izgleda elegantno, ali cesto je necitak na blagom pozadinskom tonu.
6. Hijerarhija: 3 nivoa, ne vise
Naslov, podnaslov, tekst. To je sve. Kad pocnete da dodajete cetvrty nivo, izgubili ste kontrolu nad hijerarhijom. Koristite boju, debljinu i velicinu — ne vise fontova.
7. Poravnanje: levo, uvek
Centrirani tekst je lepo za naslove i kratke recite. Za paragrafe — nikad. Centrirani tekst usporava citanje jer mozak mora da trazi pocetk svakog reda. Levo poravnanje uvek.
"Tipografija je glas teksta. Dobar tipografski dizajn je kao dobar zvucnik — ne primas ga dok citas, ali bi odmah primetio da ga nema."