Автор: Игорь Штанг

Графический и веб-дизайнер, лингвист, фотограф, путешественник. Работал в издательской группе «Парамон» и Дизайн-бюро Артема Горбунова. Автор курса «Типографика и верстка».

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

В бумажных газетах каждый кусочек текста аккуратно упакован в свой прямоугольник. Материалы стоят вплотную друг к другу, воздух практически отсутствует:

Передовица газеты Washington Post

По этому же принципу строятся электронные издания:

Передовица gazeta.ru

Текст главной новости лег не лучшим образом (правый верхний и правый нижний углы пустуют), однако форму материала обозначают границы соседних модулей: плашка сверху, реклама справа, текстовые блоки снизу и слева:

Ряд колонок также не собрался в ровный прямоугольник, но нижнюю границу этажа закрывает верхняя строчка следующего:

Здесь эту же функцию выполняет линейка:

С газетами понятно, но что делать, если вы не хотите забивать всё свободное пространство прямоугольниками текста и иллюстраций? Для этого существуют другие способы закрыть модуль.

1. Взять в рамку или поставить на плашку

Способ простой и безотказный: рамка и плашка замыкают блок, независимо от расположения входящих в него элементов:

Сайт glavbukh.ru

Сайт mrporter.com

Форма логотипа непредсказуема, поэтому каждый модуль обвели рамкой (она тонкая и серая, чтобы не отвлекать внимание):

Сайт megamall.ru

Для решения этой задачи подойдут и линейки:

Афиша городского театра в Цюрихе. Йозеф Мюллер-Брокманн, 1960

Иногда рамка — единственное спасение слабой верстки. Было и стало:

Не стоит забывать, что рамка и плашка — сильные графические средства, поэтому с ними нужно быть осторожнее. Если выделить одновременно всё, то смысл выделения пропадет, а уровень шума в макете превысит уровень сигнала:

Рекламная полоса начала 20 века

2. Закрепить углы

В журналах по углам традиционно размещают колонцифры и колонтитулы. Какой бы свободной ни была композиция разворота, формат всегда поддержан угловыми элементами:

Журнал Yachts

Журнал «Твой формат»

Крохотная колонцифра держит весь правый нижний угол:

Этим же приемом пользуются и веб-дизайнеры. Углы сайта закрепляют логотипом, иконкой, кнопкой, строчкой текста, полем поиска…
Сверху:

И снизу:

Еще примеры:

Сайт readymag.com

3. Коснуться каждой из сторон

Здесь три из четырех углов пустуют, при этом композиция очень устойчивая:

Рекламный макет компании Norm. Карл Бернард Граф, 1963

Секрет в том, что элементы макета касаются каждой из его сторон. Справа и снизу — границ формата, слева и сверху — внутренних полей:

Еще примеры:

Обложка журнала Typographische Monatsblätter. Ив Циммерманн, 1958

Сайт bestmadeco.com

Плакат Juni-Festwochen. Йозеф Мюллер-Брокманн, 1966

Беспорядок у Чихольда – кажущийся. Конструкция крепко держит формат:

Ян Чихольд, 1927

Особняком стоят центрированные композиции. Масса, собранная в центре, уравновешивает себя самостоятельно, без поддержки углов и сторон:

Журнал Sometimes

Зигфрид Одерматт, 1959–1960

 


Подписывайтесь на «Дизайнерский дайджест». Это еженедельная рассылка главного редактора с лучшими ссылками для графических дизайнеров.
  • Dinar Frescø

    Спасибо за настоящую полезность! Ждем еще подобных материалов!

  • Я всегда избегал рамок, как лишний шум. А оказывается они могут быть на пользу.

    • Игорь Штанг

      Висилий, у меня тоже с ними долгое время были неоднозначные отношения) Пока я не разобрался в теме.

  • Stas Flamyng

    Где на сайте кнопка подняться на верх???

  • Dok

    Интересно, спасибо!

  • Максим Мильгаузен

    Прочитал на одном дыхании, много интересного подчеркнул. Спасибо!)

  • Julia Wein

    красиво, мудро, полезно )) спасибо! очень хороший пост.

О пользователе Игорь Штанг

Графический и веб-дизайнер, лингвист, фотограф, путешественник. Работал в издательской группе «Парамон» и Дизайн-бюро Артема Горбунова. Автор курса «Типографика и верстка».

Рубрики

Инструкция, Обучение, Статьи, Типографика

Метки

,