Базовые правила оформления email-рассылок: структура, элементы, текст, дизайн

Базовые правила оформления email-рассылок: структура, элементы, текст, дизайн

Часть маркетологов уверена, что email-маркетинг давно себя исчерпал. Но рассылки по-прежнему приводят лидов и повышают продажи. Так, в 2021 году электронные письма принесли интернет-магазинам от 7 до 15% выручки.

Чтобы этот канал действительно работал, письма нужно правильно оформлять. Делимся рекомендациями.

Структура письма

Структура писем сходна со структурой стандартной веб-страницы. В него входит пять основных компонентов:

  1. Самая верхняя часть с темой письма и полем «От кого».
  2. Прехедер — короткое сообщение под темой, которое отражает суть письма.
  3. Хедер или шапка письма — область под прехедером, в которой размещают логотип и другие элементы фирменного стиля.
  4. Тело письма — самая информативная часть письма, в которой располагают тексты с картинками.
  5. Футер — нижняя часть, в которой находятся кнопка отписки, контакты, иконки социальных сетей.
Базовая структура письма.
Базовая структура письма.

Основные элементы и правила их оформления

Вот на что следует обращать внимание при подготовке каждого элемента письма.

Тема письма

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

Заголовок должен соответствовать содержанию письма. Не обещайте того, чего в нём нет — иначе подорвёте доверие пользователей.

Для темы не используйте длинные фразы и штампы. Ограничьтесь одним коротким предложением. Также не стоит указывать имя отправителя. Если уместно, поставьте эмоджи.

Рекомендации:

  • Сделайте заголовок информативным. Кратко опишите цель рассылки и укажите, о чём пойдёт речь. Не забудьте также сообщить о выгоде, которую получит подписчик, если откроет письмо.
  • Обращайтесь по имени. Пишите в теме имя клиента. Это рабочий способ, но только есть вы собрали настоящие имена клиентов.
  • Призывайте к действию. Не стесняйтесь использовать глаголы в повелительном наклонении: купите, подпишитесь, узнайте и другие. Так вы мотивируете пользователя выполнить целевое действие.

Прехедер

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

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

Другой момент, эстетический. Если этого блока не будет, почтовая программа произвольно подтянет текст из тела письма. Обычно это первая строчка рассылки. Но не исключено, что в прехедер попадёт любой рандомно выбранный элемент: alt-текст из баннера или телефон из подвала. Тогда блок будет смотреться некрасиво. Более того, письма без прехедера почтовые сервисы могут пометить как спам.

Зато если блок есть, открываемость повышается на 30%.

Часто в прехедер вставляют ещё служебные ссылки вроде «Открыть в браузере» или «Отписаться».

Рекомендации:

  • Делайте прехедер ясным и лаконичным. Самое важное выносите вперёд, чтобы пользователь понял суть, даже если часть текста обрежется.
  • Добавьте пользы. Продолжите мысль из заголовка и уже более подробно опишите, что хотите предложить. анонс распродажи, подборку новых статей или подарок за подписку.
  • Используйте эмодзи. Добавьте эмодзи — это выделит письмо. Кроме того, с помощью таких символов можно заменять длинные слова и даже целые фразы.
  • Персонализируйте. Обращайтесь к подписчику по имени и пользуйтесь другой информацией, которую вы уже о нём знаете: указывайте на совершённые действия или купленные товары. Так вы усилите эмоциональную связь с клиентом, а сама рассылка станет более личной. Такое внимание к интересам и потребностям очень подкупает.

Правило

Допустимая длина:

для мобильной рассылки — не более 50 символов

для десктопный рассылки — до 130 символов


Базовые правила оформления email-рассылок: структура, элементы, текст, дизайн
Базовые правила оформления email-рассылок: структура, элементы, текст, дизайн
Примеры прехедеров, который сообщают о выгоде для подписчика.
Примеры прехедеров, который сообщают о выгоде для подписчика.

Шапка письма или хедер

Хедер — верхняя часть письма, расположенная перед текстом, которая задаёт общее настроение рассылки и делает её узнаваемой. Шапка помогает идентифицировать бренд, создавая с ним определённые ассоциации.

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

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

Часто компании создают одну шапку, которую потом используют для всех email-рассылок.

Рекомендации:

  • Не перегружайте хедер. Постарайтесь не добавлять в блок слишком много ссылок или текста — шапка должна быть сдержанной. Ведь её главная задача — обозначить отправителя и побудить прочитать его, а не увлечь. Многие компании обходятся здесь только логотипом или названием.
  • Используйте фирменные цвета. Проследите, чтобы цвета сочетались с другими блоками рассылки. Это позволит шапке лучше справляться со своими задачами.

Подвал письма или футер

Футер или подвал — самая нижняя часть письма после текста, которая содержит дополнительную информацию о компании.

Обязательный элемент блока — ссылка на отписку от рассылки. Её наличия требуют почтовые службы — без неё письма могут попасть в спам.

Также в футере размещают:

  • контактные данные,
  • ссылки для перехода в социальные сети,
  • кнопку «Поделиться»,
  • всевозможные дисклеймеры.

Подвал, как и шапка, может быть одинаковым во всех рассылках.

Рекомендации:

  • Выделите ссылку на отписку. Убедитесь, что ссылка заметна, и её легко найти. Можно просто подчеркнуть элемент — даже этого будет достаточно.
  • Сделайте футер менее ярким. Проверьте, чтобы шрифты и цвета в подвале отличались от остальных элементов. Обычно этот раздел менее яркий по сравнению с другими.
Базовые правила оформления email-рассылок: структура, элементы, текст, дизайн

Поле «От кого»

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

Есть несколько вариантов, кого указывать в качестве отправителя:

Только название компании подойдёт, если нужно сделать рассылку по всем клиентам.

