Бывает, что письмо идеально выглядит в браузере, но некрасиво разъезжается в мобильном приложении. Такая проблема с отображением может возникнуть из-за обилия программ и сервисов для чтения почты. Помните, что существуют как почтовые сервисы, так и клиенты? Речь как раз об этом.
Поэтому сверстать письмо нужно так, что оно везде смотрелось хорошо — в разных браузерах, почтовых сервисах и смартфонах. Сложные письма верстаются вручную в специальных редакторах кода: сначала дизайнер создаёт макет, а затем специально обученные верстальщики реализуют его в HTML.
Но есть и другой способ, который не требует специальных знаний в языках программирования — можно собрать письмо в блочном редакторе писем.
Блочный редактор писем
Блочный редактор писем (или визуальный редактор) — это как конструктор, который работает по принципу drag-and-drop: выбираете нужные блоки и перетаскиваете их в рабочее поле. В каждый блок можно загружать изображения, менять текст или цвет фона — там уже учтены все нюансы по адаптации макета к мобильным гаджетам, поэтому можно сосредоточиться на работе с контентом.
Такой редактор поможет с нуля создать любой вид рассылки — письмо с акцией, дайджест или товарную подборку. Кстати, в Sendsay есть свой блочный редактор писем, с помощью которого вы можете собрать письмо без дизайнера и знаний о HTML.
Элементы письма
Чтобы создать email-рассылку, прежде всего важно понимать структуру таких писем. Глобально каждый email состоит из хедера (его ещё называют шапкой), тела письма и футера (или подвала).

- Хедер (или шапка письма) должен включать логотип компании со ссылкой на сайт. Сюда же можно добавить веб-версию, контакты или меню с разделами вашего сайта для быстрого доступа.
- Тело письма и его содержание зависят от цели рассылки. Любое письмо состоит из одного или нескольких блоков с разным контентом. В каждом блоке выделяют три основных элемента: баннер, текст и кнопка с призывом к действию.
- Футер (подвал) отображает контакты, ссылки на соцсети, ссылку отписки и информацию о том, почему подписчик получил это письмо.
Ссылка отписки
Говоря о футере, мы сталкиваемся с важным правилом email-маркетинга: ссылка отписки — строго необходимый элемент письма.
Таковы требования законодательства: если клиент больше не хочет получать письма, нужно дать ему возможность отписаться. Если же не дать человеку ссылку на отписку, скорее всего он отправит письмо в спам. Другими словами, это дверь, которая всегда должна быть открыта.
Подробнее об отписке и почему она так важна мы ещё поговорим в следующих уроках, а пока перейдём к вышеупомянутой веб-версии письма.
Веб-версия письма
Это ссылка внутри рассылки, которая открывает то же самое письмо, но только в браузере — и позволяет посмотреть его как веб-страницу. Например, если у подписчика отключены картинки в почте, он всё равно сможет просмотреть полную версию письма по этой ссылке.
Представьте: вам приходит настолько классное письмо, что хочется поделиться им с друзьями или коллегами. Для этого в рассылку и добавляют ссылку на веб-версию — чтобы вы могли просто скопировать адрес и отправить в общий чат, не пересылая письмо.
Обычно ссылку на веб-версию добавляют в шапку письма — чтобы подписчики заметили её при первом взгляде на рассылку.
Иногда ссылку на веб-версию добавляют и в подвал — вместе со ссылкой отписки.

Ни одна рассылка не обходится без кнопок, ведь это и есть то самое целевое действие, которого мы ждём от подписчиков:
Открыл письмо → нажал на кнопку → перешёл на сайт → купил 🎉
Подробнее о кликах в рассылках мы поговорим в следующих уроках, а пока несколько рекомендаций, касаемо самих кнопок.
СТА-кнопка (call to action — призыв к действию, англ.) — важный элемент каждого письма, который призывает совершить целевое действие. Именно поэтому такая кнопка должна:
- быть заметной и контрастной,
- призывать к актуальному действию.
Поэтому лучше использовать сильные глаголы действия вроде «Купить», «Подписаться», «Посмотреть» и тому подобные:

А теперь взгляните на несколько писем одной компании:

