2. Подготовка баннера

advertisement
Технические требования для баннеров 300х250
Flash баннер
1. Карточка баннера
Номер: 15H032.
Краткое описание: обычный flash-баннер.
Тип кода: фреймовый, poster, ajax, javascript, extension, редирект.
Примеры: SimpleFlash на коде ajax, SimpleFlash на фреймовом коде.
Обсчёт внешними системами: пиксель-аудит в flash-баннерах.
Техническое описание: Flash-баннеры привлекают внимание посетителей сайта, имеют оригинальный
дизайн и качественную анимацию, при этом могут быть разного размера. Для создания насыщенных
анимацией и графикой баннеров, как нельзя лучше подходит технология Flash.
Рекомендуется использовать код вызова poster только в случае необходимости показывать баннер при
доскролле до баннерного места, так как данная технология задерживает загрузку баннера до окончания
загрузки основной страницы. В остальных случаях рекомендуется использовать код вызова extension.
2. Подготовка баннера
Подготовьте два варианта flash-баннера: flash-ролик (.swf) и заглушку .gif или .jpeg, чтобы демонстрировать
её тем посетителям сайта, у которых нет необходимой версии flash-плагина.
При создании flash-ролика в первом кадре пропишите следующие команды:
if(ar_init == undefined){
ar_init = true;
System.security.allowDomain('*');
}
System.security.allowDomain('*') разрешает доступ загрузчику к переменным баннера и позволяет правильно
инициализировать переменную для клика (link1). При этом в загрузчике не нужно специально разрешать
доступ для загружаемых роликов.
Для того, чтобы зарегистрировать событие «клик» создайте элемент button (при наведении курсора мыши
на такой элемент, он изменяется). Для того, чтобы перейти по клику используется функция getURL. Ей
передаётся два параметра: куда переходить — переменная link1 и _blank — значение переменной target,
чтобы открывать ссылку баннера в новом окне.
В вашем flash-ролике сделайте элемент button. Для этого элемента напишите следующий код:
on (release) {
getURL(_root.link1, "_blank");
}
Обязательно используйте переменную link1 для подсчёта кликов.
Для того, чтобы открывать ссылку баннера в том же окне, укажите во flash-ролике _top.
Если вы, как рекламная площадка, используете AdRiver в качестве основной системы управления рекламой
на сайте, то в flash-ролике пропишите скрипт:
on (release) {
getURL(_root.link1, _root.target);
}
Это позволит открывать ссылку баннера согласно тому параметру, который указан в коде рекламного места.
Элементов типа button может быть несколько. В зависимости от того, на какой из элементов кликнули,
посетитель может быть направлен на разные адреса. В этом случае вы можете явно указать, на какой адрес
должен быть направлен посетитель. Обязательно кодируйте адрес функцией escape().
Например:
on (release) {
getURL(_root.link1+escape("http://alternative.url.to.go/path?search#hash"),_root.target);
}
Вместе с баннером в AdRiver могут быть загружены дополнительные части (flv, swf, xml-файлы). Для этого в
форме загрузки баннера есть специальное поле Дополнительная компонента. Чтобы подгружать в flashролик дополнительные части, загруженные в баннер, необходимо дописать к
перeменной _root.ar_comppath имя подгружаемого компонента.
Получить доступ к загруженному файлу из flash-ролика можно следующим образом:
_root.ar_comppath + 'имя загруженного файла'
Если загружен swf-файл, то его для подгрузки во flash-ролик можно использовать код вида.
Пример:
on (release){
loadMovieNum(_root.ar_comppath + 'имя загруженного файла', 500);
}
Если загружен xml-файл, то для его подгрузки во flash-ролик можно использовать код вида.
Пример:
myXML = new XML();
myXML.load(_root.ar_comppath + 'имя загруженного файла');
Если загружен flv-файл, то для его подгрузки можно использовать FLVPlayBack или Netstream.
Пример 1:
var nс:NetConnection = new NetConnection();
nс.connect(null);
var ns:NetStream = new NetStream(nс);
videoContainer.attachVideo(ns); //videoContainer - это объект, который позволяет воспроизводить
видеофайлы во flash-ролике
ns.play(_root.ar_comppath + 'имя загруженного файла');
Пример 2:
var myVideo:FLVPlayback = new FLVPlayback();
myVideo.source = _root.ar_comppath + 'имя загруженного файла';
2.1 Баннеры, сделанные в ActionScript 3
В ActionScript 3 для элемента button пропишите следующий скрипт:
function callLink(event:MouseEvent):void {
var url:String = LoaderInfo(this.root.loaderInfo).parameters['link1'];
try {
var ie:String = ExternalInterface.call("function(){return !!window.ActiveXObject}");
if (ie == "true") ExternalInterface.call('window.open',url);
else navigateToURL(new URLRequest(url), '_blank');
}catch (e:Error){
navigateToURL(new URLRequest(url), '_blank');
}
}
click_btn.addEventListener(MouseEvent.CLICK, callLink);
Размер загружаемых файлов должен соответствовать спецификации.
Если элементов типа button несколько, то посетитель может быть направлен на разные адреса в
зависимости от того, на какой из элементов кликнули. В этом случае вы можете явно указать, на какой адрес
должен быть направлен посетитель. Обязательно кодируйте адрес функцией escape().
Пример кода на ActionScript3:
function callLink(event:MouseEvent):void {
var url:String = LoaderInfo(this.root.loaderInfo).parameters['link1'];
var alt_url= escape("http://alternative.url.to.go/path?search#hash");
try {
var ie:String = ExternalInterface.call("function(){return !!window.ActiveXObject}");
if (ie == "true") ExternalInterface.call('window.open',url+alt_url);
else navigateToURL(new URLRequest(url+alt_url), '_blank');
}catch (e:Error){
navigateToURL(new URLRequest(url+alt_url), '_blank');
}
}
click_btn.addEventListener(MouseEvent.CLICK, callLink);
2.2. Прошивка кнопки на клик для учёта кликов одновременно в AdRiver и сторонней системе
В коде вызова баннера в параметре pass укажите ссылку на сторонний счетчик для учёта кликов.
Для элемента button в flash-ролике пропишите следующий скрипт:
on(release){
if (_root.ar_pass){
var temp_mc = _root.createEmptyMovieClip("temp_mc", _root.getNextHighestDepth());
temp_mc._x = -10000;
var mcLoader = new MovieClipLoader();
mcLoader.addListener({onLoadInit:function(mc:MovieClip){
mcLoader.unloadClip(mc);
}});
mcLoader.loadClip(_root.ar_pass, temp_mc);
}
getURL(_root.link1, _root.target)
}
В ActionScript 3 для элемента button пропишите следующий скрипт:
function callLink(event:MouseEvent):void {
var pass:String = LoaderInfo(this.root.loaderInfo).parameters['ar_pass'];
if(pass&&pass!="undefined") (new Loader()).load(new URLRequest(pass));
var url:String = LoaderInfo(this.root.loaderInfo).parameters['link1'];
try {
var ie:String = ExternalInterface.call("function(){return !!window.ActiveXObject}");
if (ie == "true") ExternalInterface.call('window.open',url);
else navigateToURL(new URLRequest(url), '_blank');
}catch (e:Error){
navigateToURL(new URLRequest(url), '_blank');
}
}
click_btn.addEventListener(MouseEvent.CLICK, callLink);
3. Загрузка flash-баннера на коде ajax





