Веб-дизайн

Слева при входе


Стандартное размещение баннера в самом верху страницы (справа от фоновой полосы, если та присутствует, стр. 262) привлекает своей ненавязчивостью. Такая схема построения страницы настолько привычна, что реклама, хоть и получает свою долю внимания зрителя (тем более что из всей графики она появляется на странице самой первой), стоит подчеркнуто в стороне от основного содержимого страницы и потому почти не раздражает. За­метно увеличить эффективность при этом можно, повторив тот же баннер в самом низу страницы. Вставлять баннеры в разрыв текста могут позволить себе только очень жадные сайты, заботящиеся о проклике больше, чем о душевном равновесии своих посетителей.

Как разновидность этой схемы, на первых страницах некоторых сайтов применяются небольшие (обычно 125x125 пикселов) квадратные банне­ры, размещаемые в правой колонке страницы. Такие баннеры, оставаясь в известной мере на периферии восприятия, тем не менее дают очень хоро­ший CTR — как утверждают, из-за своей близости к вертикальной полосе прокрутки окна броузера, над которой большую часть времени находится курсор мыши пользователя.

Особняком стоят дизайнерские решения, отходящие от традиционного краевого расположения баннера, в которых в то же время баннеры не становятся помехой восприя­тию материала. Так, зачастую можно перенести баннер под неизменяемую навигационную панель; на сайте books.ru (пример 15) широкая верхняя полоса с логотипом и ссылка­ми, хотя и доминирует на странице визуально, практической информации несет мало, так что читателю очень редко при­ходится запинаться взглядом о расположенный под ней баннер (пересечение этой чужеродной вставки к тому же дополнительно облегчено «трамплином» — еще одной гори­зонтальной полосой под баннером, повторяющей текстуру верхней полосы).

Больше жизни. Давайте теперь познакомимся с вы­работанными практикой подходами к дизайну баннеров и с теми из (уже известных нам) принципов и ма­териалов дизайна, которые особенно сильно влияют на эффективность рекламы.
При выборе приоритетов для каждого конкретного проекта нужно учитывать множество обстоятельств — предметную область рекламной кампании,



280

предполагаемую аудиторию, традиционный дизайнерский Я стиль фирмы-заказчика. 1

Главное, ради чего существует на свете баннер, — щелчок по  нему  мышью  пользователя  —  есть действие  в  первую  очередь  динамическое.  Вполне естественно поэтому, что выражаемая дизайнерскими средствами динамика, как явная, так и подразумеваемая (стр. 166), играет в дизайне баннера главную роль,  а начала единства и баланса зачастую приносятся ей  в жертву.  Направленность этой 1 динамики в большинстве случаев особого значения не имеет; важно расшевелить восприятие пользователя, придать неожиданный импульс его взгляду, лениво скользящему по странице, а еще лучше — курсору его мыши. Даже если направление этого импульса будет не совсем предсказуемо, вероятность желанного щелчка мышью напрямую зависит от его силы.

Именно по этой причине анимация стала в последнее время обязательным атрибутом большинства рекламных баннеров, a GIF, соответственно, — почти единственным приме­няющимся для баннеров форматом. Даже незначительное шевеление, вращение или подмигивание привлекает взгляд и заметно повышает CTR; современные же баннеры не­редко представляют собой целые мультфильмы, не только с движущимися персонажами, но и со сменяющимися по нескольку раз за цикл декорациями.

Пьеса в трех действиях. В сюжете любого баннера, даже если анимация как таковая в нем не используется, можно выделить три главных этапа, схожие с частями классической драмы: завязка, экспозиция (развитие) и развязка. Цель первого этапа — привлечь внимание зрителя, выбить его из колеи, заставить ожидать дальнейшего; на втором этапе зрителю сообщается соль рекламы, основная информация баннера, объясняется причина, по которой он должен соблазниться именно этим продуктом или услугой; наконец, третий этап снова делает упор на чувства, а не на разум и, как кода музыкального произведения, разряжает накопившееся напряжение либо раскрытием тайны лично­сти рекламодателя (которая до сих пор оставалась скрытой), либо торжественным объявлением его адреса, либо про­сто призывом «click here» (а иногда даже анимированным изображением курсора мыши, который якобы и делает на баннере этот самый вожделенный click).





