Текстовые модули с иллюстрациями

Лекция

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

Модули с иллюстрациями мы встречаем постоянно. Самый простой пример — интернет‑магазин.

В старой версии интернет‑магазина Билайна все карточки товаров — это модули с иллюстрациями. В каждом модуле есть иллюстрация телефона и текст с описанием товара:

Лучше всего иллюстрация чувствует себя над текстом, то есть порядок такой: иллюстрация, заголовок, текст. Так лучше потому, что иллюстрация в данной конфигурации не отрывает заголовок от текста. При этом иллюстрация заметнее всего остального в модуле:

В этом модуле я сначала обращаю внимание на иллюстрацию, потом смотрю на заголовок и читаю текст. Ничто не мешает получить информацию последовательно.

🔒 Запишитесь на курс, чтобы участвовать

Когда в следующий раз откроется запись

Оставьте почту, чтобы узнать, когда будет открыта запись на этот и другие курсы.

Запись на курс 8 ноября — 5 декабря

Студенты дневных и вечерних отделений получают скидку 50 %.

Самостоятельный
участник ~~59 000~~

41 300 ₽

С сб 10 окт 47 200 ₽

Сотрудник компании
или предприниматель ~~79 000~~

55 300 ₽

С сб 10 окт 63 200 ₽

КПД ❔
130 дизайнеру, 96 редактору, 34 руководителю