Когда нужно сделать баннер, а вы не дизайнер...

Когда нужно сделать баннер, а вы не дизайнер...

  • 1
  • 2
  • 3
  • 4
  • 5
Всего голосов: 70 средняя оценка: 4.83 (рейтинг: 97%)

Рекламные баннеры нас окружают везде: на улице, в интернете, на стадионах и т. д. Не исключение и email рассылка, в которой баннер исполняет главную роль, фокусируя внимание читателя и повышая переходы. Желательно, чтобы он кратко отображал цель письма и не противоречил заявленной теме.

Очень сложно найти в сети наработки по созданию баннеров именно для email рассылок. Обязательным этот элемент стал не так уж давно и каждая компания делает его так, как считает нужным. Когда вы заказываете баннер дизайнеру — он 100% сделает всё красиво и правильно. Сегодня же мы постараемся собрать и систематизировать все советы и знания, чтобы не дизайнеры понимали с чего начинать работу.

Опять пригодится модель AIDA:

Как уже надоели эти 4 буквы, но они отлично применимы для создания баннеров.

A — Attention (внимание)
В любом случае сложно проскролить письмо и не обратить внимание на центральный, главный баннер, даже если он немного кривоват. Выигрышно смотрятся баннеры, контрастирующие с оформлением письма и с анимацией.
I — Interest (интерес)
Далее вступает в игру текст на баннере. Секреты составления текста для баннера схожи с составлением темы письма — коротко, по сути и с цифрами. Текст всего письма будет читаться по диагонали, а вот баннеру должен восприниматься легко, поэтому его лучше не перегружать лишними деталями.
D — Desire (желание)
Желание получить выгоду, обещанную на баннере.
A — Action (действие)
Под действием мы обычно понимаем переход на сайт. Необязательно по клику на сам баннер, возможно, переходов будет больше по кнопкам СТА

Простой пример, когда в одной компании мы существенно не меняли письмо, а всего лишь добавили баннер:

Статистика после добавления баннера

Баннер взял на себя всего 15–17% кликов, но переходы по письму значительно увеличились, т. к. внимание клиентов «захватили» и он понимает о чём письмо и чего от него хотят.

Кнопка призыва может быть как на баннере, так и под ним. Когда мы проводили А/Б тест и проверяли нужна кнопка на баннере или под, оказалось, что разница не принципиальна, главное, чтобы она просто была.

И есть ещё одна буква:
S — Satisfaction (удовлетворение).

Когда ожидания подписчика не были обмануты и он получил на сайте то, что было обещано в письме.

Подготовка баннера для email рассылки:

Хороший баннер не тот, что выглядит хорошо. Хороший баннер, который работает. Это может быть самая уродливая вещь в мире, но если он работает - он идеально подходит
— Karol K.

Серьёзно, вы верите, что подписчик открыв письмо в первую очередь подумает: «Фу, кнопку на баннере нужно было поднять на 2 пиксела» Нет, он будет искать выгодных предложений! Тот, кто хочет докопаться до вашего письма и так найдёт 100 и 1 причину, даже без баннера. Суть не в том, чтобы создать самый гениальный и красивый баннер — важно захватить внимание. Попробуем систематизировать наши знания, чтобы вы могли легко создавать баннеры.

Размещение баннера

Популярны несколько вариантов размещения баннера: под хедером (перед основным текстом письма) и после первого абзаца.

Пример размещения баннера в письме

Есть ещё варианты, как письма из баннеров, но об этом немного позже. Пока в наших тестах одинаково хорошо работают оба варианта, поэтому они имеют право на жизнь.

Количество баннеров

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

Оформление и содержание баннера

  • Привлекательный короткий текст
  • Сумма скидки
  • Картинка

Просто красивая картинка, которая никак не связана с предложением, вряд ли пробудит желание у пользователя. Хотя бывают и исключения — девушки:) На девушек кликают хорошо — это нам твердят дизайнеры, показывают тесты, да и собственное поведение. Пример баннера из рассылки Showrooms.ru.

Гифка на баннере
Баннер привлекает внимание, но перейти на сайт скорее хочется чтобы девочка перестала крутиться:)

  • Срок действия акции
  • Промокод, если его можно скопировать

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

Текстовый вариант промокода в письме

С такой расшифровкой клиенты быстрее соображают, что тут можно взять код.

  • Кнопка призыва к действию

Главное, чтобы кнопка на баннере выделялась: формой, цветом, размером текста. Например, такой самозаполняющийся чек-лист.

Самозаполняющийся чек-лист

Выглядит оригинально и необычно. Хотя за меня всё и решили — я бы обязательно почитала, что мне ещё предложат.

  • Конкретный товар

На людей кликают лучше, но если это не реклама конкретного товара. Например, в рассылке о скидках на туфли, лучше отработал баннер с изображением туфлей, а не девочки в этих же туфлях.
Пример того, какие баннера делает Kinderly:

