Техническое задание на разработку баннеров

Для рекламных баннеров обязательными условиями являются:

1. Фон баннера не должен быть прозрачным.

2. Рекламный баннер должен иметь видимые границы (обведен в рамку, не совпадающую с цветом фона баннера). Для баннера на мобильной версии ширина рамки не должна превышать 1 px.; цвет рамки должен быть применен с прозрачностью не менее 50%

3. На баннере должна быть указана возрастная категория.

4. Текст не должен занимать более 20% от площади картинки.

5. Баннер должен весить не более 120кб.
ТЗ по статичным баннерам (контекст)

Для контекста составляется 2 вида баннеров – рекламные (отображается только сам баннер) и адаптивные (размещаются рядом с панелью текста).
Размеры рекламных баннеров:
728х90
240х400
336х280
300х600
160х600
640х960
960х640
300х250
640х100
970х250
300х500
1200х628
1080х1080
1080х607

!!! Обратите внимание: если вы делаете баннеры в Иллюстраторе, проверяйте
их на наличие зоны обрезки – ОНА НЕ НУЖНА.
Очень часто дизайнеры присылают баннеры с 1 пикселем отступа от нужного
размера, мы их не сможем прогрузить, а вам придется их переделать, не
создавайте себе двойной работы.

Строго рекомендуем:

1. На баннере должен быть призыв к действию(или кнопка с призывом): купить/узнать/посетить и т.д.

2. Контрастный фону цвет текста, читаемый при уменьшении картинки на 50%

3. Задача баннера не максимально рассказать о продукте, а привлечь первичное внимание, заинтересовать и ЗАИНТРИГОВАТЬ, заставив перейти на сайт.

4. Яркая, привлекательная картинка.


FAQ по созданию креативов\афиш, которые вы передаете нам на создание
ресайзов:

1) Креативы присылаются файлом .psd
2) Креатив должен иметь размер 1200x1200 (если креатива нет и вы
предоставляете просто имеющийся материал, его размеры не должны быть
менее 900 пикселей в ширину/длину)
3) Используемые в афишах шрифты присылаются отдельным файлом,
желательно формата .ttf, но также подойдут и другие форматы: .otf, .svg и т.д.

Условия создания адаптивных баннеров:

1. Должны быть видимые границы (рамка) - минимум 1 пиксель шириной с прозрачностью 50%

2. Картинка не должна содержать текст.

3. Отцентрованное изображение: объект фокуса по центру (адаптивные баннеры часто обрезаются на площадке показа).

4. На баннере должна быть указана возрастная категория.

5. Баннер должен весить не более 10мб.

6. Если вы хотите разместить логотип компании, присылайте его отдельным файлом в формате .png


Размеры адаптивных баннеров:
1080х607
1080х1080

Формат: jpg
Внимание!

Учитывайте возможность обрезания краев баннера (адаптивные баннеры обрезаются под размер рекламных площадей) и старайтесь умещать текстовые элементы в «безопасную» зону (цветная часть картинки). Безопасная зона – это 75% величины картинки, которая равномерно обрезана с каждой стороны ( т.е. 25% картинки по ширине и высоте «съедается»)

Как высчитать обрезаемую зону?

Ширина или длина баннера/100*25/2
ТЗ по статичным баннерам (таргет)

Баннеры для таргета – это баннеры для размещения рекламы в соц сетях.

Рекомендации:

Яркий, привлекающий внимание баннер
Минимальное содержание текста
Размеры баннеров:
1080х1080
1080х1920
537х240
400х400
145х85
145х165
145х145
1200х628
1080х1920

Формат: jpg, png
ТЗ по анимированным баннерам (HTML5 и GIF)
Рекомендации:

1. Не принимаются баннеры с мигающими крупными графическими или текстовыми элементами и/или фоном, с резкими перемещениями элементов, существенно отвлекающие пользователя от взаимодействия со страницей сайта (изучения содержания страницы или ввода запроса).
2. Баннер должен содержать информацию и картинки имеющие прямое отношение к рекламируемому событию.
3. Баннер должен содержать возрастную маркировку.
4. Размер баннеров не должен превышать 150кб в архиве zip.
Размеры баннеров:
200х200
200х300
240х400
300х250
300х600
336х280
728х90
970х90
970х250
500х500

Формат: Html5, Gif
Обязательные строки для кода в баннерах html 5:

1) После строк <!-- write your code here --> и </head> добавляем:
<meta name="ad.size" content="width=240,height=400">
2) Для яндекса, после строки </body> добавляем:
<a id="click1_area"тут должна быть ссылка на нужный сайт" target="_blank">...</a>
<a id="click2_area" тут должна быть ссылка на нужный сайт " target="_blank">...</a>
<script>
document.getElementById("click1_area").href =
yandexHTML5BannerApi.getClickURLNum(1);
document.getElementById("click2_area").href =
yandexHTML5BannerApi.getClickURLNum(2);
</script>

3) У баннеров не должно быть ссылок на внешние ресурсы (просмотрите код на
наличие внешних ссылок), в случае, если они есть - убираем в настройках
экспорта галочку с Hosted libraries
4) Если вы работаете через иллюстратор: Яндекса нужны спрайты ( единный
лист с картинками), который в Аниматоре создается путем выделения всех
объектов библиотеки, правая кнопка мыши и "Generate Sprite Sheet" либо через
настройки Publish>Spritesheet и ставим галочку около Combine image assets into
spritesheet

Что нужно учитывать на картинках:

1) У Яндекса и Гугла в правом верхнем углу на баннер устанавливается
кнопка «закрыть», поэтому на баннерах нужно оставлять этот угол пустым
2) На всех баннерах для рекламы обязательно должна присутствовать
возрастная категория