Как выглядит баннер для сайта
Баннерная реклама
Создайте рассылку в конструкторе за 15 минут. Отправляйте до 1500 писем в месяц бесплатно.
Отправить рассылку
Баннерная, или медийная реклама — это самый старый вид рекламы в интернете (старше нее только email-рассылки). Почти три десятилетия она помогает брендам привлекать внимание потенциальных клиентов с помощью визуальных материалов. Это объявление с уникальным торговым предложением и призывом к действию, которое выглядит как блок в формате изображение + текст.
Первая баннерная реклама появилась в 1994 году на сайте HotWired и сразу же показала невероятную кликабельность — 44%. Рекламная композиция состояла из вопроса «Ты еще не кликал сюда мышкой?» и самоуверенного утверждения «Ты сделаешь это». Баннеры произвели настоящий фурор. Пользователи отправляли ссылку на сайт знакомым, чтобы те тоже могли оценить идею.
Секрет успеха медийной рекламы кроется в особенностях восприятия информации. В первую очередь человек обращает внимание на яркое изображение. Когда на нем есть текст из нескольких слов, который можно прочитать за секунду, — пользователь его прочитает, даже если не собирался этого делать. Если изображение имеет движущиеся элементы — его точно заметят. Тысячелетия эволюции научили нас обращать внимание на движущиеся объекты, так как среди них может оказаться хищник, который хочет нас съесть.
Графические блоки пользуются спросом до сих пор, даже несмотря на баннерную слепоту и снижение интереса рекламодателей, о чём пойдёт речь ниже. Сегодня баннерная реклама составляет более 30% расходов компаний на рекламу в интернете.
Следует отличать баннерную рекламу от контента самого сайта. Рекламные блоки обычно не касаются тематики ресурса, но могут быть близки к ней. Часто в разделах контекстно-медийной рекламы появляются позиции, которые вы недавно просматривали — это предложения от поисковиков. Например, искали ноутбук в Google — видите рекламу ноутбуков на других сайтах.
Рекламный блок по запросу, который я недавно вводила в Google
Цели баннерной рекламы
Виды баннеров
Статические — классические баннеры в форматах JPEG, PNG, WEBP. Сегодня они встречаются реже, так как имеют один существенный недостаток: их нельзя адаптировать под разные экраны. Но они намного дешевле динамических, поэтому еще долго не уйдут в прошлое.
Динамические — более современный вид баннеров с эффектами анимации. Наиболее популярны баннеры в формате НTML5. Этот формат позволяет не только создавать анимированные блоки, но и адаптировать их под разные размеры экранов. Раньше для создания баннеров использовали Flash-технологии, но они не обладают функциями адаптивности, поэтому проиграли битву за пользователей смартфонов.
Размеры баннеров
Эффективность баннера во многом зависит от его размера. Но это не значит, что большой баннер всегда будет работать лучше маленького.
Если баннер делается для интеграции в сайт напрямую, размер оговаривается индивидуально. Если же речь идет о рекламе в Google и Яндексе, существуют специальные требования к размерам:
На сайт можно сверстать баннер любого размера, однако существуют проверенные параметры, прочно вошедшие в обиход.
Популярные размеры баннеров
Один из самых эффективных размеров — 278 х 90 пикселей, устанавливается в шапке сайта. Его также называют «таблицей лидеров». Открывая сайт, пользователь обычно первой видит именно эту область.
Самый «древний» формат — 468 х 60 пикселей, он используется с 1994 года до сих пор и размещается в верхней части сайта. Не так популярен, поскольку не позволяет разместить много визуального контента.
Стоит вспомнить также о «среднем прямоугольнике» (300 х 250) и «большом прямоугольнике» (336 х 280). Средний прямоугольник предпочтительнее, поскольку хорошо работает и на сайте, и в мобильной версии.
При необходимости показать большое количество контента можно воспользоваться баннером 300 х 600, который называют «полстраницы». Он также показывает хорошие результаты по кликам и пользуется спросом.
«Небоскребы» отлично работали на десктопных версиях сайтов, позволяя размещать достаточно текстовой информации. Существуют широкий (160 х 600) и узкий (120 х 600) «небоскребы». Их минус в низкой адаптивности к мобильной версии, поэтому с появлением адаптивной верстки такие баннеры потеряли популярность.
Секреты создания эффективного баннера
С первого взгляда сверстать картинку с текстом из нескольких слов несложно. Но если вы попробуете самостоятельно сделать рекламный баннер, то поймете, что именно в его лаконичности и простоте кроется самый большой подвох.
Как донести до потенциального клиента УТП всего одной фразой? Как сделать, чтобы на баннер кликала целевая аудитория, а не все подряд? Каким должно быть изображение, чтобы пользователь захотел сделать то, что вы от него ждете? Это лишь часть вопросов, которые возникают перед маркетологами.
Отталкиваться нужно от двух принципов:
Рекомендуется использовать логотип, корпоративные цвета и шрифты. Изображения должны четко демонстрировать суть предложения, чтобы пользователю не пришлось ничего додумывать.
Реклама товаров с логотипами рекламодателей
К примеру, вам нужно прорекламировать интернет-магазин техники для дома.
Что если сделать так: логотип, фотография магазина и надпись «У нас есть всё!» Довольно размытое описание, которое не соответствует реальности. И почему именно фотография оффлайн-локации? Что предлагается сделать покупателю? Нужно, чтобы он пришел в магазин ногами, или все же речь идет о возможности заказа через интернет?
Давайте переделаем: уберем фото магазина, оставим только логотип и корпоративные цвета, изменим надпись на «Бытовая техника для дома». Получается имиджевая реклама, «холодное» взаимодействие, работающее на перспективу. Если прикрепить видимую кнопку с призывом «В магазин» — взаимодействие станет теплее, и часть пользователей перейдет на сайт.
Еще один способ завести покупателя в магазин — через товар. Выбираем топовую позицию и делаем баннер с её изображением, названием, ценником (можно указать скидку) и кнопкой перехода на сайт. Не помешает короткое привлекательное описание: «Самый тихий электрочайник».
Реклама когтеточек на сайте об уходе за питомцами. Из объявления можно понять, что когтеточки Say Meo — необычные и наделены какими-то новыми полезными качествами. Пройдя по ссылке, вы узнаете, что их можно использовать и как лежанку, и как фото-зону
Этот способ приводит более узкую целевую аудиторию и уменьшает вероятность пустых кликов (что особенно важно, если вы платите за переходы), но таких объявлений нужно запускать сразу несколько с товарами из разных категорий.
Если в товаре важен не вид, а суть, есть смысл сделать баннер вообще без изображения. К примеру, ремонт сантехники сложно проиллюстрировать. Можно поставить фотографию улыбчивого сантехника или картинку с новой раковиной, но это не совсем то, что предлагается клиенту. Лучше сделать упор на качественную текстовую часть. Написать заголовок «Срочный ремонт сантехники» и УТП, которое больше всего «болит» у клиента: «Выезжаем сразу после звонка». Шрифты и цветовые соотношения фона и текста должны быть читабельными.
К этой теме не так просто подобрать информативную картинку, поэтому создатели рекламы сосредоточились на текстовой части баннера
Не пользуйтесь заезженными фразами «… или вернем деньги», «только лучшее», «только для вас» — они уже давно никого не цепляют. Более того, у пользователей в головах сформировался фильтр на рекламные фразы. Стоп-слова наподобие «акция» или «скидка» автоматически отключают внимание. Предлагайте клиенту что-то конкретное. Он не хочет кровать «только для вас». А вот если написать «Болит спина? Смени кровать!» — на объявление откликнутся люди, для которых проблема удобного сна актуальна.
В объявлении есть сразу две конкретные выгоды: бесплатный перенос сайта на хостинг и высокая скорость самого хостинга
Для создания интриги часто прибегают к эффекту недосказанности.
Эффект недосказанности на баннерах и превью сайта с развлекательным контентом
Еще одна рекомендация — используйте неожиданные ходы. К примеру, хорошо показала себя практика замены цвета на фотографиях баннера. Если покрасить собаку в зеленый цвет, а пальмы сделать розовыми, периферическое зрение зафиксирует знакомые объекты, с которыми что-то не так. А чтобы разобраться, придется сфокусироваться и внимательно посмотреть на баннер.
Дятел в рекламе на Avito сразу привлек мое внимание. Стало интересно, кого это «не придется долбить». Оказалось, речь идет о компании, которая занимается SERM (управлением репутацией)
Важно учитывать, что формат и дизайн баннера зависят от его цели. Например, имиджевый баннер должен вызывать положительные эмоции, а баннер с ретаргетингом лучше сделать проще и информативнее.
Размещение баннеров
Баннер как самостоятельный рекламный элемент существует не только в интернете — его можно встретить в виде стендов, билбордов, растяжек вдоль дорог, на домах и других площадках. Выбираются такие места, на которые смотрит как можно больше нужных людей. Этот же принцип сохраняется в сети.
Баннерная реклама размещается в шапке сайта, боковых колонках, между внутренними блоками с контентом и в нижней части страницы. В зависимости от размещения меняется её стоимость, поскольку позиционирование существенно влияет на количество переходов.
Самыми эффективными позициями считаются:
Тепловая карта показывает частотность кликов в разных областях экрана. Источник
Размещение внизу срабатывает хуже, поскольку не все посетители долистывают страницу до конца.
Помимо сайтов, баннерную рекламу размещают в поисковой выдаче, соцсетях и мобильных приложениях.
Реклама в YouTube. При просмотре ролика вы видите сразу три баннера: два справа в блоке рекомендаций и один слева
Важно понимать, что кликабельность баннера зависит от того, насколько интересный и релевантный контент его окружает. Это касается не только сайта в целом, но и отдельных областей на странице.
Способы размещения баннерной рекламы:
При размещении важно учитывать, какая категория людей заходит на сайт: какой у нее возраст, финансовое положение, образование, жизненная философия.
На сайт с обзорами брендовой одежды, обуви и аксессуаров есть смысл добавлять рекламу для людей с высоким доходом, которые любят быть в курсе новинок. Сюда можно интегрировать контент со свежими гаджетами, предложения сервисов для занятых людей, спортивные и экстремальные хобби, путешествия. Реклама лапши быстрого приготовления вряд ли вызовет интерес.
Преимущества баннерной рекламы
Недостатки баннерной рекламы: баннерная слепота и блокировщики
В погоне за клиентами рекламодатели использовали баннерную рекламу по максимуму и доили золотую корову, пока та не выдохлась. Баннеров с призывами стало так много, что теперь броские картинки у многих пользователей вызывают только раздражение.
Существует даже шутка в виде отзыва: «Хорошее приложение, так много интересной рекламы! Жаль только, что эта назойливая игра постоянно выскакивает и мешает просматривать баннеры».
Рекламы стало настолько много, что продвинутые дельцы придумали новый способ заработка: в платных версиях приложений и ресурсов пользователям предлагают ее отключить.
Обилие рекламы привело к возникновению эффекта баннерной слепоты, когда в результате перенасыщения внимания пользователь перестает замечать, что изображено на картинках, а просто пролистывает их. Заговорили об этом явлении в 2013 году, когда проблема перенасыщения сайтов рекламой привела к логичному кризису системы. Все, что похоже на рекламу, стало выпадать из поля зрения.
Еще один фактор, который снижает эффективность баннерной рекламы, — блокировщики. Пользователи активно подключают такие расширения в своих браузерах, чтобы защититься от назойливых маркетологов.
Среди недостатков баннерной рекламы можно назвать и то, как её используют сами рекламодатели. Рекламы, встроенной непосредственно в сайты, мало. Большинство баннеров — это контекстная реклама, которая предлагается по поисковым запросам пользователя.
Искала, где купить деревянную беседку для дачи, — теперь меня преследует реклама беседок на всех сайтах
По факту ты видишь 2-3 категории товаров, причем рекламу показывают даже через неделю после совершения покупки. Иногда доходит до абсурда: все рекламные области показывают один и тот же баннер. В результате отсеиваются перспективные возможности:
Раньше существовала практика контекстной рекламы, когда система искала слова и изображения в статьях, цепляя на эти страницы соответствующий баннер. Но на деле автоматический поиск контента оказался неудачной затеей, доходило даже до скандалов. Так, реклама круиза могла оказаться возле новости о кораблекрушении, а баннер с милым ребенком и детскими товарами присоседиться к новости о педофилах.
Набив много синяков и шишек, от автопоиска смежного контента отказались. Будем надеяться, что недочёты в настройках контекстно-баннерной рекламы со временем тоже будут проработаны.
Перспективы баннерной рекламы
В последнее время баннерная реклама существенно изменилась. Перечисленные выше проблемы привели к серьезному переосмыслению ключевых принципов, поэтому сейчас эта отрасль переживает реформацию.
Маркетологи провели работу над ошибками и научились заботиться о пользователях, понимая, что агрессивная реклама не приносит нужного результата. Всплывающих окон становится меньше, баннеры подбираются под тематику сайта и выглядят более скромно, упор делается на текстовую часть и качество УТП. Предложения стараются внедрить в сайт ненавязчиво и органично.
Всего несколько лет назад реклама выглядела как броские раздражающие призывы. Теперь она стала скромнее и информативнее
На протяжении 2010-х годов в аналитических статьях не раз поднимался вопрос заката баннерной рекламы, её периодически пытались торжественно «похоронить». И неудивительно. Наряду с внутренним кризисом у медийки появилась масса конкурентов. Продолжает расти популярность нативной рекламы, онлайн-видеорекламы и рекламы, интегрированной в контент блоггеров.
Сейчас в мобильных приложениях стала популярна видеореклама с наградой. Для нее еще нет блокировщиков, да и пользователей она не так сильно раздражает, поскольку за просмотр можно получить дополнительные жизни в игре или другие полезные «плюшки».
Но сколько бы ни говорили о снижении эффективности баннерной рекламы, финансовая статистика показывает обратное. Так, в 2019 году американские компании потратили на этот вид рекламы на 2 миллиарда долларов больше, чем в 2018, а в России за этот же период расходы на баннеры в сети выросли на 6%.
В отчаянных попытках удержаться на рынке баннерная реклама продолжает меняться: появляются современные решения, внедряются более гуманные, ориентированные на удобство пользователя стратегии. Каким будет дальнейший путь ее развития, покажет время. Но пока ясно одно: баннерную рекламу рано списывать со счетов.
15 дизайнерских приемов — как сделать баннер, за который не будет стыдно
В интернете много шумихи по поводу баннеров. Они уже отжили свое? Кликает ли кто нибудь на них? Может, они уже мертвы? А вдруг появилась лучшая альтернатива баннерам?
И хотя правда то, что по баннерам стали меньше кликать, это еще не конец популярного рекламного формата. Даже если вы не можете измерить эффективность рекламы, вы не будете возражать, что она все равно влияет на выбор пользователя в пользу того или иного продукта или сервиса.
Сегодня мы рассмотрим 15 дизайнерских приемов для создания баннеров, за которые не будет стыдно. Для примеров мы взяли победителей 2015 года по версии Webby Awards.
1. Придерживайтесь стандартных размеров
Баннерная реклама не относится к типу продукта один «размер для всего». Вы должны исходить из тех спецификаций, которые нужны для ресурса, на котором вы планируете размещать рекламу, а большинство сайтов используют набор стандартных размеров. (Это также касается и email-рассылок)
На Google Adwords, одном из крупнейших серверов баннерной рекламы в интернете, можно узнать про наиболее популярные размеры.
Ниже размеры, которые вы должны выбрать в первую очередь:
2. Придерживайтесь последовательности
Каждый баннер должен содержать в себе три элемента: брендинг (логотип), сообщение и поощрение для клика. Загвоздка в том, что у вас не сильно много места для всего этого.
Создайте простую последовательность элементов. Сообщение должно быть кратким — от двух до 10 слов в идеале. Что вы предлагаете и почему люди должны этого хотеть. После этого добавьте логотип или какой-то другой идентификатор. Он должен быть читабельным и не слишком большим. В заключение добавьте причину для клика. Может, у вас сейчас распродажа? Код купона? Подписка на почту?
Каждая из этих составляющих должна быть композиционно размещена согласно базовым принципам дизайна по размеру, пространству, весу и цвету, чтобы вести внимание пользователя от элемента к элементу.
3. Один баннер равняется одному сообщению
Рекламные баннеры не должны быть нескончаемой каруселью сообщений. И, хотя вы можете использовать приемы типа анимированных гифок, чтобы показывать по несколько сообщений в одном баннере, это не всегда лучшее решение.
Сначала начните из концепции, которая работает, как статичная картинка. И только потом вы можете попробовать добавить фишки или дополнительную функциональность. Движущиеся элементы не должны быть единственной вещью, которую видят люди. Ваше сообщение, посыл должны быть самыми главными на экране.
4. Помните о том, где будет размещен баннер
Где вы планируете размещать баннеры после того, как сделаете сам креатив? Если вы используете сервисы подобные Google, у вас будет не сильно много возможностей контролировать размещение. Но если вы хотите разместить их на определенных вебсайтах, в приложениях или email рассылках, вам нужно будет изучить их и принять во внимание их дизайн, прежде чем делать свои баннеры.
Используйте цвета, которые сильно контрастируют с дизайном и фоном площадки. Это поможет вам выделиться на общем фоне. Берите четкие цвета и шрифты, которые хорошо читаются. Даже если тематика вашего баннера пересекается с продуктовой линейкой сайта, на котором размещена реклама, выбирайте сильные, кардинально отличающиеся визуальные решения — для того, чтобы вызвать максимальную реакцию.
5. Используйте призыв к действию
Какая самая главная задача баннера? Правильно — на него должны кликнуть. Используйте призыв к действию (Call to Action) в каждом баннере, который вы делаете. Подскажите пользователю, что ему нужно делать дальше.
Пользователь может подписаться на список рассылки, перейти на сайт, получить скидку и т.д. Но вы должны убедить его сделать это. В таких случаях отлично срабатывает прямая инструкция, в лоб — ведь люди не хотят много думать.
6. Забудьте про Flash
Сейчас об этом можно уже даже и не говорить, но все равно, на всякий случай — не позволяйте никому уговорить вас на создание флешовых баннеров. Вы тратите время, усилия и деньги.
Используйте вместо этого HTML5. Если вам нужно сконвертировать какие то свои старые креативы и вдохнуть в них новую жизнь, у Google есть небольшой урок, который поможет это сделать.
7. Используйте кнопки
Иногда бывает сложно воспринимать информацию — все мы когда-то с этим сталкивались. В таких случаях спасают простые инструкции. И хотя большинство пользователей знают, что они могут кликнуть на баннер, иногда наличие кнопки подталкивает их к этому действию. (Да, понятно, что кликабельна вся площадь баннера, но кнопка — это отличный визуальный сигнал).
Так что — вставляйте кнопки. Не нужно особо изощряться с их оформлением. Простые сообщения типа «купить сейчас» или «узнать больше» могут сделать очень многое для того, чтобы превратить просмотр баннера в клик и последующую конверсию.
8. Сфокусируйтесь на шрифтах
Чем меньше площадь, с которой вы работаете, тем важнее значение выбора шрифтов. Баннерная реклама в большинстве случаев очень ограничена в размерах и жестко конкурирует с другими элементами сайта. Так что используйте четкие шрифты, которые легко читать.
9. Используйте простую анимацию
Одним из наибольших трендов в баннерной рекламе является простая анимация. Например, забавный персонаж, который пробегает через баннер, или милая девушка, которая кивнет или подморгнет вам с экрана.
Чего точно не надо делать, так это ярко-желтые или оранжевые мигающие экраны из баннеров прошлого. Вам не нужны светящиеся неоновые тексты, чтобы привлекать внимание пользователей.
Мы говорим о маленьких фишечках, которые привлекут внимание и заставят взглянуть на баннер еще раз. Простая анимация может быть просто маленькой зацепкой, который привлечет к себе внимание.
10. Сохраняйте правильно
Это важный момент. Никто не разместит вашу рекламу, если файлы слишком много весят или у баннера будет неправильный формат. Оптимизируйте размер по максимуму. Итоговый размер файлов не должен превышать 150 кб, в зависимости от площади рекламного баннера.
После этого убедитесь, что баннер сделан в правильном формате, стандартном для интернет-рекламы. Распространенные форматы баннеров — PNG и JPG для статических баннеров, GIF — для анимированных. SVG формат тоже набирает оборотов и все чаще принимается разными рекламными сетями. Забудьте об SWF (Adobe Flash) — от него сейчас уже практически все отказались, и даже браузеры перестают его поддерживать. Вместо него широкое распространение получили HTML5 баннеры, которые создаются с помощью таких программ, как Google Web Designer, Adobe Animation или рускоязычный онлайн конструктор баннеров Bannerboo.
11. Сфокусируйтесь на текстах
Вы, конечно, можете сказать, что это не ваша работа, но копирайтинг — ключевой момент при создании баннера. Хотя там не так много места для текстов, вам нужно будет хорошенько попотеть, чтобы написать хорошее продающее сообщение.
Вы же не собираетесь впихнуть в баннер 100 слов, правда? Неплохой вариант — поработать с копирайтером, который поможет подобрать правильное послание. Подбирайте такие выражения, которые отвечают на возможные вопросы пользователей, или придумайте интригующий посыл, чтобы привлечь их внимание.
12. Используйте элементы бренда
Рекламные баннеры — продолжение любой маркетинговой кампании, которую вы запускаете. Они должны выглядеть соответственно. Если формы и размеры могут немного отличаться, общий визуальный стиль должен сохраниться.
Поэтому, создавая баннеры, думайте о них, как о составляющей вашей маркетинговой стратегии.
Чтобы сохранить общий стиль, используйте одни и те же цвета, шрифты и картинки во всех материалах. Если формат баннера очень маленький, вы можете спрятать логотип или как-то интересно обрезать фотографию, которая на других носителях должна быть полноразмерной. Это нормально. Короче говоря, вам нужно хорошенько покреативить, чтобы все заиграло, как надо.
13. Используйте яркие визуальные элементы
Картинки в баннерах обычно небольшого размера, а часто — очень даже маленького. Вам нужно будет использовать максимально смысловые и детализированные изображения, чтобы получить нужный эффект и достучаться до пользователя.
Если используете фотографии людей — давайте акцент на лица. Если вы продаете одежду — покажите один товар вместо всего гардероба. Склоняйтесь к простым композициям — картинка, и возле нее текст. Не картинка в тексте, и не текст в картинке. У пользователя есть всего пара секунд, чтобы увидеть ваше сообщение. Сильное смысловое изображение и сильный продающий текст возле него — ваш беспроигрышный вариант.
14. Релевантный контент
Нет ничего лучше хорошо продуманной рекламной кампании. Если вы кликнули на баннер, потому что хотите купить изображенную на нем футболку — ссылка должна вести именно на нее. Пользователи скажут вам за это спасибо.
Да, возможно, вам нужно будет приложить немножко больше усилий, чтобы все сработало, как надо. Целевые страницы, созданные специально для рекламной кампании — как раз тот вариант. Придерживайтесь общего стиля на баннерах и на лендинге, чтобы посетитель не растерялся, перейдя по клику на вашу страницу. Изучайте аналитику и смотрите конверсию, чтобы понимать, все ли хорошо работает.
15. Будьте попроще
Это прописная истина. Если вы переутомите пользователя обилием текстов, анимаций, цветов, фактов, вы рискуете утратить первоначальный смысл. Будьте попроще.
Выводы
Так что, баннеры еще пока не умерли. (И не факт, что это когда-нибудь случится). Баннерная реклама может стать эффективным способом достучаться к вашей целевой аудитории а также повысить узнаваемость вашего бренда.