Продолжаю рассказывать о неудачных приемах верстки. В прошлых выпусках: горки текста, ноги текста и колонки разной ширины. Сегодня про бутерброды.
Бутерброд получается, когда друг под другом встают текстовые блоки с разным оформлением — три, четыре или больше. Обычно это выглядит тяжеловесно и неряшливо. Примеры с курса:
Много маленьких бутербродиков:
Часто многослойные конструкции образуются вокруг заголовка, когда к нему подверстывают дополнительный текст сверху или снизу.
Всплывающее окно на сайте «Уральских авиалиний». Встретились два заголовка, получилось 3 текстовых слоя + кнопки:
Шапка профиля на Пинтересте. Иконки + 4 текстовых слоя + табы. Еще эти точечки:
Анонс статьи на Медиуме. 5 текстовых слоев:
Шапка профиля в Твиттере. Количество слоев и приемов оформления зашкаливает:
Чтобы избавиться от бутерброда, нужно его сокращать и упрощать. Например:
- Убрать один из блоков совсем или переместить в другое место.
- Убрать лишнее оформление, свести к минимуму количество выделительных приемов.
- Объединить несколько блоков в один.
Конечно, бутерброды — это не всегда плохо. Однако подобрать правильное сочетание шрифтов, цветов, кеглей и отступов — непростая задача. Прекрасные бутерброды были в журнале «Афиша-Еда»:
Если так не получается, будьте проще)