Подготовьте баннер согласно п. 2 инструкции.
Добавьте баннер special--->special--->Flash-AjaxJS.
Кликните по ссылке Загрузить баннер.
Загрузите flash-ролик и заглушку, укажите размеры и необходимые параметры.
Нажмите на кнопку Загрузить.
4. Полезные ссылки





Подсчет наведений на баннеры.
Учёт дополнительных событий в баннере.
Типы кодов в AdRiver.
Баннер FlashPoster.
Приложение для подготовки баннеров согласно тех. требованиям AdRiver
5. Проверка простых flash-роликов на соответствие техническим требованиям
Flash banner validator.
6. Ограничения на размер загружаемых файлов в системе AdRiver




для обычных графических файлов (в интерфейсе обозначены img width x height) — 200 Кб;
для swf-файлов (в интерфейсе обозначены flash width x height) — 200 Кб;
другие типы файлов — 200 Кб;
для многокомпонентных баннеров ограничения проверяются отдельно для каждой составляющей.
Дополнительное увеличение размеров загружаемых баннеров согласовывается с коммерческим отделом и
службой технической поддержки.
Технические требования для баннеров 100х90
TopLine
1. Карточка баннера
Номер: 02H019.
Краткое описание: растягивающийся баннер вверху страницы.
Тип кода: poster, ajax, extension.
Примеры: TopLine на коде ajax, TopLine на коде poster, TopLine с отдельными элементами на коде
extension, TopLine с растягивающимся flash-роликом на коде extension.
Обсчёт внешними системами: пиксель-аудит в flash-баннерах.
Техническое описание: баннер вверху страницы, занимающий всю ширину окна или сайта, вне зависимости
от разрешения экрана пользователя и размера окна.
Другие названия формата: перетяжка.
Рекомендуется использовать код вызова poster только в случае необходимости показывать баннер при
доскролле до баннерного места, так как данная технология задерживает загрузку баннера до окончания
загрузки основной страницы. В остальных случаях рекомендуется использовать код вызова extension.
2. Подготовка баннера
2.1. Flash-ролик для TopLine на всех кодах
В первом кадре flash-ролика пропишите следующие команды:
if(ar_init == undefined){
ar_init = true;
System.security.allowDomain(_parent._url);
}
System.security.allowDomain(_parent._url) разрешает доступ загрузчику к переменным баннера и позволяет
правильно инициализировать переменную для клика (link1). При этом в загрузчике не нужно специально
разрешать доступ для загружаемых роликов.
Для того, чтобы зарегистрировать событие «клик» создайте элемент button (при наведении курсора мыши
на такой элемент, он изменяется). Для того, чтобы перейти по клику используется функция getURL. Ей
передаётся два параметра: куда переходить — переменная link1 и _blank — значение переменной target,
чтобы открывать ссылку баннера в новом окне.
В вашем flash-ролике сделайте элемент button. Для этого элемента напишите следующий код:
on (release) {
getURL(_root.link1, "_blank");
}
Обязательно используйте переменную link1 для подсчёта кликов.
Для того, чтобы открывать ссылку баннера в том же окне, укажите во flash-ролике _top.
Если вы, как рекламная площадка, используете AdRiver в качестве основной системы управления рекламой
на сайте, то в flash-ролике пропишите скрипт:
on (release) {
getURL(_root.link1, _root.target);
}
Это позволит открывать ссылку баннера согласно тому параметру, который указан в коде рекламного места.
Размер загружаемых файлов должен соответствовать спецификации.
Если вы хотите подгружать в flash-ролик дополнительные части, загруженные в баннер, то надо дописать к
перeменной _root.ar_comppath имя подгружаемого компонента.
Например:
_root.ar_comppath + 'flash_name.swf'
2.2. TopLine на коде Extension
TopLine на коде extension может быть двух видов:


