Универсальный шаблон — это набор блоков в фирменном стиле, из которых можно собрать письмо на любой случай: от подтверждения подписки до опроса. Рассказываем, какие проблемы он решает и как ускоряет запуск рассылок.
23 сентября 2019
Как ускорить верстку email-рассылок с помощью универсального шаблона
Как ускорить верстку email-рассылок с помощью универсального шаблона
Универсальный шаблон — это набор блоков в фирменном стиле, из которых можно собрать письмо на любой случай: от подтверждения подписки до опроса. Для наших клиентов создание одного шаблона входит в стоимость подписки: разработку доверяем email-маркетинговым агентствам, например Email Soldiers и Out of Cloud.
Шаблон разверстываем под параметры Mindbox в визуальном конструкторе или HTML-редакторе. На этом всё — собрать письмо из готовых блоков можно за 60 секунд. Расскажу о том, какие проблемы решает универсальный шаблон, как он ускоряет запуск рассылок, и про процесс его создания.
Пример письма, сверстанного в визуальном конструкторе
Если компания отправляет только дайджест раз в месяц, универсальный шаблон не нужен — с подготовкой рассылок справятся верстальщик и маркетолог. Но когда количество массовых рассылок увеличивается, появляются триггерные рассылки с персонализированным контентом, создавать каждое письмо вручную становится слишком долго.
Самостоятельно разработать универсальный шаблон письма сложно: нужны знания и в дизайне, и в email-маркетинге. Правильнее и проще заказать шаблон у агентства, которое специализируется на email-маркетинге, как мы и делаем.
Мы создаем заранее стандартные блоки письма, для каждой новой рассылки только меняем расположение элементов и контент, но не дизайн — это ускоряет запуск рассылок: собрать новую с нуля получится примерно за 30 минут против почти трех часов работы верстальщика и маркетолога.
Блоки с разверстанными параметрами загружаются в визуальный конструктор Mindbox или HTML-редактор. У email-маркетолога появляется больше свободного времени для создания и тестирования гипотез, разработки новых механик. Доходность прямых коммуникаций растет.
Как устроен процесс работы
Этап первый: создаем универсальный шаблон письма
Первый шаг в подготовке шаблона — бриф. Запрашиваем у клиента брендбук, фирменный шрифт, примеры рассылок, которые нравятся. Если брендбука нет, ориентируемся на внешний вид сайта или старые письма. Также выясняем, какие пункты меню и категории товаров должны быть в письмах, будут ли использоваться гифки, динамический контент и NPS-опросы. Всего обсуждаем 19 пунктов. Подготовка универсального шаблона занимает примерно две недели: показываем клиенту промежуточный результат и вносим правки, если требуется.
На выходе получаем длинное письмо с блоками, покрывающими ключевые сценарии email-маркетинга. Условно их можно разделить на две группы: обычный контент и блоки для динамического содержания. Контентные блоки — это элементы с заголовком, текстом и изображением, которые не меняются в зависимости от получателя. Динамический контент — это блоки с товарами с корзине или рекомендациями и прочие.
Разделы шаблона интуитивно понятны: очевидно, куда подставлять промокод, а где размещать блок со списком товаров.
Шаблон письма Твой дом
Шаблон письма StartTrack
Шаблон письма Киномакс
Примеры универсальных шаблонов для наших клиентов
Универсальный шаблон включает четыре обязательных раздела: прехедер, хедер (шапка письма), тело письма, подвал письма (футер).
Прехедер — самая простая часть письма: содержит тему и ссылку на веб-версию, которая нужна, если не загрузились изображения. Шапка обязательно включает логотип компании и опционально — контактные данные и пункты меню.
Прехедер и хедер не должны быть перегружены лишней информацией
Тело письма содержит основную информацию, которую хотим донести до получателя. Перечень блоков зависит от особенностей бизнеса клиента. В универсальном шаблоне это:
- Варианты оформления кнопок.
- Разные дизайны блоков с контентом.
- Блок с промокодом.
- Разные типы товарных сеток (отличных по количеству товаров в ряду, по расположению картинки и текста и так далее).
- Блок с NPS-опросом.
Раздел с CTA и блоком для промокода
Раздел с разными вариантами товарных сеток
Раздел с корзиной и NPS-опросом
Футер обязательно содержит ссылку на отписку от рассылки. Другие элементы: контактная информация, сноски и ссылки на соцсети.
Без ссылки на отписку письмо гарантированно попадет в спам
В универсальном шаблоне все блоки правильно отображаются в Google, Yandex, Mail и Outlook. HTML-код размечен подсказками, чтобы было видно, какой кусок кода за что отвечает.
Подсказки в коде ускоряют работу с шаблоном
Этап второй: разверстываем письма под параметры
Когда шаблон отрисован и сверстан, маркетолог из готовых блоков собирает письма в визуальном конструкторе или в HTML-редакторе. Менеджер Mindbox расскажет, как разверстать получившиеся элементы под параметры платформы. Например, если подставить параметр ${Recipient.OnlyStandardFirstName}, в письмо подставится имя получателя. Это произойдет только в том случае, если имя стандартное, то есть Василий, а не Солнышко77.
Разовая подготовительная работа занимает около трех часов: час на перенос шаблона в визуальный конструктор и ещё два часа — на развертывание параметров. С помощью параметров мы добавляем динамические элементы в письмо, например:
- Вывод просмотренных товаров или товаров из корзины, избранного.
- Вывод номера заказа, состава, суммы, прочих полей — например, способа и стоимости доставки.
- Вывод количества баллов на бальном счете конкретного клиента.
- Вывод блоков с товарными рекомендациями.
- Другие идеи для персонализации писем: например, если хотим менять цвет фона в зависимости от пола, подставлять баннер в зависимости от пола или сезона, выводить контент только для определенного сегмента клиентов.
С помощью параметров можно сделать письма красивее: автоматически изменять размер изображений, отбрасывать знаки после запятой, чтобы в цене не указывались копейки, ставить пробелы между разрядами в больших суммах, сокращать слишком длинные названия и не отображать товар, если у него не хватает какого-то элемента, например цены.
Этап третий: собираем письма из готовых блоков
Письма собираются либо в визуальном конструкторе, либо в HTML-редакторе. Первый вариант простой и быстрый, второй сложнее, но и более гибкий — подходит для «продвинутых» пользователей. Расскажем о сборке письма на примере визуального конструктора.
Каждый блок универсального шаблона добавляем в визуальный конструктор. Он построен по принципу drag-and-drop: элементы меню перетягиваются в тело письма. Обучаться работе с инструментом не нужно — все действия интуитивно понятны.
Принцип drag-and-drop в действии
Готовый шаблон можно сохранить и использовать для новых рассылок. Это удобно, если компания регулярно отправляет похожие письма, например, квартальный дайджест. Также можно сохранять отдельные блоки шаблона, чтобы переиспользовать их в других письмах.
Программу лояльности Under Armour запустили за два дня: все рассылки на проекте верстались в визуальном редакторе
Заключение
Универсальный шаблон письма и визуальный конструктор облегчают подготовку рассылок: готовые брендированные блоки быстро собираются в готовые письма. Вся работа занимает меньше месяца: две недели на разработку и утверждение универсального шаблона, три часа на его перенос в визуальный шаблон и разверстывание параметров и примерно полчаса на создание каждой новой рассылки.
