Когда мы определились, как, кому и когда мы будем делать рассылку, дело остаётся за малым: составить письмо так, чтобы подписчик его заметил, прочитал и выполнил целевое действие.
Тема, отправитель, превью
Если театр начинается с вешалки, то рассылка традиционно начинается с отображения письма в почтовом ящике подписчика. Зачастую и в десктопной, и в мобильной версии пользователь видит три строчки: отправитель письма, тема письма и начало первой строки (превью). Почему же это важно? Потому что это — первый этап в цепочке конверсии. Среди всех писем в его ящике пользователь должен в первую очередь обратить внимание на ваше и захотеть открыть именно его.
Начнём с отправителя. Во-первых, пользователь с первого взгляда должен узнать название того сервиса, на котором он подписывался на рассылку. Если он не понимает, кто ему пишет, то сразу удалит сообщение или того хуже — отправит его в спам и заблокирует отправителя. Поэтому вы можете 1) в графе отправителя написать название сервиса/сайта, от которого проводится рассылка, 2) добавить человеческое имя отправителя: получить письмо от «Наташа из BestCashBack» намного приятнее, чем от безликого BestCashBack, 2) по возможности добавить так называемый фавикон (favicon) — маленькую версию логотипа (если он есть), которая отражается в некоторых версиях почтовых клиентов.
Насколько по-разному выглядит рассылка от имени представителя компании и от бренда
Пример использования фавикона у Lamoda и re:Store; Pudra же такой возможностью пренебрегает
Далее — превью: несколько слов из письма, которые видно пользователю ещё до того, как он его откроет. Обычно почтовый клиент автоматически подтягивает из письма первые слова, не различая содержимое: это могут быть пункты меню, названия социальных сетей, кнопки на которые находятся в шапке письма, всевозможные внутренние пометки, скрытые для глаза читателя.
Пример неудачного превью: подтягивается весь текст с самого первого слова в письме, при это он не нацелен на то, чтобы конвертировать просмотр письма в его открытие
Чтобы это исправить у вас есть два варианта: добавить открытый или спрятанный прехедер. В первом случае вы используете код:
<body>
<div>
Текст для прехедера
</div>
</body>
Тогда в превью появляется текст прехедера, но он же появляется первой строкой и в самом письме. Если вы хотите скрыть текст прехедера, оставив его только в превью, используйте код:
<div style=»display:none;max-height:0px;max-width:0px;opacity:0;overflow:hidden;»> Текст прехедера </div>.
Также при выборе текста для превью необходимо не забывать про его длину: в зависимости от почтового клиента и используемого устройства он может быть от 32 до 140 знаков (привет, Твиттер 2016 года). Поэтому следуем правилу «чем меньше, тем лучше».
Теперь по содержанию превью: очевидно, в первую очередь необходимо указать самую важную информацию из письма, тот веский повод, из-за которого пользователь должен это письмо открыть. Скатываться до примеров тизерной рекламы не нужно, спойлерить и прямым текстом выкладывать суть письма тоже не обязательно, но заинтриговать пользователя стоит: «Успейте получить самую большую скидку сезона», «Открылась регистрация на эксклюзивный вебинар», «Подборка лучших предложений» — текст превью сродни заголовку, должен вызывать интерес и давать подсказку о содержании письма.
Последнее, но не по значению, — это тема письма. О том, что она должна быть короткой, ёмкой и цеплять с первого взгляда, многие гуру e-mail маркетинга писали не раз. Здесь есть два варианта: либо вы уместите в ней максимум информации в минимуме текста («Топ-10 лучших скидок недели», «Самые популярные товары месяца», «Самые необычные подарки на 8 марта»), либо придумаете нечто необычное, чтобы подписчик подумал «А что же хотел сказать автор?» и непременно решил ознакомиться с содержимым письма.
Пример креативного подхода к теме письма у сервиса Invisible: провокационные короткие заголовки выделяются среди остальных писем и так и требуют, чтобы по ним кликнули
Ещё одна фишечка, которой пользуются рассыльщики для привлечения внимания к письму — добавление в заголовок эмодзи. Помимо придания письму эмоциональной окраски такие вставки выгодно выделяют письмо среди остальных сообщений в ящике. Но и здесь не всё так просто: в зависимости от операционной системы, устройства, почтовой программы иконки могут отображаться по-разному: быть цветными, монохромными белыми, выглядеть как неопределённый символ (обычно вместо них ставится квадратная рамочка) или пропадать вовсе. Рекомендуем вам выбирать наиболее используемые символы — так будет меньше вероятности того, что они будут неправильно отображаться или вовсе пропадут.
Пример использования эмодзи «ключика» в теме письма «Ваш ключ к закрытой распродаже»
Активно использует эмодзи в своих рассылках Lamoda: чёрные круги в честь «Чёрной пятницы», салюты в честь распродаж и тематика одежды и обуви. Обратите внимание на заглавные буквы: простой приём, который позволяет расставить акценты в теме письма.
А в этом случае эмодзи не отразились в превью письма Lamoda…
…но показались в графе темы письма после того, как его открыли.
Нарисуйте план письма от руки на бумаге, и только потом переносите его в электронный вид. Внести правки на бумаге намного проще, чем в HTML-вёрстке. Да, когда у вас появится устоявшийся шаблон письма, бумажным черновиком можно будет пренебречь, но на первых порах лучше потренироваться на бумаге. Имея перед глазами план, построить письмо на его основании будет намного проще, чем примерять расположение блоков и гонять их туда-сюда по письму в попытках подобрать идеальный вариант.
Текст должен оставаться текстом, а картинки картинками. Если вы решите сверстать письмо в графическом редакторе в виде изображения (чтобы не потерять стили шрифтов и вёрстку), то рискуете оставить читателя без текста письма вовсе: многие почтовые клиенты по умолчанию не прогружают изображения в письме без команды пользователя. Заставлять их нажимать кнопку «Показать картинки», чтобы ознакомиться с содержанием письма — это добавлять лишний шаг в цепочке конверсии.
Как одно и то же письмо выглядит при выключенных картинках…
…и когда картинки по умолчанию включены.
Не перегружайте письмо графикой и сложной вёрсткой. Помимо того, что изображения могут не отображаться, вёрстка может поехать, и ваше прекрасное послание превратится в месиво из текстовых и графических блоков. Если вы не уверены, что сможете воплотить все свои дизайнерские фантазии в жизнь и протестировать их на всех возможных устройствах и почтовых клиентах, лучше не мудрить и сделать что-то, что даже в случае небольших косяков вёрстки будет выглядеть приемлемо.
Продумайте логику «десктоп-мобайл». Как будут вести себя блоки с информацией при переходе с одного устройства на другое? Как будут меняться размеры изображений, шрифты, какой будет порядок текста, если он разбит на несколько равнозначных колонок? Как будут сочетаться друг с другом разноцветные блоки? И что будет, если горизонтальный блок, оформленный градиентом, при переходе на мобайл с десктопа будет превращаться в вертикальный? Письмо должно адаптироваться и под широкий экран десктопа, и под планшет, и под смартфон, соответственно, при переходе с одного устройства на другое логика восприятия контента страдать не должна.
И ещё немного о шрифтах. Подберите такой шрифт, в котором буквы не будут «слипаться» друг с другом при переходе на более маленький экран. Для объемных блоков текста рекомендуется использовать шрифты с засечками: как бы показывая направление чтения с помощью этих самых засечек, шрифт тем самым упрощает чтение. Подбирайте стандартные шрифты — так ваша вёрстка не уедет на тех устройствах, которые нестандартные шрифты не поддерживают. Если вам всё же хочется поиграться со шрифтами, сделайте его картинкой, но не увлекайтесь: пусть он будет в заголовке письма, но не в основном тексте.
Делайте ширину письма не больше 600px — так оно будет полностью отображаться в любом почтовике, и на смартфоне, и на компьютере. Оставшееся место можно занять фоном нейтрального цвета или с паттерном фирменного стиля компании: в одних почтовиках он может обрезаться, в других — быть видимым.
Кнопки и ссылки должны использоваться по назначению, а именно просто находиться и без проблем нажиматься. Особенно это важно для мобильной версии: делайте кнопки крупными, контрастными, в зоне досягаемости большого пальца, которым пользователь обычно скроллит ленту и взаимодействует с сенсорным экраном мобильного девайса. Так как кнопка — важный элемент в цепочке конверсии, внимательно проверьте её отображение во всех почтовых клиентах.
Кнопка отписки. «Напишите нам на почту otpiska@nadoelo.ru, чтобы отписаться от рассылки» — это прошлый век. Сделайте в конце письма видимую ссылку на страницу отписки, нажав на которую, пользователь либо автоматически будет удалён из базы рассылки, либо будет перенаправлен на страницу выбора того, от чего конкретно он хочет отписаться. Диверсифицируйте контент: если у подписчиков будет выбор среди тем подписки («Новости сервиса», «Оповещения о свежих материалах», «Рассылка с итогами месяца», «Лучшие скидки недели»), вам будет проще их таргетировать и конвертировать в продажи. Соответственно, если у него будет выбор, от чего отписаться, а что оставить, то будет шанс не просто не потерять потенциального клиента, но и повысить шансы конвертировать его в продажи.
Не забудьте про тесты: вы должны наверняка знать, как и где выглядит ваше письмо. Эксперты этой сферы советуют использоваться сервисы litmus.com и emailonacid.com, хотя в них и есть один небольшой недостаток: проверить отображение письма в российских почтовиках Mail и Яндекс не получится, для них придётся делать рассылку ручками на собственные ящики в этих сервисах. В некоторых системах рассылки уже предусмотрена возможность посмотреть, как будет выглядеть письмо (как минимум в разрезе десктоп-мобайл, как максимум — в различных почтовиках). Если вы работаете с другими географическими регионами, не поленитесь проверить, какие почтовые сервисы пользуются там популярностью, и завести в них почтовые ящики для тестовых рассылок.
Помимо формы не забывайте проверять содержание (нет ли в тексте орфографических и пунктуационных ошибок, все ли ссылки рабочие, партнёрские и ведут куда надо) и проводить A/B тесты. Для этого разделите базу рассылки на две части, причём состав подписчиков должен быть примерно однородным по полу, возрасту, доходу, а также используемым почтовым клиентам. За раз тестируйте один элемент письма: это может быть цвет кнопки, call-to-action, тема письма, превью, расположение блоков, иллюстрации.
Разработайте шаблоны для каждого типа письма, «откатайте» их на рассылках: так вам будет проще верстать каждое новое письмо, а вероятность «поехавшей» вёрстки сведётся к минимуму. Вы заранее будете знать, какое изображение какого формата подойдёт по размеру блока, какого объема должны быть заголовки и тексты.
Не увлекайтесь «визуальными эффектами» — gif-изображениями, видео, формами обратной связи. Динамические изображения могут проигрываться не во всех почтовых сервисах, а формы обратной связи (опросники, анкеты, особенно со сложным сценарием) работать не так, как задумывалось изначально. Если без этих элементов не обойтись, и они играют важную роль в цепочки конверсий, лучше уводить пользователей на сторонние ресурсы (например, YouTube для видео, SurveyMonkey для проведения опросов).
Используйте стандартные правила дизайна. Заголовки и подзаголовки должны быть явно отделены от текстовых блоков с основным содержанием (для этого используется шрифт большего кегля, жирное и полужирное написание, отступы). Сам текст должен быть разбит на абзацы для упрощения восприятия. Не лепите элементы письма близко друг к другу: в письме должен оставаться «воздух» — это не только хорошо выглядит, но и уменьшает шанс «тыкнуть не туда» в мобильной версии. Делайте контрастными элементы письма, на которые нужно обратить внимание, например, кнопки должны визуально выделяться, но при этом не выглядеть «вырви глаз» (зелёный текст на красном фоне — не самая удачная идея). И помните: не усложняйте дизайн письма, ведь лучшее — враг хорошего. Составив шаблон, посмотрите критично на каждый элемент и честно скажите себе, зачем он нужен и какую роль играет в превращении читателя в покупателя.
Делайте понятный call-to-action. Особенно это относится к элементам, с которыми взаимодействует читатель — кнопкам и ссылкам. «Читать далее», «Узнать больше» = открыть страницу с дополнительной информацией или продолжением текста, «Получить скидку/купон», «Купить со скидкой», «Воспользоваться предложением» = перейти на сайт, чтобы совершить на нём покупку с использованием скидки. Хорошо работают фразы «Торопитесь! Предложение ограничено по времени» — они подталкивают пользователя не откладывать покупку, ведь потом будет менее выгодно, чем сейчас.
Используйте инструменты партнёрской сети. Раз уж мы говорим про affiliate, нельзя не упомянуть про полезные инструменты. В зависимости от того, по какой бизнес-модели вы работаете, вам могут пригодиться: товарные фиды (выгрузка xml-файлов с карточками товаров), deeplink (ссылка на конкретный товар/страницу сайта рекламодателя), битые ссылки (проверка активности ссылок), рекламные материалы (баннеры и автобаннеры, подготовленные рекламодателями), купоны и скидки (самые свежие спецпредложения, от значительных скидок до купонов на бесплатную доставку и кэшбэк). Не забывайте проверять офферы, с которыми вы работаете: рекламодатели постоянно обновляют креативы и специальные предложения, которые можно использовать как инструменты привлечения покупателей и инфоповоды к рассылке.
Это не вкусовщина и не украшательство, а шаги для увеличения конверсии в продажи. Письмо должно оставлять у пользователя два чувства: «Нужно срочно воспользоваться предложением» и «Нужно сохранить письмо и обязательно вернуться к нему позже, оно мне пригодится». И даже если вы не новичок в e-mail маркетинге, стоит пройтись по этому чек-листу и проверить, все ли вы применяете в своих рассылках? Возможно, какой-то инструмент, которым вы ещё не воспользовались, поможет увеличить конверсию в продажи на несколько процентов.
