10 правил типографской иерархии в editorial-дизайне

Типографская иерархия — это система визуальных приоритетов, определяющая порядок восприятия текстового контента. Хорошо выстроенная иерархия ведет читателя через страницу, не требуя сознательного усилия с его стороны. Плохо организованная — создает хаос, даже если текст написан превосходно. Предлагаем десять ключевых правил, которые работают в editorial-дизайне: книгах, журналах, газетах и онлайн-изданиях.

Правило 1. Ограничьтесь тремя-четырьмя уровнями иерархии

Каждый уровень иерархии — это новая визуальная «команда» читателю: остановись здесь, это важно. Если уровней больше четырех, команды начинают конфликтовать. Для большинства изданий достаточно: заголовок → подзаголовок → текст → подпись/цитата.

Правило 2. Обеспечьте достаточный контраст между уровнями

Разница в размере между соседними уровнями иерархии должна быть достаточной, чтобы воспринималась без усилий. Практическое правило: минимальный шаг — 1.25× по типографической шкале (Major Third). Разница в 2–3 пункта между заголовком и основным текстом почти не читается как иерархия.

Правило 3. Используйте не более двух гарнитур

Смешение трёх и более шрифтовых семейств создает эклектику, которая разрушает единство страницы. Классическая пара: антиква для заголовков, гротеск для основного текста (или наоборот). Альтернатива — одна гарнитура с богатым семейством начертаний, используемая на разных уровнях иерархии.

Правило 4. Согласуйте вес и размер, не дублируйте сигналы

Если заголовок H2 выделен и жирным, и крупным размером, и курсивом, и цветом — это четыре дублирующих сигнала вместо одного чёткого. Используйте один-два атрибута для каждого уровня иерархии, а не всё доступное одновременно.

Правило 5. Межстрочный интервал зависит от длины строки

Чем длиннее строка, тем больше нужен интерлиньяж — взгляд должен легко найти начало следующей строки. Для основного текста с оптимальной длиной строки (65–75 знаков) рекомендуемый интерлиньяж — 140–160% от кегля. Для широких колонок (90+ знаков) — 170–180%.

Правило 6. Не выравнивайте текст по ширине без переносов

Выключка по ширине (justify) создаёт равномерные поля, но без правильно настроенных переносов порождает неравномерные пробелы между словами — так называемые «коридоры» или «реки». В веб-типографике стандартной альтернативой служит левостороннее выравнивание с оптическим захватом первого абзаца.

Правило 7. Применяйте оптический отступ первой строки абзаца

Стандартный отступ первой строки — одна ширина заглавной буквы M текущего кегля (так называемый «квадрат»). Первый абзац после заголовка не требует отступа — он обозначен заголовком. Отступ нужен только для разграничения последующих абзацев.

Правило 8. Пространство до заголовка должно быть больше, чем после

Заголовок визуально «принадлежит» тексту, который следует за ним. Поэтому отступ сверху (от предыдущего блока) должен быть заметно больше, чем отступ снизу (до следующего текста). Это связывает заголовок с содержанием и разрывает его связь с предыдущим блоком.

Правило 9. Используйте горизонтальный ритм как основу

Профессиональная верстка опирается на единицу базовой сетки — как правило, равную интерлиньяжу основного текста. Все вертикальные отступы кратны этой единице. Это создаёт тот «спокойный ритм», который ощущается при чтении качественного издания, даже если читатель не может его сформулировать.

Правило 10. Проверяйте иерархию в серых тонах

Конвертируйте страницу в grayscale и проверьте: видна ли иерархия без цвета? Если структура страницы распадается при отсутствии хроматических различий — иерархия построена ненадёжно. Цвет может усиливать иерархию, но не должен её создавать.

Применение этих десяти правил не гарантирует «красивой» верстки — вкусовые предпочтения слишком контекстуальны, чтобы поддаваться универсальным рецептам. Но они гарантируют функциональную верстку: текст будет восприниматься без ненужного сопротивления, читатель сможет сосредоточиться на содержании, а не на форме. Именно это и является целью профессиональной типографики.