Вертикальные иллюстрации

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

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

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

Вот пример плохого модуля:

Поставили вертикальную иллюстрацию и ниже ещё одну. В результате, если у вас вдруг не будет хватать текста, или если соотношение колонок как‑то поменяется и для картинки будет больше места, или если сайт резиновый и картинки будут пропорционально увеличиваться, то будет появляться дыра. То есть модульность нарушится, поэтому так лучше не делать.

А лучше делать как‑нибудь вот так:

Вот ещё один хороший модуль:

Здесь сама вертикальность иллюстрации, её пропорции уравновешиваются с тем, что сбоку есть ещё одна картинка и под ней текст. Но не две картинки друг под другом. Помните, мы с вами говорили, что если начинают ставить вертикальные картинки друг за другом, то с большой степенью вероятности сбоку от них будет появляться дыра. Вертикальные картинки, если их много, лучше ставить сбоку друг от друга.

Наконец, пример студенческой работы:

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