Типографика

Типографика — искусство и наука работы со шрифтом: осознанный выбор, размещение и применение шрифтов для читаемой, иерархичной и эстетичной подачи контента. В цифровых продуктах типографика определяет скорость чтения, понимание, конверсию и восприятие бренда — часто сильнее, чем цвета или изображения. Хорошая типографика незаметна; плохая чувствуется сразу. Ключевые элементы: гарнитура (serif для классического авторитетного тона, sans-serif для современного и чистого, monospace для кода), размер шрифта (16 px body-текст как минимум на мобильных, 18 px для хорошей читаемости на десктопе), высота строки (line-height 1.5–1.7 для body-текста, 1.1–1.3 для заголовков), межбуквенный интервал (letter-spacing — плотный для display, нормальный для body), ширина строки (45–75 символов для оптимальной читаемости), контраст (WCAG 2.2 AA требует минимум 4.5:1 для обычного текста, 3:1 для large text). Типографическая иерархия создаётся размером, начертанием, цветом и отступами. Чёткая иерархия (H1 > H2 > H3 > body) автоматически ведёт взгляд через контент. Современные веб-проекты используют типографические scales по модульному методу (множитель 1.25 или 1.333 на ступень) или fluid typography (clamp(min, ideal, max)) для адаптивного масштабирования без breakpoints. Технически: веб-шрифты через Google Fonts, Adobe Fonts или self-hosted. Правило производительности: максимум 2–3 гарнитуры, по 2–3 начертания каждая (400, 600, 700 обычно достаточно). Font-display: swap предотвращает FOIT (Flash of Invisible Text). Preload критичных шрифтов в HTML-head улучшает LCP. Variable Fonts (OpenType Variations) дают несколько начертаний в одном файле — на 30–60 % меньше общего времени загрузки.