Эти три письма объединяют не только шапка с подвалом, но и фирменные цвета, логотип и другие элементы, схожие с оформлением сайта.
Так в сознании подписчиков закрепляется образ бренда, поэтому важно придерживаться единого стиля в оформлении писем.
Контент рассылки
Самое важное — это содержание рассылки. Говоря о структуре письма, можно выделить 3 основных вида блоков в теле email-рассылки, которые отражают цель рассылки: это главный баннер, товарные блоки и контентные блоки.
Главный баннер. Это центр притяжения, его цель — рассказать о самом важном. Поэтому баннер должен не только привлекать внимание, но и передавать суть рассылки. Для этого на баннер часто добавляют заголовок.
Есть ещё товарные блоки, которые отображают карточки товаров. Основная цель такого блока — познакомить с товарами и подтолкнуть к заказу, поэтому сюда часто добавляют кнопки со ссылками на конкретные товары или категории. Ещё можно добавить описание, цену или размер скидки, чтобы привлечь получателя и показать ему выгоду.
Загляните в свою почту: обычно товарные блоки в рассылках используют интернет-магазины и все те компании, которые что-то продают (то есть, практически все).
Но мы хотим не только продавать, но и приносить подписчикам полезный контент — чтобы они не отписались от рассылки сразу. Для этого используются контентные блоки. Их главная задача — информировать, а не продавать: они помогают закрывать возражения и формировать доверие читателей рассылки.
Часто такие блоки состоят из заголовка, текста и кнопки, иногда сюда добавляют картинку.
Чтобы понимать, как именно разместить контент в письме и какие блоки использовать, можно подсматривать за рассылками других компаний. Для этого ещё в первом уроке мы просили вас подписаться на письма любимых брендов — и тренировать насмотренность.
Но чтобы пошаговый план действий был всегда под рукой, мы подготовили для вас рецепт хорошего письма.
Рецепт хорошего письма
Шаг 1. Цель письма. Определите, о чём вы хотите оповестить своих подписчиков. Цель поможет понять содержание рассылки.
Шаг 2. Шапка письма. Добавьте логотип компании со ссылкой на сайт. Опционально — номер телефона компании, ссылки на разделы сайта и веб-версию.
Шаг 3. Главный баннер. Изображение должно привлекать внимание и отражать суть рассылки, её цель.
Шаг 4. Тело письма. Определив цель, соберите письмо из блоков.
В рассылке должна быть чёткая структура и выстроена логика:
- каждый раздел содержит краткий заголовок — о чём этот раздел,
- текст в блоке коротко поясняет его суть и вовлекает подписчика продолжить чтение. Формулировки не повторяются ни в одном из разделов,
- текст на кнопках отражает то, что подписчик должен сделать после прочтения. Они призывают к действию коротким текстом (1–2 слова) с сильным глаголом — «Посмотреть», «Узнать», «Купить», «Оформить».
Шаг 5. Подвал. Добавьте контакты, ссылки на соцсети и ссылку отписки. Если письмо об акции, пропишите в подвале полные условия акции (дисклеймер).
Шаг 6. Тема и прехедер. Подумайте, как привлечь внимание читателя среди десятков других писем в папке «Входящие». Тема и прехедер должны отражать суть рассылки, чтобы не разочаровать получателя при открытии письма.
Шаг 7. Отправитель письма. Проверьте, чтобы имя отправителя и его аватар определяли, от кого пришло письмо.
Конспект урока
✔️ Создать рассылку, которая будет красиво отображаться на десктопе и в мобильном устройстве, можно в блочном редакторе писем.
✔️ В рассылках лучше использовать одинаковую шапку и футер, фирменные цвета, логотип и другие элементы, схожие с оформлением сайта.
✔️ Веб-версия письма позволяет посмотреть рассылку как веб-страницу в браузере.
✔️ Письмо состоит из хедера (или шапки), тела письма и футера (или подвала).
✔️ Главный баннер — это центр притяжения внимания читателя, а его цель — рассказать о самом важном.
✔️ Цель товарных блоков — продать, а контентных — информировать.
✔️ СТА-кнопка призывает получателей совершить целевое действие, поэтому она должна быть заметной и призывать к действию.
✔️ Ссылка отписки — строго обязательный элемент в подвале рассылки.
Практическое задание
- Придумайте акцию для повышения продаж вашей компании.
- Перейдите в блочный редактор Sendsay и создайте шаблон рассылки, которая будет отвечать вашей цели.
Инструкции, которые вам пригодятся:
- Как создать письмо в блочном редакторе
- Прехедер письма: что это, какие бывают и как их создать
- Веб-версия письма
Ну что, готовы собрать своё первое письмо? Тогда переходите к практическому заданию. А в следующем уроке мы поговорим о том, как настроить отправку рассылки так, чтобы попасть в сердечки подписчиков, — о сегментации и персонализации.
Следующий урок: как попасть в сердечки подписчиков →