Структура
Детальная страница строится по той же схеме, что и обычный лендинг: включает в себя несколько контентных блоков, описывает преимущества и особенности продукта. Примеры таких страниц — лендинги для банковских карт.
Верхний блок
Верхний блок состоит из ключевого изображения, заголовка, текста и кнопки.
Информационные блоки
В информационных блоках рекомендуется выделять от 3 до 5 пунктов, либо описывать основное преимущество/идею в одном пункте.
Изображения
Фотореалистичные изображения
В верхнем блоке размещается изображение рекламируемого объекта, key visual или иллюстрация. Пример с банковскими картами:
Иллюстрации
В блоках предпочтительно использовать иллюстрации в фирменном стиле QIWI — оранжевые с заливкой.
Белый | #FFF | |
Оранжевый | #FF8C00 | |
Темно-оранжевый | #FF7700 | |
Желтый | #FFB800 | |
Серый | #F5F5F5 |
Фон
Для фона заглавного слайда лучше использовать фирменные цвета. Цвет подложки для остальных блоков рекомендуем чередовать: #FFF, #F5F5F5.
Кнопки
Рекомендуется использовать кнопку Brand Button Accent. Оранжевая кнопка применяется с градиентом и тенью. На цветном фоне допустимо использовать Simple Button в размере Accent. Подробнее о Brand Button.
Типографика
Размеры и отступы
Шрифт | Шрифт Museo Sans | Размер текста, px | Высота строки, px |
Заголовок | 900 | 48 | 56 |
Заголовок раздела | 700 | 42 | 52 |
Заголовок подраздела | 700 | 26 | 28 |
Основной текст | 300 | 20 | 24 |
Цвета заголовков
Черный | #000 | |
Белый | #FFF | |
Оранжевый | #FF8C00 |
Меню-аккордеон
Описание меню-аккордеона можно найти здесь.