Баннер с товарами от Киндерли

Анимированные баннеры:

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

  • Анимированный баннер улучшает внешний вид письма и делает даже скучный текст интересным и стильным.
  • Тестирование показывает, что хорошие GIFки увеличивают CTR.
  • GIFки помогают подчеркнуть индивидуальность вашего бренда, и сделать письма запоминающимся.
  • Слишком замысловатая анимация собьёт с толку читателя, да и загружаться будет дольше.

Пример баннера из письма SHOWROOMS

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

Текстовое наполнение:

  • Пишите кратко. Это позволит быстро захватить внимания читателя и дать ему основную суть письма. Используйте не более 7 слов, но в то же время зацепите подписчика чем-то: выгода, интрига, страх, любопытство и т. д.
  • Простые слова. Замените сложные или иностранные слова на понятные для читателя.
  • Короткие слова. Длинные слова требуют времени для прочтения. Почти для каждого длинного слова, можно найти короткую, но не менее эффектную замену.
  • Крупный, хорошо читаемый шрифт. Пожалейте глаза и время пользователей, чтобы они не всматривались в буквы.
  • Числа. Люди любят цифры:) Особенно если эти цифры дают какую-то выгоду.
  • Скидочный промокод. Как говорилось, делайте таким, чтобы его можно было скопировать. Неважно, он «зашит» в баннер или находится ниже.
  • Если баннер рекламирует распродажу — обязательно указывайте сроки проведения, хотя бы под баннером.

Контрольная проверка

Посмотрите несколько секунд на баннер — всё понятно?

И ещё:

  • Усиливайте баннер текстом. Идеально, когда главный баннер отображает суть всего письма, но без сопроводительного текста он может не произвести нужного эффекта.
  • Добавляйте кнопки СТА. Хорошо работают кнопки как на баннере, так и непосредственно под баннером. Но главное, чтобы они были и побуждали к действию: «Читать подробнее», «Купить игрушку» и т. д.
  • Учитывайте аудиторию, которой вы отправляйте. Возможно, им и не нужно всех наворотов и достаточно будет простого понятного письма.
  • Проставляйте под баннер ссылку. Направляйте с баннера на страницу, которая соответствует тому, что вы анонсировали в письме.
  • Обратите внимание как гармонируют текст и изображение. Слишком пёстрые, яркие наляпистые изображения вызовут только отторжение и пользователь, скорее всего, закроет письмо.
  • Не используйте CapsLock для всего текста на баннере. Слова с привычным регистром лучше распознаются людьми.

Примеры простых, но эффективных баннеров

Я собрала (на мой взгляд) баннеры, которые захватывают внимание несмотря на простоту в оформлении:

Ограниченное количество

Баннер с анонсом акции

Мы видим большую скидку + менее заметную надпись, что это последние размеры. Скидку дали, срочность указали — основную миссию выполнили, а дальше уже как справится письмо.

Уникальность предложения

Пример баннера без кнопки СТА

Не читая письмо, можно догадаться, что нам что-то будут рассказывать о кулончиках с буквами, ведь кнопки СТА нет, а значит компании нужно, чтобы это письмо дочитали до конца.

Эмоции

Эмоциональный баннер

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

Просто захватите внимание

Баннер с одним призывом

Сразу крикнули на людей: "Распродажа!" И они уже понимают о чём будет дальше идти речь. Такие варианты хорошо подходят, если нужно рассказать о нескольких спец.предложениях. Сначала привлекаем внимание читателя, а затем расшифровываем какие скидки ждут на сайте, их %, срок действия и т. д.

Если вы пишете на иностранных языках, то используйте общеизвестные слова или добавляйте снизу перевод. Например, к слову SALE народ долго привыкал, но уже знает его значение. Зато такие слова, как OUTLET, вызывают непонятки даже у самих отправителей. Одни имеют ввиду просто скидку, другие — продажу последних размеров, а на самом деле аутлеты — это магазины, в которых продаётся брендовая одежда с большими скидками.
Та же история с Киберпонедельниками, вторниками и пятницами. Все подхватили это слово, даже не понимая его смысл.

Используйте различные баннеры в каждом письме

Исключение могут составлять:

  • центральные баннеры, сопровождающие повторяющуюся акцию, но не слишком часто;
  • баннеры, которые находятся в футере письма: постоянные акции, преимущества магазина, приглашение в соц.сети, сбор дополнительных данных и т. д.

Неизменные баннеры в письме

Учитывая эти приёмы и примеры в составлении баннеров, вы сможете почувствовать себя творцом не только прекрасного, а и полезного для ваших писем. Знания Photoshop, Gimp и немного эстетического вкуса тоже не помешают:)

До новой встречи! ;)

Только для подписчиков: 
НЕ Только для подписчиков

Добавить комментарий

Когда нужно сделать баннер, а вы не дизайнер...