UX / Typografia a sadzba

Používateľské rozhrania a používateľský zážitok

Typografia a sadzba

Sergej Chodarev

Typografia

Typografia — vizuálna artikulácia textového obsahu pomocou písma

Typografický slovník

Väčšina UI je text

Prečo?

Typografia

Text a znaky

"úvodzovky" „úvodzovky“

Úvodzovky

Ďalšie znaky

Formátovanie

Zvýraznenie

Princíp minimálneho dostatočného rozdielu

Písmo

serif
sans-serif

proporcionálne
neproporcionálne

Rozloženie

Odseky

Medziriadková medzera (leading)

For most text, the optimal line spacing is between 120% and 145% of the point size. Most word processors, as well as CSS, let you define line spacing as a multiple. Or you can do the math—multiply your point size by the percentage. (The text in this paragraph has line spacing of 110%. It’s too tight.)

For most text, the optimal line spacing is between 120% and 145% of the point size. Most word processors, as well as CSS, let you define line spacing as a multiple. Or you can do the math—multiply your point size by the percentage. (The text in this paragraph has line spacing of 135%. It looks fine.)

Dĺžka riadku

Rozdelenie

Zarovnanie

Rozdeľovanie slov

Rieky

Ďalej

Sadzba (layout)

Gestalt psychológia

Pravidlo vnútorného a vonkajšieho

vnútorné ≤ vonjakšie

MUSEUM
MUSEUM
MUSEUM OF NATURAL SCIENCES
MUSEUM OF NATURAL SCIENCES
MUSEUM
OF NATURAL SCIENCES
MUSEUM
OF NATURAL SCIENCES
MUSEUM
OF NATURAL SCIENCES
MUSEUM
OF NATURAL SCIENCES
MUSEUM
OF NATURAL SCIENCES

Consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Lorem ipsum dolor sit amet

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Lorem ipsum dolor sit amet

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Modulárnosť

Grid

Pravidlo kotvových objektov

Hierarchia

Napoleon Crossing the Alps