Заголовок, текст, иллюстрация, элемент управления, гиперссылка и подпись — базовые элементы нашего типографского‑верстального «лего». В одних сочетаниях получаются прочные и красивые конструкции, в других — неуклюжие и неустойчивые.
Модульная страница состоит из смысловых блоков. Рассмотрим текстовые блоки без иллюстраций.
Эталонный модуль — это заголовок, который накрывает текст:
Эта конструкция — самая узнаваемая и привычная для читателя.
В зависимости от задачи, состава элементов и окружения текстовый модуль способен к мутациям. Но чем ближе модули к эталонному, тем проще составить из них внятную страницу:
Во всех мутациях по правилу модульности блок должен сохранять прямоугольную форму. Текстовые блоки принимают любые пропорции, но на экране утомительно прокручивать и читать чрезмерно длинные и узкие вертикальные колонки.
Ссылки для продолжения чтения логично встают в конец блока:
Заголовок и главная ссылка могут быть объединены, если это не нарушит единообразие остальных блоков на странице:
Если в блоке нет текста, но есть несколько ссылок, у него есть шанс вытянуться в строку:
Или вовсе редуцироваться до отдельно стоящей ссылки:
Но если важная ссылка смотрится одиноко, можно вспомнить о составных заголовках и добавить ей бирку или подпись:
Крайне нежелательно разрывать заголовок и начало текста. Второстепенные ссылки, подписи, теги, элементы управления и другую мелочёвку лучше отправить в конец, чтобы сохранить логику чтения и «эталонную» форму блока.
Направим мутации эталона в сторону усложнения:
По колонкам становятся и неоднородные элементы:
Даже заголовок может свеситься в одной из колонок:
В такой конфигурации текст ничем не отделён сверху от соседних блоков и рискует «слипнуться» с их текстом. Но на простой странице это смотрится эффектно и «по‑швейцарски»:
Чтобы сложный составной блок сохранял каноническую форму, рекомендуем уменьшать размеры, кегль и повышать дробность элементов сверху вниз:
Правило работает и в малых формах:
И в крупных блоках:
