В Cети все большую популярность получает технология, разработанная компанией Macromedia (www.macromedia.com), - Shockwave Flash, которая идеально подходит для создания веб-сайтов и особенно - интерактивных баннеров. Перед сетевыми дизайнерами открываются совершенно новые творческие возможности. Перед рекламодателями - гораздо более эффективный метод воздействия на целевую аудиторию.

Технология ShockwaveFlash имеет следующие достоинства: - Flash может работать не только с растровой, но и с векторной графикой. Это позволяет создавать впечатляющие анимационные эффекты, такие, как морфинг, масштабирование, работать с различными степенями прозрачности и сложными градиентными заливками. При этом размер файла останется небольшим.
- Flash-баннеры по-настоящему интерактивны. Их элементы могут реагировать на движение мыши, такие баннеры могут содержать различные виды элементов контроля и разнообразные меню. Взаимодействие с пользователем можно программировать - на Flash уже сделано много on-line игр, и даже интернет-магазины.
- Flash-баннеры могут, например, содержать ссылку не на одну страницу (как обычные GIF и Jpg баннеры), а на несколько, и у пользователя есть возможность выбрать конкретную. Можно вставить в такой баннер кнопку с командой "mailto:". По истечении определенного времени или после взаимодействия с пользователем возможна загрузка нового баннера на месте текущего.
- Flash-баннеры работают со звуком, причем здесь есть две возможности.
Первая состоит в том, что отдельные звуковые эффекты (event sound), например, при нажатии интерактивной кнопки на баннере. Или просто короткая фоновая музыка, воспроизводимая циклически. Такие звуки загружаются вместе с баннером.
Вторая возможность - streaming sounds - музыка или звуковые эффекты, подгружаемые с сервера по мере проигрывания их пользователю и синхронизированные с анимацией баннера. В этом случае длина звукового фрагмента не ограничена (данная схема походит на технологию realaudio).
- С помощью устанавливаемой на сервере программы Macromedia Generator имеется возможность динамически менять содержание баннера. Можно заменять текст, картинки, ссылки на URL и пр. у единожды созданного баннера. Это идеально подходит, например, для новостных баннеров, автоматизируя процесс их обновления.

Для воспроизведения Flash-баннера в браузере необходимо установить специальный элемент контроля: ActiveX (для Internet Explorer) или plug-in (для Netscape Navigator). У большинства пользователей сети (имеющих пятые версии браузеров) соответствующие элементы уже установлены. А если нет, то при первом попадании на веб-страницу, содержащую объект ShockwaveFlash, соответствующий элемент ActiveX или plug-in будет автоматически установлен в браузер, причем эта процедура занимает не больше времени, чем загрузка веб-страницы.

Опираясь на вышеизложенное, можно утверждать, что ShockwaveFlash стал наиболее перспективным стандартом для WWW.

Flash-веб-страницы и Flash-баннеры создаются в специальном редакторе, выпущенном Macromedia. Trial Version редактора можно скачать с сервера их компании. С помощью редактора создается промежуточный файл с расширением .fla для внутреннего пользования и редактирования (аналог .psd в Adobe Photoshop). Для использования в Сети данный файл конвертируется в файл с расширением .swf. Кстати, возможна конвертация .fla файла и в другие популярные форматы - avi, анимированный GIF, Java и т.д. Прилагаемая к редактору утилита AfterShock создает фрагмент Html-кода (включающий Java-скрипт), который надо будет добавить в веб-страницу. Он позволит загружать соответствующие .swf файлы и автоматически устанавливать Shockwave Flash в браузеры, где он отсутствует.

Html-баннеры, использующие для взаимодействия с пользователем как непосредственно Html-код, так и Cgi-скрипты и Java. Не столь эффектны как Flash, но зато автоматически поддерживаются практическими всеми пользователями сети. Хочется отметить преимущества использования встраиваемых Cgi-форм, взаимодействующих с Cgi-скриптом, расположенным на сервере рекламодателя.

