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