TopLine с растягивающимся flash-роликом. Flash-ролик позиционно занимает всю ширину
окна браузера или дизайна сайта. И при изменении размеров окна растягивается или сжимается.
TopLine с отдельными элементами:
o средняя часть баннера — flash-ролик определённого размера;
o правая и/или левая растягивающиеся части для flash-ролика (.swf);
Размеры растягивающихся частей:
o
o
если однотонные, то высота и ширина — 1x1 px;
если используется градиент или цвета меняются по высоте, то ширина — 1px, высота равна
высоте баннера.
При загрузке баннера TopLine с растягивающимся flash-роликом укажите следующие данные:


в поле ширина укажите значение, равное 100%;
в поле высота укажите высоту вашего flash-ролика.
3. Загрузка баннера
3.1. Загрузка баннера на коде Ajax
1.
Подготовьте баннер согласно п. 2.1 инструкции.
2.
Добавьте баннер special--->special--->Flash-AjaxJS.
3.
Укажите ссылку на сайт рекламодателя в поле Линк Баннера. При необходимости укажите другие
параметры.
4.
Нажмите на кнопку Добавить баннер. Вы попадете на страницу редактирования параметров
баннера.
5.
Включите баннер, укажите нужные настройки. Для сохранения введенных настроек нажмите на
кнопку Сохранить.
6.
Кликните по ссылке Загрузить баннер.
7.
Загрузите flash-ролик и заглушку. Для баннера TopLine укажите ширину — 100%. При
необходимости укажите другие параметры.
8.
Нажмите на кнопку Загрузить.
3.2. Загрузка баннера на коде Poster
1.
Подготовьте баннер согласно п. 2.1 инструкции.
2.
Добавьте баннера типа special->poster->topline.
3.
Укажите ссылку на сайт рекламодателя в поле Линк Баннера. При необходимости укажите другие
параметры.
4.
Нажмите на кнопку Добавить баннер. Вы попадете на страницу редактирования параметров
баннера.
5.
Включите баннер, укажите нужные настройки. Для сохранения введенных настроек нажмите на
кнопку Сохранить.
6.
Кликните по ссылке Загрузить баннер.
7.
Загрузите flash-ролик и заглушку. Для баннера TopLine укажите ширину — 100%. При
необходимости укажите другие параметры.
8.
Нажмите на кнопку Загрузить.
3.3. Загрузка баннера на коде Extension
1.
Подготовьте баннер согласно п. 2.1 инструкции.
2.
Добавьте баннера типа special->extension->topline.
3.
Укажите ссылку на сайт рекламодателя в поле Линк Баннера. При необходимости укажите другие
параметры.
4.
Нажмите на кнопку Добавить баннер. Вы попадете на страницу редактирования параметров
баннера.
5.
Включите баннер, укажите нужные настройки. Для сохранения введенных настроек нажмите на
кнопку Сохранить.
6.
Кликните по ссылке Загрузить баннер.
7.
Загрузите flash-ролик и заглушку. Для баннера TopLine укажите ширину — 100%. При
необходимости укажите другие параметры.
8.
Нажмите на кнопку Загрузить.
4. Как обеспечить учёт через стороннюю систему
4.1. Обеспечить демонстрацию баннера через Location сторонней системы
Компоненты баннера располагаются в сторонней системе и flash-ролик сделан по специальным
требованиям для передачи сторонней системе. В этом случае баннер TopLine загружается как GenericExtension, или GenericPoster.
Сторонняя система предоставляет следующие данные, которые необходимо указать при редактировании
скрипта и загрузке баннера:




