Другие основы вёрстки
Сегодня поднатаскаем новичка правилом якорных объектов.
Другие основы вёрстки
Якорные объекты — это самые заметные объекты на странице: иллюстрации, заголовки, фактоиды, логотипы и пиктограммы. Простой абзац наборного текста тоже выступает якорным объектом, если он окружён пустотой, или контрпространством.
Прямоугольник — базовая фигура модульной вёрстки. Все модули макета должны иметь прямоугольную форму и составлять вместе общий прямоугольник страницы или экрана, которым они ограничены.
Правило гласит, что любой якорный объект должен тяготеть или располагаться в одном из углов или в визуальном центре своего прямоугольника:
Визуальный центр располагается выше геометрического для подсознательной компенсации гравитации
Визуальный центр располагается выше геометрического для подсознательной компенсации гравитации
Каждый из этих прямоугольников годится:
Принцип требует, чтобы привязка к силовой точке была очевидной. Для этого с противоположных сторон от якорного объекта должны быть «воздух» контрпространства либо менее плотные и заметные объекты:
По моим наблюдениям, самая частая ошибка новичка — забыть «антивоздух»:
Обратите внимание, как угловой привязке крупной галочки мешает её собственная форма.
У правого края флагового набора всегда должен быть дополнительный воздух. Тогда «флаг» выглядит флагом — как положено.
В жизни редко приходится верстать страницу из одного объекта. Второстепенные объекты модуля пристраиваются к якорным и иногда даже слегка сдвигают их из точек привязки:
Объекты нанизываются друг на друга, как бусы. Общая конструкция сохранится, если соблюдать принцип модульности, то есть выравнивать объекты друг с другом по ширине и высоте и сохранять прямоугольную форму модулей:
Но якорные объекты всегда выпрыгивают из вёрстки. Если у них не будет точки привязки, макет развалится:
Объект может неожиданно стать якорным, то есть более заметным, не только при увеличении размеров, но и при смене цвета:
Галочка потеряла привязку, а адрес съехал вправо.
Якорный объект может быть привязан не к точке, а к одной из сторон прямоугольника:
Такая привязка выглядит спокойно:
Хорошая вёрстка использует силу углов и сторон формата. На обратной стороне коробок картриджей Т2 якорные объекты активируют верхние углы и нижнюю сторону:
Якорные объекты образуют иерархию: первыми замечают иллюстрации и любые картинки, затем крупные заголовки, далее логотипы, знаки и цифры. Наборный текст — самый нейтральный.
В качестве упражнения предлагаю уважаемым советчикам самостоятельно разобрать принцип якорных объектов на следующих примерах:
P. S. Это был понедельничный совет о вёрстке и типографике в вебе. Хотите знать всё об интерлиньяжах, полях, отступах, кеглях, выравниваниях и модульных сетках? Присылайте вопросы.