В отличии от баннеров-обманок с элементами псевдо-интерфейса, Cgi-баннеры действительно работают. А это дает следующие преимущества: - возможность использовать сразу несколько URL для перехода (пользователь напрямую попадет туда, куда он хочет;
- подходит для проведения опросов и анкетирования без перехода на специальную страницу;
- возможность заполнить заявку и отослать ее непосредственно с баннера;
- возможность вывода запрашиваемой информации на месте баннера;
и так далее┘
- и, наконец, Вы не обманываете пользователя, а даете ему удобные средства интерактивности.

Итак, rich-media баннеры позволяют гораздо продуктивнее воздействовать на пользователя. В их арсенале эффектная анимация, звук, интерактивные средства взаимодействия с пользователем и т.д. Но есть и целый ряд факторов, препятствующих широкому использованию в интернет-рекламе: - высокие требования к производительности компьютеров и(или) интернет-соединению;
- необходимость скачивания и установки специальных программных модулей для просмотра rich-media;
- отсутствие свода правил, регламентирующих технологию, и правил использования в reach-media как рекламы на внешних сайтах.

В настоящий момент не все веб-издатели согласятся разместить у себя подобную рекламу.

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

Баннер Rich-media состоит, как правило, из нескольких частей, которые выполняются в виде flash-роликов (.swf).

На каждой части ролика обязательно должна быть кнопка «закрыть», причем она должна появляться как можно ближе к началу, чтобы всегда была возможность закрыть ролик, даже если он проигран не полностью.

Если пользователь нажимает на кнопку «закрыть» или показ ролика прекращается по каким-либо другим причинам, то в систему передается команда kill с параметром номер_текущего_ролика. Это номер ролика, в котором произошло нажатие на кнопку. Если ролик всего один, то всё равно нужно указывать его номер — 0 (ноль).
Пример:

После завершения каждой части flash-ролика (таймаут, конец ролика или действие пользователя), если необходимо запустить следующую (произвольную) часть ролика, то в управляющий скрипт нужно передать команду start c параметром номер_ролика.

Передача осуществляется двумя аргументами — отдельно команда, отдельно номер ролика. Ролики нумеруются в порядке загрузки, первый ролик имеет номер 0 (ноль).

Пример: команда для запуска второго ролика.

Используйте только одну команду. Например, если надо открыть вторую часть ролика, то не надо сначала делать kill, а потом start — управляющий скрипт всё сделает сам.

Когда пользователь кликает по области, с которой происходит переход на сайт рекламодателя, ролик передаёт следующие команды:

2. Требования

Имена файлов должны содержать только цифры или буквы английского алфавита, или символ подчёркивания, и не должны содержать русских букв, пробелов, кавычек, тире и специальных символов.

3. Загрузка баннера

При загрузке баннера укажите следующие данные:

* версию flash-плагина, необходимую для воспроизведения всех swf-компонент;
* flash-компоненту;
* ширину, высоту (размеры, которые вы указываете в системе, должны точно соответствовать размерам flash-ролика);
* положение по X, положение по Y.

При необходимости, укажите дополнительные параметры воспроизведения баннера, нажав на кнопку Полная информация.

4. Проверка работоспособности flash-ролика

Откройте flash-ролик у себя на компьютере и кликните по нему. Если ролик сделан правильно, то перехода на сайт не произойдет.

5. Ограничения на размер загружаемых файлов в системе AdRiver

* для обычных графических файлов (в интерфейсе обозначены img width x hight) — 50 Кб;
* для swf-файлов (в интерфейсе обозначены flash width x hight) — 75 Кб;
* другие типы файлов — 50 Кб;
* для многокомпонентных баннеров ограничения проверяются отдельно для каждой составляющей.
Дополнительное увеличение размеров загружаемых баннеров согласовывается с коммерческим отделом и службой технической поддержки.

6. Пример
Баннер Rich-media.

Примечание: возможна некорректная работа баннера в Unix-подобных системах в браузере Opera.
Вы можете ограничить показы баннера пользователям Unix-подобных систем в таргетинге по Браузерам и Операционным Системам в сценариях.

Статья описывает систему при помощи которой на любом сайте с PHP и MySQL может быть развернута полнофункциональная система ротации Rich media баннеров. Хочешь за пару часов уметь разворачивать "взрослую" ротацию таких вот баннеров на любой площадке? Тогда читай статью. Да! Все время забываю напомнить. Рассматривая примеры - включи звук!

Говоря о Rich-media баннерах можно легко согласиться с двумя утверждениями:

1. Это привлекательно, это красиво, это престижно. В Rich-media баннер вмещается бездна информации по сравнению с обычными форматами.
2. Это распространится повсеместно, если будет каждому доступно.

В этой короткой статье мы с вами шаг за шагом создадим не только заготовку Rich-media баннера, но и, что важно, наладим ротацию, биллинг и учет Rich-media баннеров. Причем собственными силами (без привлечения чужих закрытых систем). Самый эффектный из Rich-media форматов это, конечно, "летающие" и "распахивающиеся" баннеры, в которых часть содержимого может на время выходить за пределы баннера. Собственно, сама задача изготовления летающего или распахивающегося баннера проста - это просто флэш-ролик, имеющий размер распахнутого баннера и состоящий из двух сцен: на первой сцене расположена кнопка размером со "сложенный", "запаркованный" баннер, на второй сцене - "распахнутый", "летающий" рекламный сюжет. Наведение мыши на кнопку в сцене "сложенного" баннера вызывает переход на вторую "распахнутую" сцену. В "распахнутой" сцене есть кнопка "[х] закрыть". Команда "закрыть баннер" вызывает переход на первую, "сложенную" сцену. Все.

Исходники таких баннеров можно потырить здесь: http://to-dress.ru/rich/redist/riches.zip

Открываем, изучаем короткие скрипты на кнопках и фреймах. Вся наука.

Теперь баннер нужно поместить на страницу. Заглядываем в HTML файл, созданный Flash'ем при публикации ролика и, создав слой, помещаем в него строчки ограниченные тегами

Смотрите, как это сделано в файле "test_flash.htm".

Баннер работает, но способ его размещения никуда не годен и сейчас мы его усовершенствуем.

Создаем файл "crave_local.js" с вот таким содержимым:

Это тот же самый код, что и в предыдущем примере, но помещаемый в страницу конструкцией:

Этап создания баннера завершен. У нас есть строчка

Доставку JavaScript-баннеров умеет осуществлять большинство "взрослых", коммерческих централизованных "крутилок", класса AdRiver или DoubleClick, но в большинстве случаев (а именно - никогда) их политика не рассчитана на бесплатное или комиссионное обслуживание "хоум пейджей" и т.д., что вполне естественно, т.к. "комиссия" и прочие понятия баннерообменных сетей плохо приложимы к Rich media хотя бы оттого, что это не GIF 468х60 и кто с кем и зачем будет меняться - непонятно. А мы ищем решение, доступное абсолютно всем.

Оказалось, что мелкие изменения в PhpAdsNew - опен сорс "крутилке", распространяемой под GPL лицензией, позволяет с легкостью наладить показ, учет, ротацию, таргетинг и прочие нужные вещи в отношении JavaScript-баннеров, которые могут доставлять в страницу хочешь Rich media контент, а хочешь вообще что угодно.

Историческая справка: команда PhpAdsNew - выходцы из команды всем известного PhpMyAdmin. Что вызывает доверие.

Требования к системе со стороны PhpAdsNew минимальны. У вас должны быть PHP и MySQL. Существует и версия для PostgreSQL - phpPgAds (http://www.phppgads.com/one/). Итак, закачиваем и ставим PhpAdsNew (вот отсюда - http://phpadsnew.com/two/). Внимательно читаем доки. Работать с PhpAdsNew очень просто. Торопыгам советую не мучить себя и прочитать мануал до конца. В мануале есть все. Итак, суть наших вкраплений, позволяющих доставлять JavaScript-баннеры через PhpAdsNew:

1. Cоздаем DHTML зону: Inventory => Publishers & Zones => Expand all => Create Zone type => Interstitial or Floating DHTML.

Указываем желаемый размер зоны в пикселях. Этот размер всегда нужен, даже если баннер будет "летать" и не будет иметь "размера". PhpAdsNew для показа в зоне выбирает из баннерохранилища совпадающий с ней по размеру баннер. Получаем код вызова баннера для этой зоны: Inventory => Publishers & Zones => Expand all => Щелкаем на имени нужной Зоны. Zone properties => Invocationcode.

2. Создаем HTML баннер: Inventory => Advertisers & Campaigns => Expand all => Create. ...type of the banner => HTML banner.

Вписываем в окошко любой текст. Задаем размер баннера равным только что созданной зоне. Привязываем баннер или компанию к зоне: Inventory => Publishers & Zones => Expand all => Щелкаем на имени нужной Зоны. Zone properties => Linked Banners, привязать Кампанию к Зоне (Campaign selection) или Баннер к Зоне (Banner selection) из выпадающего списка "type of linking". Любуемся, балуемся: test_dhtml.htm.

3. Налюбовавшись, возвращаемся к баннеру: Inventory => Advertisers & Campaigns => Expand all => Щелчок на нужном баннере. Теперь вместо текста "DHTML окошко..." вставляем в окно баннера вот эту конструкцию:

Любуемся, балуемся: test_dhtml_js.htm. Видим, что если закрыть DHTML окошко, то под ним находится наш работающий JS-баннер. Конструкция Simple, Automatically close after => 2 sec". С интересом наблюдаем (test_dhtml_js2.htm), как окошко само закрывается, оставляя после себя работающий баннер.

5. Когда нарезвитесь, меняя цвета и стили окошка, выберите окончательный вариант кода доставки баннера:

Style=>Simple
Show close button : No
Automatically close after : 1 sec
Transparent background
No border

6. Готово. Файл: test_dhtml_js_finish.htm.

Как вы уже успели увидеть, позиционирование баннера производится ручками, подсчетом пикселей от верхнего левого угла. Спешу вас успокоить, юнайтедвиртуалитис работает точно так же. Теперь PhpAdsNew доставляет нам в страницу JS-баннеры, сопровождая их доставку всеми своими возможностями: ограничениями на показы, таргетингом, ротацией, учетом и проч. Читайте мануал к PhpAdsNew. JS-баннеры позволяют не только доставлять в страницу Rich media контент, но и смешивать в ротации баннеры нескольких размеров и форматов.

А это все, что осталось от юзер мануала, если взять главное. Повесьте эту страничку на монитор, пока не достигнете автоматизма в управлении рекламой на своем сайте:

I. Добавление баннера в phpAdsNew

* Прежде, чем добавить баннер, средствами: Inventory => Publishers & Zones нужно создать Издателя, а на сайте Издателя - Зоны.

Добавление баннера:

* Прийти в Inventory
* Прийти в Advertisers & Campaigns
* При необходимости создать нужного Клиента (Advertiser) и Рекламную Кампанию (Campaign)
* Открыть нужного Клиента (Advertiser)
* Открыть нужную Кампанию (Campaign) внутри Клиента (Advertiser)
* Внутри Кампании (Campaign) щелкнуть на баннер-иконке Create
* Залить баннер, оформить параметры доставки/таргетинга
* При необходимости прийти в Inventory () => Publishers & Zones и привязать Кампанию (Campaign) в которую добавлен баннер к нужной Зоне (Zone). Zone properties => Linked Banners, привязать Кампанию к Зоне (Campaign selection). В Зоне будут показываться все баннеры привязанной Кампании, подходяшие по размеру.
* К Зоне (Zone) можно привязывать как Кампании, так и отдельные Баннеры: Inventory () => Publishers & Zones, щелчок на нужной Зоне (Zone), Zone properties => Linked Banners, привязка Кампании (Campaign selection) или привязка Баннера (Banner selection).

II. Отображение JS баннеров

* Создать DHTML Зону произвольного (но нужного) размера.
Размер будет влиять только на видимость баннеров в привязках к Зоне.
* Выбрать стиль отображения DHTML
Simple
Show close button : No
Automatically close after : 1 sec
Transparent background
No border
* Здесь мы применяем трюк, заставляя DHTML Layer доставлять JS код баннера в код страницы и умирать. Создать HTML баннер, вписать в окно содержимого баннера волшебные слова:

Все. Удачи. Ну и вы же понимаете, что баннер может иметь и не 2 интерактивных сцены, а хоть 300. Все ограничивается весом баннера в кило.

Напитаться креативными идеями вы можете в галерее баннеров газеты "Бостон Глоб":

http://www.boston.com/mediakit/shosh_globe.htm

http://www.boston.com/mediakit/shosh_atbat.htm

или компании http://www.unitedvirtualities.com.

Рекомендую ссылку: Главная страница UV => shoshkele => product suit => страница 3 (shohsbanners) => Expandable 2 и Expandable 3/