Пример названия компании в поле «От кого».
Пример названия компании в поле «От кого».

Название компании + имя сотрудника. Это сочетание подойдёт, если в компании несколько разных email-рассылок, каждую из которых готовит отдельный сотрудник и отправляет со своей личной почты. Например, дайджест новостей делает один, служебные сообщения — второй, а письма по обновлениям продукта — третий. При этом у каждого уже может быть своя собственная база, а с подписчиками уже налажен контакт: они активно отвечают на письма и задают вопросы.

Базовые правила оформления email-рассылок: структура, элементы, текст, дизайн

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

Базовые правила оформления email-рассылок: структура, элементы, текст, дизайн

Правило № 1

Не пишите обобщённые названия вроде do-not-reply или news.

Правило № 2

Допустимая длина имени — не более 20 символов.

Дизайн

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

Шрифты

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

Шрифты для email-рассылок.
Шрифты для email-рассылок.

В свою очередь, эти шрифты можно поделить на две группы:

  • Антиква (с засечками) — Times New Roman, Georgia, Palatino
  • Гротеск (без засечек) — Helvetica, Arial, Verdana

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

Так выглядят антиква и гротеск.
Так выглядят антиква и гротеск.

В рассылках не стоит пытаться использовать как можно больше шрифтов. Письмо будет выглядеть перегруженным и неаккуратным. Выберите один-два шрифта — этого достаточно. Например, Helvetica и Times New Roman — хорошее сочетание.

Стандартный размер шрифта составляет 12–16 пикселей. Размер для заголовков в теле письма — 28-32 пикселя.

Цвета

Рассылки стоит делать в фирменных цветах компании. Яркие оттенки можно использовать для важных компонентов: шапки, кнопок призыва к действию (CTA) , иллюстраций и ссылок. Комбинируйте их с более нейтральными и мягкими.

Контрастная кнопка «Купить» в рассылке «ЛитРес».
Контрастная кнопка «Купить» в рассылке «ЛитРес».

В письме может присутствовать не больше трёх цветов. Беспроигрышный вариант — чёрный шрифт на белом фоне. Ещё оптимальным сочетанием считается тёмно-серый для текста и белый для фона.

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

Изображения

Изображения в email-рассылках требуется не столько ради красоты: они дополняют и усиливают основную идею письма.

Количество картинок следует подбирать исходя из задачи рассылки. Например, если это подборка товаров — хватит баннера с оффером, а тело письма может состоять из блоков рекомендаций с кнопками.

Оптимальное соотношение: 60% на 40% в пользу текста.

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

Вступительный баннер в рассылке «СберМаркета» выполнен в фирменном стиле сервиса.
Вступительный баннер в рассылке «СберМаркета» выполнен в фирменном стиле сервиса.

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

Поэтому изображения нужно сжать. К счастью, здесь не требуется высокое качество. Уменьшить размер картинок можно с помощью специальных сервисов: Tinypng, Squoosh, Optimizilla.

Оптимальный вес картинок составляет 200 кб — так они будут загружаться всего секунду. При этом вес самого письма без учёта картинок должен быть не больше 100 кб.

Максимальная ширина изображения — 600 пикселей, высота — 300-500 пикселей. Ориентируйтесь на то, чтобы и картинка, и баннер помещались на один экран.

Правило

Не стоит:

1. превращать письмо в одну сплошную картинку

2. использовать фоновые изображения

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

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

Вёрстка

Чтобы рассылка хорошо отображалась и на десктопе, и на мобильных устройствах, предусмотрите адаптивный дизайн.

Дело здесь не только во внешнем виде письма: из-за разницы в разрешении экранов текст может стать нечитаемым, а ссылки и кнопки съедут или окажутся сильно мелкими.

Оптимальная ширина шаблона для писем — 600–700 пикселей с учётом отступов. Распространённая ширина экрана на смартфонах — 320 пикселей. Размер кнопок может варьироваться от 35 до 47 пикселей.

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

Сервисы email-рассылок позволяют автоматически адаптировать письма под эти требования. Но лучше перед проверкой дополнительно проверить готовое письмо.

Текст

Текст находится в теле письма. Это, собственно, то, ради чего мы отправляем рассылки и ради чего сюда пришёл пользователь. Основное содержание.

Для разных рассылок нужен разный объём текста. Письма с коротким текстом подойдут для подборок товаров, анонсов, оповещений о скидках и акциях. Более длинные тексты следует писать для дайджестов и обучающих рассылок.

Рекомендации при подготовке текста:

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

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

Используйте личные местоимения второго лица. Говорите не о себе («Мы предлагаем…») , а о покупателях. Ведь вы делаете рассылку прежде всего для них. Поэтому всё время переводите фокус на клиента и обращайтесь к нему во втором лице: например, вместо «Мы научим вас делать исследования рынка» пишите «Вы научитесь делать исследования рынка».

Персонализируйте. Персонализировать следует не только тему и прехедер, но и сам текст — тогда больше вероятность, что письмо достигнет цели. Для этого аккуратно используйте в сообщении свои знания о клиенте, полученные на основе предыдущих рассылок и его действий на сайте: просмотров, переходов и добавления в корзину.

Например, можно включить в письмо блок с товарными рекомендациями с персональным предложением для клиента.

Рассылка магазина «Ножиков» с товарными рекомендациями.
Рассылка магазина «Ножиков» с товарными рекомендациями.

Грамотно оформленное письмо поможет лучше донести ценность продукта, повысить лояльность клиентов, и, как следствие, продажи.

Рассылки стоит делать в фирменных цветах компании, шрифт стандартным, а изображения — нетяжёлыми. Мы рекомендуем подготовить единый шаблон, который вы можете слегка менять для разных рассылок.

66
Начать дискуссию