Банер (з англ. Banner) в Інтернет-рекламі - рекламний носій, при натисканні на який користувач потрапляє на конкретний ресурс з рекламованим продуктом / послугою. Може бути статичним, або анімаційним. Другий тип привертає до себе більше уваги.

Банери можуть розміщуватися або на майданчиках (банерних мережах), або безпосередньо на сайті замовника, або його партнерів. У першому випадку ведеться статистика (к-ть показів, число переходів тощо.), У другому - це просто гіперпосилання на сторінку, без урахування показників.

Якщо раніше словосполучення «Інтернет-реклама» мало про що говорило людям, далеким від мережевого способу життя, то тепер розміщення інформації про свій вигляд діяльності в мережі Інтернет стає серйозною альтернативою іншим видам реклами. Темпи зростання попиту на мережеву рекламу викликають зростання виробництва рекламно-сувенірної продукції та збільшення їх різновидів і типів.

1. Короткий огляд видів і форматів банерів.

Років 6-7 тому реклама в мережі виглядала, як правило, простий гіперпосиланням, зараз же користувач часом просто втрачається від достатку видів рекламних носіїв. Говорячи про найбільш поширені види, не обходимо виділити такі як:

- Класичні flash-банери різних розмірів. На українських банерних майданчиках найпопулярніші ресайз: 468х60 (ширина / висота, в пікселях), 240х350, 730х90, 180х300 і тд. Як правило, такий банер являє собою зациклений анімаційний ролик, тобто сюжет повторюється "по колу";

- Інтерактивні банери. Один з найефективніших видів банерів. Спонукання користувача до якоїсь дії. Як результат - високий коефіцієнт СTR (співвідношення кількості показів банера до кол-ву натискань на банер користувачами). Може бути виконаний у вигляді гри, невеликого мультфільму за участю користувача або щось в цьому роді.
Нижче наведено приклад такого банера, виконаний як Screen-Glade, при наведенні мишкою він відкривається і пропонує користувачеві зробити якусь дію. У закритому стані являє собою звичайний банер

Після наведення мишкою

-баннери розміщуються поверх сторінки, можуть бути довільної форми, обов'язково є хрестик для закриття такого банера;

-баннери. При наведенні мишкою на звичайний банер розгортається додатковий простір (наприклад з банера 468х60 стає 468 * 120);

У звичайному стані являє собою звичайний банер 468 * 60.

Після наведення мишкою банер збільшується до 468 * 120 пікселів. Коли мишку прибираєш з банера, він повертається до первісної форми.

- фактично pop-up, який при скролінгу сторінки залишається на місці, створюючи враження, нібито рухається разом з вмістом сторінки.

- Peel-away - виконаний у вигляді відгинається сторінки в кутку браузера, натиснувши на яку користувач може побачити розгорнувся повноекранний ролик.

У лівому верхньому кутку трохи відгинається листочок відкриваючи за собою якусь інформацію, зазвичай викликає у користувачів інтерес і бажання подивитися що за ним.

При натисканні на куточок, на весь екран розгортається мандрівниця і при натисканні на кнопку «закрити» знову згортається в куточок.

- gif- і jpeg-банери.

gif-банер може бути статичним і анімаційним (як правило - кілька кадрів), jpeg-банер - це статичний банер. Ці види банерів часто використовуються в якості загушкі на випадок того, якщо у користувача відсутня flash-плеєр, необхідний для перегляду flash-банерів.

Говорити про відео-банерах, повноцінних іграх-банерах, мультіках- банерах і т.п. немає сенсу, оскільки пропускна здатність українських каналів істотно відрізняється від західних, де реалізуються подібні речі.

2. Технологія виготовлення flash-банерів.

Анімаційний редактор Flash від компанії Macromedia став надзвичайно популярним інструментом у виготовленні flash-банерів. Це сталося завдяки тому, що розробникам вдалося виконати дві головні завдання: створити просту у використанні програму для створення анімації і поєднати її з потужним вбудованим векторним редактором.

Основна маса банерів робиться для банерних мереж, які пред'являють свої технічні вимоги до банерів. Найголовніша вимога, яку слід враховувати - це обмеження по вазі. Наприклад, деякі баннерокрутілкі приймають банери розміром 240х350 вагою не більше 25 кілобайт, деякі - 30-45 кілобайт. Хороший і динамічний банер - це розумний компроміс, між кількістю графіки та якістю анімації, оскільки і те й інше робить вирішальне значення на сумарна вага банера. Тому оптимізація графіки - один із суттєвих компонентів процесу виготовлення банера.

3. Графіка і її оптимізація.

Графіка використовується двох типів: растрових зображень, і векторні. Растрова графіка (jpeg, gif, png та ін.) - використовується як правило з дозволом в 72 dpi з метою економії ваги, до того ж Flash додає свою компресію (стиск), яке регулюється в процентах. Тут необхідно шукати розумний баланс якості, оскільки якщо в Photoshop при експорті поставити, скажімо, 50% якості зображення, а потім у Flash ще раз стиснути його на 50% - то на виході вийде растрове зображення з «перетиснутій квітами», тобто дуже поганої якості.

Для прикладу, на першій картинці растрове зображення в початковій якості, на другому після стиснення з метою зниження ваги.

