Работа с блоком "Баннер"

Как создать баннер для рассылки, когда под рукой нет Photoshop, а в команде - дизайнера? Легко! Вы можете создать баннер прямо в письме, не используя сторонние графические редакторы. Давайте разберем на примере email рассылки для туристической компании, как это сделать

Создание баннера для емейл-рассылки

Для начала нам нужно создать структуру и выбрать блок ”Баннер” на вкладке “Контент”:

Перетаскиваем этот блок в тело письма:

Подготовьте фон

Основа любого баннера - картинка. Для нашего примера подберем заманчивое изображение моря. Вы можете использовать встроенный фотобанк и искать картинку по ключевому слову:

А можете подобрать подходящее изображение в сети и загрузить его по ссылке на картинку или просто перетянув его в указанное место:

Будьте внимательны - допускается изображение размером не больше 2 Мб, для быстрой загрузки в письме и корректного отображения на всех устройствах.

После загрузки изображения есть возможность показать его частично или полностью, с помощью форм-фактора:

Эта функция определяет внешний вид будущего баннера, который может быть вертикальным, квадратным и горизонтальным:

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

К изображению можно применить любой из фильтров на выбор:

Обязательно прописывайте ссылку на сайт или акцию, которую рекламирует баннер в email-рассылке, чтобы сделать его кликабельным. Также внесите альтернативный-текст в соответствующее поле - он отобразится, если картинка не покажется в письме.

На баннер можно поставить одно дополнительное изображение, например ваше лого:

Изображение можно разместить в любой части баннера в произвольном порядке или придерживаясь симметрии. Зажав Shift на клавиатуре, изображение можно перемещать по обозначенным сеткам:

Не забудьте включить соблюдение пропорций, если будете масштабировать второе изображение:

Вы можете разместить второе изображение в любой части баннера:

Содержимое баннера

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

Если нужно создать баннер, как в примере - будьте готовы к тому, что придётся его порезать на части, чтобы отдельно были активными соответствующие ссылки "Парни" и "Девушки". Но давайте, рассмотрим более простые примеры, когда в картинку зашита всего одна ссылка на общую категорию.

В редакторе eSputnik есть возможность добавлять текст прямо на изображение:

Текстовый контейнер можно перемещать по всей площади баннера:

Подберите шрифт

Вы можете использовать 1-2 шрифта на одном баннере, чтобы сделать акцент и подчеркнуть выгоду вашего предложения. В системе шрифты разделены на несколько групп:

• стандартные   
• нестандартные
•  шрифты баннера

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

Примеры использования баннера в рассылках

Давайте на примерах рассмотрим, как можно с помощью баннера оживить письмо.

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

1. Иллюстрация к статье

Такой баннер состоит из трех элементов: картинки, дополнительного изображения и текста

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

И сам блок с текстом:

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

2. Баннер как шапка в письме

Баннер может выполнять функцию хедера в письме. Разместите логотип на подходящем фоне, добавьте краткое описание или слоган компании - и хедер готов.

3. Продающий баннер

Такой баннер должен содержать в себе суть вашего предложения и призыв к действию

Он состоит из трех элементов:

• Базовой картинки

• и двух текстовых блоков

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

Подведем итог

• С помощью нашего редактора вы сможете создавать баннер для рассылки, не прибегая к помощи графического редактора. 
• Все необходимые элементы встроены в редактор. 
• Вы можете редактировать любые слои изображения и применять эффекты в блоке «Баннер».