Содержание · 7
Шесть способов задать иерархию помимо размера: вес, регистр, цвет, положение, интерлиньяж и гарнитура. И правило, сколько уровней допустимо.
Размер — не единственный инструмент
Начинающие задают иерархию исключительно кеглем, из-за чего появляется пять-шесть уровней размеров, отличающихся на пару пикселей и потому неразличимых.
На самом деле инструментов шесть, и комбинация двух-трёх даёт более отчётливую иерархию, чем шкала из шести размеров.
Три уровня достаточно
Практическое ограничение: читатель уверенно различает три уровня иерархии на одном экране. Четвёртый и пятый воспринимаются как шум.
Если материал требует большего, это признак того, что его нужно разбить на страницы или разделы, а не добавлять уровни.
Контраст должен быть заметным
Соседние уровни шкалы должны отличаться минимум на 25–30%. Разница в 2–3 пикселя между H3 и H4 не читается как иерархия — она читается как ошибка.
Отсюда практика типографических шкал с фиксированным коэффициентом: она гарантирует достаточную разницу между уровнями.
Метаданные и подписи
Служебная информация — дата, автор, рубрика, время чтения — не должна конкурировать с содержанием. Она обычно набирается мелким кеглем, прописными с положительным трекингом и приглушённым цветом.
Это отдельный уровень, который существует параллельно основной иерархии и не входит в счёт трёх уровней.
Иерархия строится разрывом, а не размером. Два уровня, отличающиеся на один пункт, — это один уровень с опечаткой.
Сколько ступеней различает глаз
Иерархия работает не количеством уровней, а различимостью соседних. Разница в кегле меньше пятнадцати процентов читается как случайность набора, а не как замысел: два заголовка 20 и 22 пункта воспринимаются одинаковыми, и читатель не понимает, какой из них старше.
Отсюда практическое правило шкалы: соседние ступени должны отличаться не менее чем в 1,2 раза, а лучше в 1,25–1,5. Тогда трёх ступеней хватает на любой материал, а различие видно без сравнения рядом.
Unbounded
Etcetera Type Company · OFLПЕРВЫЙ УРОВЕНЬ
АБВГДЕЁЖЗИЙКЛМНОПРСТУФХЦЧШЩЪЫЬЭЮЯ 0123456789
Golos Text
Paratype · OFLВторой уровень — и разрыв виден без цифр
АБВГДЕЁЖЗИЙКЛМНОПРСТУФХЦЧШЩЪЫЬЭЮЯ 0123456789
Чем заменить размер, когда его нельзя менять
В интерфейсах эти средства обычно предпочтительнее размера: шкала кеглей там задана системой, и менять её ради одного экрана нельзя.
- Насыщенность: полужирный рядом с обычным различается сильнее, чем два кегля с разницей в пункт.
- Цвет и светлота: приглушённый серый уводит метаданные на второй план без уменьшения.
- Пространство: пустота над заголовком работает как увеличение кегля, но не занимает высоту.
- Прописные с разрядкой: делают короткую строку служебной, не трогая размер.
- Гарнитура: переход на другой рисунок в одной строке — самый сильный сигнал.
Что в итоге
Иерархия строится не только размером: вес, регистр, положение и гарнитура работают не хуже.
Держите три различимых уровня с контрастом не меньше 25% — и структура текста будет читаться мгновенно.
Коротко
- Сколько уровней иерархии допустимо?
- Три-четыре в тексте и два в заголовочной группе. Каждый следующий уровень должен отличаться заметно — кеглем, начертанием или положением; разница в один-два пункта не читается и создаёт ощущение неаккуратности, а не иерархии.
- Чем задавать иерархию, кроме размера?
- Насыщенностью, цветом, отступом и положением на полосе. Отступ сверху работает не хуже кегля: заголовок, отделённый воздухом, читается как более важный без увеличения размера.
Шрифт в навигации
Требования к шрифту в системах навигации: размер относительно дистанции, контраст, начертание и то, почему в вывесках почти не бывает антикв.ДальшеЧитайте также
Посмотреть примеры
Нашли ошибку или неточность в атрибуции? Напишите нам
Обсуждение
Загружаем…