четверг, 3 июня 2010 г.

Баннеры. Какие они из себя

Баннер можно сделать статичным и динамическим, т.е. с анимацией. В последнем меняются кадры, могут добавляться эффекты. Баннер анимированный – это не мертвая картинка JPG. В идеале он должен привлечь внимание. Итак, детально рассмотрим с чем их едят. Так вам будет просто решить, какой именно баннер Вам необходим.



Статические баннеры.


1. Графический баннер (статические форматы).


Жестко встроенный в дизайн сайта прямоугольный блок, в которую загружается картинка-ссылка. К ним можно отнести любой статический графический формат. К примеру, JPG рисунок. Ниже пример такого баннера для компании Darberry (можете посмотреть комплект анимированных баннеров для данного клиента).


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


HTML-баннер – это HTML-код, загружаемый на страницу баннерным двигателем. Этот код обычно содержит скрипт, который, в свою очередь, позволяет выполнять сложные действия с контентом страницы. Как таковые, HTML-баннеры в природе в данный момент времени почти не существуют, т.к. каждое их конкретное применение и воплощение получило имя собственное. Как пример, текстового и HTML-баннеров – реклама Яндекс.Директ.





Динамические баннеры.


1. Графический баннер (анимированные форматы).


Картинка может быть статической или динамической, с этим разобрались вроде как. В качестве анимированного баннера-рисунка может выступать форматы gif. Самый просто способ и эффективный, т.к. не требует никаких плагинов на стороне пользователя. Это просто формат с эффектом смены слайдов:


Очень распространненым форматом стал флеш, который позволяет создавать эффектные баннеры для рекламы Вашей продукции, услуги. Зацените сами, анимация и интерактив в одном лице:


2. Тизер, «Уши».


«Тизер», по-другому «уши», представляет из себя картинку с поясняющим текстом, которая является органичным элементом дизайна сайта. Обычно на одной странице может компоноваться несколько тизеров. Они могут даже объединяться в блоки. В некоторых обменных тизерных сетях практикуется следующее – применение локальной таблицы стилей (css).


3. Rich-media (Рич, Ричи).


Зачастую это графический банер, который отображается в центре сайта. И его суть – он остается в центре при прокрутке страницы до тех пор, пока посетитель не закроет его или не нажмет на него. Обычно в таких баннерах предусматривают специальную, интуитивно понятную «кнопку», позволяющую его закрыть. Баннер не является частью дизайна сайта. Поэтому после закрытия обычно становится недоступным.


Уголок (подвид Rich-media).


Небольшой баннер, не привязанный также к дизайну сайта. Как уже понятно, распологается в углу экрана браузера. Выглядит, как слегка отогнутый уголок открытого сайта, за которым и находится сам баннер. При наведении курсора мыши уголок «отгибается» больше, открывая содержание баннера. При снятии фокуса курсора уголок «сворачивается» до прежнего состояния.


4. PopUp (Попап) и PopUnder (Попандер).


Эти баннеры не встраиваются в дизайн сайта, а открываются в виде новых окон браузера заданного размера. PopUp открывается перед страницей и виден сразу, PopUnder открывается позади страницы. Т.к. открытие нового окна напрямую не санционируется пользователем, то такие банеры зачастую блокируются или самим браузером, или Firewall’ом.


5. Растяжка / Перетяжка / Top-Line (Топлайн), Side-Line (Сайдлайн).


Это встроенный в дизайн сайта блок. Различают растянутый на 100% ширины – это топлайн, а на 100% высоты – сайдлайн. Эти баннеры прижимаются к одной из границ окна браузера. Растяжка или перетяжка обычно горизонтальна и не прижимается широкой стороной к границам окна браузера. Такими баннерами Вы с легкостью можете разделять смысловые блоки на главных страницах сайтов.


6. Расхлоп.


Представляет собой встроенный в дизайн сайта блок, растянутый на 100% ширины или высоты. Отличительная особенность – после загрузки блок меняет свою высоту или ширину соответственно. Обычно баннер разворачивается примерно на пол экрана, держится некоторое время, после чего схлопывается и превращается в топлайн, растяжку, петеряжку или сайдлайн. Технически возможна реализация повторного раскрытия банера при возникновении какого-то события (таймера или наведении курсора мыши), однако, это не практикуется.


7. Screen Glide (Скринглайд).


Очень интересный баннер. Он состоит из двух частей: первая, сам непосредственно баннер (к примеру, флеш), а вторая часть внедряется в дизайн сайта, кот позволяет выводить на экран дополнительные ролики поверх основного текста. Технология работы баннера такая – при наведении на баннер курсора мыши и/или автоматически (в самом начале загрузки страницы) баннер разворачивается в другой, к примеру, очень большой баннер и с эффектной анимацией.

Источник: http://blogs.forestall.ru

Комментариев нет: