Amanoba Logo
Back to Course

Tipográfia: hierarchia és hang magyarul

Day 7 of 30 · The Playbook 2026 – Mesterkurzus Designereknek

Felépíted a tipórendszert: szerepek, méretek, súlyok, sorhossz (karakterszám), ritmus, hang.

Tanulási cél

  • Definiálsz tipó szerepeket (display, h1–h6, body, caption, code).
  • Beállítod a ritmust (line-height, spacing, max sorhossz).
  • Összekötöd a Visual Intenttel (hang, formalitás, sűrűség).
  • Dokumentálsz jó/rossz példákat.
  • Alkalmazod egy képernyőre.

Miért fontos

  • A tipó teremti meg a hierarchiát.
  • Hangot és bizalmat közvetít.
  • Sorhossz és ritmus hat a használhatóságra.

Magyarázat

Szerepek

  • Display/Hero (kiemelés, ritkábban).
  • H1–H6 (struktúra, 1.2–1.4 line-height).
  • Body (14–16px, 1.5–1.7 line-height, 60–75 karakter sorhossz).
  • Caption/Label (12–13px, kontraszt erősebb).
  • Code/Mono (fix-szélesség, kisebb sorhossz).

Hang

  • Súly: mennyire merész?
  • Kerek vs szögletes betűforma.
  • Spacing: mennyire levegős?

Példák

Rossz: Ugyanaz a méret mindenhol, nincs kontraszt.

Jó: H1 32/40, H2 24/32, body 16/24, caption 12/16, max 70 karakter, konzisztens margin-top/bottom.

Gyakorlat (vezetett, 10-15 perc)

  1. Hozd létre a tipó-mátrixot: szerep, méret, sor-köz, súly, letter-spacing.
  2. Állíts be max sorhosszt (60–75 karakter) és title spacinget.
  3. Kapcsold össze a VIS-sel (pl. formális → kisebb spacing, nagyobb súly).

Gyakorlat (önálló, 5-10 perc)

Alkalmazd egy képernyőre (landing szekció), készíts jó/rossz összevetést.

Önellenőrzés

  • Tipó szerepek definiálva.
  • Sorhossz, line-height rögzítve.
  • Hang kötve a VIS-hez.
  • Jó/rossz példa dokumentálva.

Opcionális mélyítés