Оформление баннеров для мобильной версии
На странице представлены рекомендации по оформлению баннера. Обратите внимание, что иллюстрации в уменьшенном размере.
Шрифт
- Высота шрифта на баннере должна быть не больше:
70 пикселей, если текст занимает не больше 10% баннера;
52 пикселя, если текст занимает не больше 15% баннера;
44 пикселя, если текст занимает не больше 25% баннера;
32 пикселя, если текст написан в одну строку;
- 20 пикселей, если текст написан в две строки;
- 15 пикселей, если текст написан в три строки.
- Минимальный размер шрифта для логотипов, сообщений, иллюстраций, предупреждений — 11 пикселей. Исключение — фотографии упаковок и товаров, а также снимки экранов.
Расположение текста и элементов баннера
Расстояние от края баннера до текста должно быть не меньше 10 пикселей. Текст и элементы баннера не должны располагаться в сейфзонах.
Размер сейфзон:
- метка — 60 × 20;
- три точки — 42 × 42.
Размер логотипа
Логотип бренда, продукта или технологии должен занимать не больше 28% площади баннера.
Пример хорошего баннера в увеличенном виде:
Цвет фона
- Текст на слишком пестром фоне с мелкими элементами. Текст должен быть контрастным по отношению к фону и легко читаемым.
- Желтый фон, так как этот цвет применяется для стандартных элементов дизайна страниц Яндекса. Допустимый желтый цвет — #F0E5AD и светлее.
Длительность анимации
Баннер или его отдельные элементы не должны мигать, отвлекая пользователя.
Допустимая частота смены элементов на баннере — не чаще 1 раза в 2 секунды.
На стоп-кадре баннер должен отображать основную информацию рекламного сообщения.
Читаемость обязательной информации
Обязательная правовая информация (например, название банка и ОПФ, сроки акции и т. д.) должна быть четко видна сразу, без взаимодействия пользователя с баннером. Подробнее смотрите в дополнительных рекомендациях.
Пример хорошего баннера в увеличенном виде:
Элементы интерфейса на баннере
- Баннер не должен маскироваться под элементы пользовательского интерфейса — например, под системное окно Windows.
- Баннер не должен содержать стандартные элементы пользовательского интерфейса (курсор, поисковая строка, различные кнопки и т. п.), которые не выполняют соответствующие функции.
- Не следует использовать желтый в элементах интерфейса, так как этот цвет применяется для стандартных элементов дизайна страниц Яндекса. Допустимый желтый цвет — #F0E5AD и светлее.
Возрастное ограничение
Если на баннере необходимо возрастное ограничение, то:
- Рекомендуем размещать в правом нижнем углу баннера.
- Шрифт — Arial Regular, 12 пунктов.
- Цвет — #DADADA.Примечание.
Если ограничение серого цвета не читается, например из-за пестрого фона, его следует разместить на белой подложке.
Кнопка/бейдж магазина приложений
- Максимальные размеры кнопки или бейджа: высота — 50 пикселей, ширина — 150 пикселей.
- Не рекомендуется делать кнопку или бейдж желтыми, так как этот цвет используется для стандартных элементов дизайна страниц Яндекса. Допустимый желтый цвет — #F0E5AD и светлее.
- Расстояние от края баннера до кнопки должно быть не меньше 10 пикселей.
- К бейджу магазина приложений предъявляются такие же требования, как к логотипам.