ссылку на показ для flash-ролика впишите как значение переменной ar_swf;
ссылку на клик по flash-ролику впишите в поле Линк Баннера при добавлении баннера;
ссылку на показ для заглушки впишите как значение переменной ar_gif;
ссылку на клик по заглушке впишите как значение переменной ar_img_click.
4.2. Обеспечить аудит пиксель-аудитом сторонней системы
Компоненты баннера располагаются в системе AdRiver. В этом случае баннер TopLine загружается как
стандартный на коде extension.
Если необходимо обеспечить аудит показов/кликов в системе AdRiver пиксель-аудитом сторонней системы,
то при добавлении в AdRiver flash-ролика и заглушки укажите следующие данные:



впишите ссылку сторонней системы на клик по flash-ролику в поле Линк Баннера;
впишите ссылку сторонней системы на клик по заглушке в поле Альтернативный клик на
заглушку. Если не нужен, оставьте пустым;
впишите ссылку сторонней системы на показ пикселя в поле Вызов стороннего счётчика.
Сторонняя система должна обеспечить корректный переход на сайт рекламодателя.
4.3. Загрузка кода сторонней системы со специальным скриптом
Этот вариант подходит только для обычных баннеров, которые не выходят за свои границы.
Компоненты баннера располагаются в сторонней системе. Сторонняя система предоставляет код баннера.

Распакуйте пример. Откройте текстовым редактором файл script.js. Внесите изменения только в
верхнюю часть скрипта, отмеченную как editable block.



//Last edited 19.07.2009 by Alexandr Zonov
var ar_width = '100%';
var ar_height = '60';
Переменные:







o ar_width — ширина баннера. Рекомендуем оставить значение по умолчанию — 100%;
o ar_height — высота баннера. Впишите ваш размер.
Создайте файл следующего содержания и назовите его index.html:
<html>
<body topmargin="0" leftmargin="0" marginwidth="0" marginheight="0">
<!-- Сюда поместите присланный вам код -->
</body>
</html>

Добавьте в AdRiver баннер Generic-Extension, или GenericPoster и загрузите файлы index.html и
script.js.
5. Ограничения на размер загружаемых файлов в системе AdRiver




для обычных графических файлов (в интерфейсе обозначены img width x height) — 200 Кб;
для swf-файлов (в интерфейсе обозначены flash width x height) — 200 Кб;
другие типы файлов — 200 Кб;
для многокомпонентных баннеров ограничения проверяются отдельно для каждой составляющей.
Дополнительное увеличение размеров загружаемых баннеров согласовывается с коммерческим
отделом и службой технической поддержки.
6. Полезные ссылки




Типы кодов в AdRiver.
Expandable.
ExpandableMove
Приложение для подготовки баннеров согласно тех. требованиям AdRiver
Download