Игорь Штанг (nobelfaik) wrote,
Игорь Штанг
nobelfaik

Category:

Колоночность и этажность

Собираете вы, например, макет, а он у вас никак не собирается. Элементы друг к другу не клеятся, кругом дыры:

01.jpg
Фото: getolympus / flickr


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

Наш макет ни то ни се. Если представить, что он колоночный, то текст вылезает из своей колонки, а картинка уезжает из своей. Такой схеме он явно не соответствует:

01.jpg


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

01.jpg


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




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

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




То, что в итоге получится, будет модульной схемой макета (не путать с сеткой).

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





Можно, например, развернуть заголовок и фото, но именно с этими элементами получается не очень:




В таких случаях, чтобы добиться приемлемого результата, приходится насиловать материал. Заголовок я поставил вертикально, картинку сильно кадрировал. Ничего страшного в этом нет, просто где-то так получится сделать, а где-то не получится. Вариант неуниверсальный и непростой:




Удобнее разделить на этажи:




Сверху вышел унылый слоеный пирог: все строчки длинные и друг за другом. Если заверстать текст колонками, появится горизонтальный ритм:




Так еще ритмичнее:




Модульная схема:




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




Еще про модульность:
Три способа закрыть прямоугольник
Переверстка №9. Инфографика для YouMagic
Tags: афиша, верстка, знаю как, иллюстрация, колонка, композиция, конструкция, модульность, статья, типографика
Subscribe

Posts from This Journal “статья” Tag

  • Тире или буллит

    В эфире рубрика ???. Мария спрашивает: Какие маркеры ставить в списках на русском языке: тире или буллиты? Вопрос непростой, поэтому начну…

  • Картинка без модуля

    Продолжаю серию статей про неудачные приемы верстки. Сегодня о том, как не надо ставить иллюстрации. (Прошлые выпуски собрал под одним тегом.)…

  • Швейцарские плакаты по-русски

    Недавно я опубликовал заметку под названием « Кириллица и латиница». Главная мысль такая: Несовершенство кириллического алфавита не…

  • Post a new comment

    Error

    default userpic

    Your IP address will be recorded 

    When you submit the form an invisible reCAPTCHA check will be performed.
    You must follow the Privacy Policy and Google Terms of use.
  • 2 comments