281

В анимированных баннерах — более сложных и, как прави­ло, более дорогих — эти три этапа разделены во времени (рис. 6В). В менее притязательных образцах рекламной продукции, анимацией не пользующихся, этапы эти могут быть разнесены только в пространстве; при этом обычное направление восприятия информации — слева направо — диктует расположение «развязки сюжета» на правом конце баннерной полоски. Это вполне согласуется и с требова­ниями эргономики — как я уже упоминал, курсор мыши, чей выход на сцену предполагается именно в третьем дей­ствии, обычно находится ближе к правому краю экрана (и, следовательно, баннера).

В анимационных баннерах максимум динамики приходит­ся на первый этап, на котором почти всегда что-нибудь движется, взрывается или прокручивается по всей площади баннера. Второй, информационный этап обычно пред­ставлен сменяющими друг друга статическими текстами. Наконец, на третьем этапе снова возникает динамика, но несколько иного рода — вместо движения по всей площади баннера применяются достаточно локальные мигания, пе­реливы и тому подобные эффекты, как бы закрепляющие общий эффект и приглашающие тех, кто насладился пред­ставлением, сделать щелчок и продолжить таким образом знакомство с рекламодателем.

Эта смена тональности в конце мультика — очень важный момент. Исследования показывают, что при всей своей наивности призыв «click here» увеличивает CTR баннера на 10—15% — очевидно, не потому, что без него пользователь не догадался бы, где нужно щелкать, а просто потому, что привычная и ожидаемая формула ставит точку в развитии сюжета и подталкивает зрителя к переходу от созерцания к действию. Не меньшей завершенностью баннер должен обладать и в других своих аспектах; даже если он не пользуется «широкоэкранной» анимацией, а динамика его выражена статическими средствами, движение не должно «идти вразнос» или теряться в бесконечности, а обязательно должно концентрироваться в некоторой точке схода, фо­кусе силовых линий, финальном аккорде, после которого зрителю не останется ничего, кроме как вознаградить автора аплодисментами — щелкнуть мышью.



Таковы основы баннерной драматургии. Разумеется, как в театре, так и в рекламном дизайне немало заслужива­ющих внимания работ нарушают общепринятые каноны.



1



2



3



4



5



6



7



8



Рис. 68

Типичный трех-частный анимированный бан­нер. Кадры с 1 по 7 — завязка, привлечение внимания: трудно удержаться и не проследить с сочувствием за страданиями симпатичного персонажа. Вто­рой этап (кадр 8) — заявление основной темы: оказывается, речь идет о некоем продукте, который поможет вам следить за многочисленными конферен­циями и выставками, чтобы они не заставали вас врас­плох. Наконец, финал баннера (кадр 9) решен в традиционном стиле: мы видим полное назва­ние продукта, имя разработ­чика (компания IBM) и, само собой, неизбежное «click here»...

282

Некоторые баннеры ограничиваются только первой из трех частей, бросив все силы на привлечение внимания и рассчитывая на любопытство зрителей, которым все-таки захочется узнать, кому принадлежит столь яркий и интерес­ный, хотя и не слишком информативный баннер. Другие баннеры опускают информативную середину и от возбужда­ющей части непосредственно переходят к побуждающей. Противоположность такому подходу — «скучный» баннер, сразу открывающий все свои карты, состоящий преимуще­ственно из текста и делающий упор на привлекательность своей информации. Апелляция такого баннера к чувствам зрителя ограничивается в лучшем случае изображением логотипа и цитированием рекламного лозунга компании-рекламодателя.


Содержание раздела