Введение
Типографика — важная часть любого дизайна, которая включает специальную терминологию. Незнание понятий может создать путаницу и привести к ошибкам во всем интерфейсе. Мы собрали гайд с основными определениями, которые помогут вам в работе над проектами.
Основные термины
Шрифт — способ написания набора символов (буквы, цифры, пунктуационные знаки) с одинаковым размером, пропорциями и стилем.
Гарнитура (Семейство шрифтов) — это группа шрифтов, которые объединены общим стилем.
Помните: шрифт и гарнитура — это разные понятия. Гарнитура — более широкое определение, которое включает в себя шрифт. Например, шрифт Helvetica, а гарнитура — Sans Serif (без засечек).
Кегль — размер шрифта по вертикали, т. е. высота букв. Обычно измеряется в пунктах (pt). Как правило, диапазон размера основного текста на сайтах — 12-18 пунктов, а заголовки — от 20 pt.
Интерлиньяж (междустрочный пробел) — расстояние между базовыми линиями строк. В зависимости от программы может измеряться в различных единицах. Обычно интерлиньяж на 15-25 % больше кегля. Например, если кегль 12 pt, то интерлиньяж — 16 pt.
Важно! Чем больше кегль, тем больше интерлиньяж. Однако в заголовках межстрочный интервал может быть намеренно сокращен для достижения драматизма и выразительности.
Ке́рнинг — расстояние между парами символов (буквы, знаки пунктуации, математические символы). Иногда употребляют понятие «воздух» между буквами. Обычно кернинг выставлен автоматически, но при необходимости его можно изменить, чтобы улучшить читабельность текста.
Трекинг (межбуквенный интервал) — это равномерное расстояние между группой символов (слово, строка, абзац). Также может изменяться для удобства читаемости. Может быть:
- положительный (разряженный),
- нормальный,
- отрицательный (плотный).
Графема — это минимальная единица текста (буква, слоговой знак, иероглиф, цифра, математический символ). Графема узнаваема вне зависимости от типа шрифта и начертания, мы легко можем ее распознать. ПРИМЕР: графема "а" в разных типах шрифта.
Глиф — это конкретное изображение графемы в определенном шрифте.
Апертура — степень открытости форм знаков, таких как e, c, s.
Лигатура — знак, который образуется при соприкосновении двух букв. Например, ае. Соединяющий элемент двух символов называется гадзук.
Строчные буквы — буквы меньшего размера. Как правило, используются по умолчанию для написания основных текстов.
Прописные буквы (заглавные) — буквы большего размера. Обычно употребляются в аббревиатурах, собственных именах, иногда в заголовках.
Маюскульные — высота этих знаков равна прописным буквам. Они не имеют выносных элементов.
Минускульные — их высота близка к строчным буквам, они имеют верхние и нижние выносные элементы. Как правило, употребляются со строчными буквами, т. к. гармонично вписываются в текст.
Классификация шрифтов
Наборные шрифты используются для основного текста.
Характеризуются читабельностью и легкостью распознавания символов. Имеют минимум декоративных элементов:
Антиква
Шрифт с засечками на концах элементов (Serif) — классический вид шрифта, который использовался на протяжении веков. Благодаря своей долгой истории он соотносится с наследием и традициями, вызывает чувство уважения.
Примеры: Times New Roman, Garamond, Baskerville, Georgia, Palatino.
![](https://cdn.prod.website-files.com/60a35497ea15cf45782248b1/6683a69e5075aac067643d3b_Frame1948753585-ezgif.com-png-to-webp-converter.webp)
Брусковый
Slab Serif — интерпретация шрифта с засечками, но с плоскими и квадратными, а не изогнутыми. Толщина засечек равна толщине символов.
Примеры: Arvo, Copse, Roboto Slab.
![](https://cdn.prod.website-files.com/60a35497ea15cf45782248b1/6683a714043fb9c3c0f322d4_Frame1948753594-ezgif.com-jpg-to-webp-converter.webp)
Гротеск
Шрифт без засечек (Sans Serif) ассоциируется с ясностью, универсальностью, современностью и эффективностью.
Примеры: Open Sans, Oswald, Arial.
![](https://cdn.prod.website-files.com/60a35497ea15cf45782248b1/6683a7861a893a11d60e8110_Frame1948753593-ezgif.com-jpg-to-webp-converter.webp)
Рукописный
Шрифты, имитирующие ручное письмо (Script). Они очень разнообразны и могут ассоциироваться с разными чувствами и эмоциями.
Примеры: Alex Brush, Pacifico.
![](https://cdn.prod.website-files.com/60a35497ea15cf45782248b1/6683a80c3d783988a0159c22_Frame1948753595-ezgif.com-jpg-to-webp-converter.webp)
Акцидентные шрифты
Акцидентные шрифты — шрифты, намеренно созданные с недостатками и несовершенствами, которые отличаются от классических своей уникальностью, асимметрией и нестандартной формой знаков. Обычно используются для заголовков.
Несколько примеров ниже:
Геометрические шрифты созданы из простых геометрических форм и лишь условно напоминают символы традиционной формы. Например, New Zelek, Rastr.
![](https://cdn.prod.website-files.com/60a35497ea15cf45782248b1/6683aa55ecf47506eb6567ee_Frame1948753596-ezgif.com-jpg-to-webp-converter.webp)
Имитационные подражают уже существующим или когда-то существовавшим способам проектирования символов. Например, шрифт SK Fushimi, который отсылает к японской современной культуре:
![](https://cdn.prod.website-files.com/60a35497ea15cf45782248b1/6683aaace21a6400f39c0707_Frame1948753588-ezgif.com-jpg-to-webp-converter.webp)
![](https://cdn.prod.website-files.com/60a35497ea15cf45782248b1/6683ab3ee39a51f4c095b45f_Frame1948753597-ezgif.com-jpg-to-webp-converter.webp)
Орнаментальные представляют собой шрифты с контуром, орнаментом и различными декоративными элементами. Например, Sapphire, Cloister Initials.
![](https://cdn.prod.website-files.com/60a35497ea15cf45782248b1/6683ab91967cd7796fb71f86_Frame1948753592-ezgif.com-jpg-to-webp-converter.webp)
Виды начертаний
Начертание — это внешний облик символа:
- Прямой (Regular) — вертикальное расположение знаков, обычно используется для основного текста.
- Курсив (Italic) — символы, расположенные под наклоном.
- Жирный (Bold) характеризуется увеличением толщины знаков.
Анатомия буквы
Базовая линия — воображаемая прямая линия, проходящая по нижнему краю прямых знаков без учёта нижних выносных элементов.
Высота букв — расстояние от базовой линии до верхнего края буквы.
Линии верхних и нижних выносных элементов. Выносные элементы — часть строчной буквы, выходящая за пределы линии строчных знаков или базовой линии шрифта:
- верхний выносной элемент — «б, ф»
- нижний выносной элемент или нижний спуск — «р, д, у, ф, ц»
Внутрибуквенный просвет — пространство, которое полностью или частично ограничено формой буквы или символа. Например: A, B, D, O, P, Q, R, a, b, d, e, g, o, p и q.
Межбуквенный просвет — разное расстояние между основными штрихами соседних букв в шрифте, в зависимости от очертания соседних букв на стыке. В грамотно построенном шрифте создается впечатление равномерного расположения букв, несмотря на то, что просвет разный.
Диакритический символ — элемент знака, который изменят начертание буквы и набирается отдельно. Такие символы ставятся над буквой, под ней или пересекают её. Например, й ё ô è.
Термины, связанные с текстом
Выключка — способ выравнивания текста относительно вертикальной оси: по левому краю, по центру, по правому краю и по ширине.
Выравнивание — расположение текстовых блоков относительно макета.
Абзацный отступ — отступ в начале первой строки абзаца. Как правило, равен 4 символам или одной части кегля: если кегль 10, то отступ 10 pt.
Швейцарский абзац или слепая строка — отделение абзацев пустой строкой без отступа.
Висячие предлоги — предлог, который остался в конце строки, хотя относится по смыслу к слову в начале следующей строки. Рекомендуем переносить некоторые такие предлоги на новую строку.
Висячая строка — это слово-одиночка (вдова) или очень короткая строка (сирота) текста в конце абзаца.
Заключение
В начале специфическая лексика типографики может показаться вам непонятной и сложной. Этот лонгрид поможет разобраться с основными терминами, чтобы не допускать ошибок в разработке дизайна.