Один з методів оптимізації графіки - це зменшення кольорової палітри, тобто зменшення кількості квітів, кінцевий результат можна зберегти лише в форматі * .gif. Png - розширення графічного файлу, яке теж досить часто використовується при розробці банерів. Одна з особливостей - прозорі краю зображення, що дає можливість використовувати його в анімації, накладаючи на свої фону та ін. Актуально при розробці pop-up банерів неправильної форми. Недолік - займає багато місця по вазі банера.
Векторна графіка. Як згадувалося вище, в Flash є власний вбудований графічний редактор, який дозволяє створювати досить складні зображення, включаючи градієнти, прозорість, згладжування країв вектора тощо. Розмір векторного зображення можна збільшувати або зменшувати і це не відіб'ється на якості картинки. Для прикладу наведемо різницю між збільшенням растрової і векторної картинки

1. Збільшили растрову картинку

2. Збільшили векторне зображення

Flash дає можливість, крім своєї графіки, також використовувати сторонню векторну графіку, тобто створену в професійних векторних редакторах. У Flash можливий імпорт файлів з розширенням * .ai, * .eps (Adobe Illustrator), * .cdr (Сorel Drow), * .ft, * .fh (Free Hand) і т.д. Іноді імпортована графіка вимагає додаткової оптимізації: зменшення кількості кутів, заміну кольорів (якщо імпортоване зображення було створено в колірній моделі СMYK, оскільки сам Flash працює в моделі RGB).

4. Особливості анімації в Flash.

Анімація. Анімація у Flash може бути покадровая (трохи схожа на класичну), автоматична, або програмна. Покадровая дає можливість створювати складні сцени, з поворотами в перспективу, зі складними траєкторіями рухів об'єктів (псевдотривимірного анімація), але займає дуже багато часу в виготовленні і, відповідно, збільшується вага банера, тому в виготовленні банерів вона використовується в мінімальних пропорціях.

Автоматична анімація служить для створення простих переміщень, коли користувач задає лише початкову і кінцеві точки руху, а всі проміжні кадри Flash прораховує сам.

Програмна анімація. Створюється за допомогою вбудованої мови Action Script. Можна реалізовувати дуже яскраві речі, в тому числі і псевдо-тривимірні рухи, але тут є пару істотних недоліків: по-перше - далеко не всі вміють програмувати, і по-друге - часто програмна анімація займає багато ресурсів процесора, відеокарти, оперативної пам'яті комп'ютера користувача, що неприпустимо.

Для створення анімації існує головна шкала, де по горизонталі йдуть кадри, по вертикалі - шари. Як правило, кожен об'єкт розміщується в своєму шарі. Шарів може бути дуже багато.

Для зниження ваги банера раджу кожен об'єкт робити «символом», в результаті вага символу вважається тільки один раз у всіх кадрах, що дозволяє робити невеликі за вагою flash-ролики.

Відео / аудіо. Також можлива робота з відео- (* .mpeg, * .avi, * .mov), аудіо-файлами (* .mp3, * .wav). У програмі, як і для растрових зображень, є свій алгоритм додаткової компресії для аудіо-файлів. Також є свій формат відео-файлу - * .flv.

Action Script. вбудовану мову програмування, який є прекрасним доповненням для створення стильних і динамічних роликів. Деякі речі в програмі можна реалізувати тільки за допомогою цієї мови, наприклад, рендомальние (випадкові) дії (падіння снігу, як один з варіантів). На Action Script пишуться движки для ігор, сайтів і цілі програми. Єдиний мінус - занадто складні скрипти (код) забирають багато ресурсів копьютера користувача. За допомогою стрілялки можна задіяти зовнішні дані, тобто імпортувати в ролик графіку, динамічний текст, звуки, відео, інші flash-ролики.

Експорт готових роликів Flash робить в своєму основному форматі: * .swf. Також можна на виході отримати такі формати, як: animated gif, * .avi, * .wav, * .png. Але їх підсумкове якість не завжди адекватно, тому краще користуватися спеціалізованим софтом і всякого роду конвертаторами. Наприклад, програма-конвертатор swf2video, для коректної конвертації файлів * .swf в відеофайли.

5. Технологія виготовлення gif-банерів

Як уже згадувалося, в даний час зберігається тенденція зменшення використання gif-банерів, оскільки flash-банери більш ефективні. Як правило, gif йде в якості заглушок, на той випадок, якщо раптом у користувача не виявиться flash-плеєра. Gif-банера бувають статичні та анімаційні. Обидва типи йдуть з розширенням * .gif.

Статичний gif - просто графічний файл, на зразок файлу * .jpeg, який можна отримати з будь-якого графічного редактора, такого як Photoshop.

Анімаційний gif-банер являє собою послідовність кадрів (картинок, тексту), викладених в логічному порядку один за іншим.

При розробці анімаційного gif-банера використовується додаток до графічного редактора Adobe Photoshop - Adobe ImageReady, або подібні програми, типу Gif Animator і ін.

Принцип анімації той же - в кожен кадр поміщаються об'єкти, задається послідовність кадрів, швидкість (кількість показуються кадрів в секунду). Об'єкти можна розкидати по верствам, особливо, якщо вони рухаються відносно один одного (текст переміщається на якомусь тлі).

На виході можна регулювати кількість квітів, і вибирати найбільш оптимальний баланс між якістю картинки і вагою банера.

В анімації gif-банерів, для отримання якісного продукту, використовується весь арсенал фільтрів і ефектів Photoshop.

6. Креатив у виготовленні банерів.

Креатив в виготовлення банерів можна визначити, як нестандартний підхід в розробці. Це може бути:

- незвичайний дизайн (картинка);
- нестандартні поєднання кольорів / розташування об'єктів;
- звуковий супровід, відеовставки;
- інтерактив (взаємодія користувача і ролика);
- дотепний і запам'ятовується сюжет;
- динамічна анімація, коли весь ролик виглядає "на одному диханні";

* Автор - Flash-дизайнер Інтернет-агентства Mediacom , Ширяєв Павло