Практичный email маркетинг. Соблюдайте достаточный контраст между цветом фона письма и шрифта

Изучила исследования аналитиков и мнения специалистов email-маркетинга и написала для сайт колонку с трендами в дизайне email-рассылок в 2017 году.

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

Тренды 2016 года, которые будут жить в 2017 году

1. Адаптивный дизайн

Смартфоны победили десктоп. Согласно исследованиям Litmus, 55% писем открывают на мобильных устройствах. В 2017 году тенденция сохранится, поэтому самое время проверить свои рассылки на адаптивность. Руководствуйтесь основными принципами:

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

Телефония . Используйте возможности смартфонов: добавьте призыв к действию «позвонить» или «заказать звонок».

Разные CTA для мобильных и десктопа

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

Адаптивное меню

На что обращать внимание

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

2. Интерактивность

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

Интерактивные элементы работают на CSS3, а спроектированы могут быть, например, в Adobe Experience Design или Sparkbox . Задача таких инструментов - помочь сосредоточиться на контенте, а не на вёрстке.

На что обращать внимание

Сегодня существует множество почтовых клиентов - десктопные приложения (например, Microsoft Outlook, AOL, Thunderbird), веб-сервисы (Gmail, Mail.Ru Group), мобильные клиенты. В зависимости от того, какие технологии они используют, ваши дизайнерские изыскания в виде CSS-анимации будут работать или не работать в разных клиентах. Стоит предусматривать упрощенные варианты отдельных блоков и прописывать их в media queries.

К слову, в сентябре 2016-го Gmail, наконец, объявил о том, что клиент начинает поддерживать адаптивную верстку писем. Это большой шаг для индустрии почтовых клиентов в целом - переход на адаптивную верстку рассылок станет еще более массовым явлением.

3. GIF-анимация

Анимированные изображения - ещё один способ «оживить» рассылки. У них есть одно важное преимущество - простота производства. В то же время гифки способны наглядно продемонстрировать продукт в действии - поэтому, несмотря на то, что поклонники CSS предрекают скорейшую гибель GIF-анимации, та будет жить и процветать еще долго.

На что обращать внимание

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

Еще одна важная деталь - если анимация не загрузится у пользователя (например, по причине медленного соединения) - тот увидит только ее первый кадр. Поэтому стартовый кадр должен быть максимально информативным. По этой же причине не стоит делать слишком «тяжелые» гифки.

4. Векторные изображения

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

На что обращать внимание

Пара полезных JS-библиотек для работы с SVG-анимацией: SnapSVG и GreenSock GSAP .

5. Покупка в письме

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


Тренды в email-рассылках 2017 года

1. Видео

Будущее контент-маркетинга за видео - пишет газета The Guardian. По прогнозам Cisco, к следующему году видео охватит 69% всего интернет-трафика. Оно выйдет за пределы YouTube и будет активно применять в email-маркетинге.

  • Кликабельность увеличивается на 55%.
  • Пользователя тратят на просмотр письма на 44% времени больше, чем обычно.
  • На 41% увеличиваются расшаривания и публикации в социальных сетях.
  • Конверсия растёт на 24%, ROI - на 20%.
  • Средний чек увеличивается на 14%.

Несмотря на эти преимущества, видео редко встраивается в письма (обычно предпочитают давать ссылку на видеохостинг).

На деле вставить видео в рассылку нетрудно - большинство сервисов поддерживает вставку роликов по ссылке (тот же Mailchimp). Видео может быть и фоном для отдельных элементов или всего макета сразу. Для этого есть онлайн-редактор Mailigen .

2. Галереи изображений

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

3. Гибридная верстка рассылок

Насыщенные цвета помогают лучше структурировать контент.


5. Типографика и навигация

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

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

На что обращать внимание

Текст - главный инструмент в рассылках. Согласно исследованиям , 43% пользователей не используют просмотр изображений в почтовых программах. Чтобы выделить ключевые сообщения, применяйте стили для текста - цвет, начертание и размер кегля. Сам текст набирайте веб-шрифтами или подгружайте нужные с Google Web Fonts .

Как сделать макет plain-text динамичным? Используйте отступы. Они делают текст удобным для чтения, поэтому пользователи изучают такие письма тщательнее - это подтверждает исследование по психологии.

6. Интеграция с социальными сетями

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

18. Анимация

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

Вот здесь можно посмотреть инструкцию по созданию и оптимизации анимации для рассылок.

J Crew в своей летней рассылке «Summer Sale» используют … мороженое. Летом оно ассоциируется с удовольствием, прохладой, детством и счастьем. Цель рассылки - расположить читателей и подарить им ощущение радости. То, что мороженое быстро исчезает, как бы намекает, что акция или товар скоро закончатся. Не пропустите!

Еще одна летняя тема - мы видим арбуз. И семечки от него постепенно выкладывают нам дорожку к кнопке Call-to-action. Мы скроллим, видим волшебное слово для многих - Sale - и чуть ниже кнопку для перехода. Не заметить ее невозможно.

Здесь мы видим анимацию уже на самой кнопке «Купить». Чтобы не перегружать письмо многочисленными вариациями одного продукта, мы сделали сменяющиеся картинки с помощью GIF.

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

В офисе у коллег есть игра “Доведи дизайнера до слёз”. Нет, они не критикуют мои работы и не ругаются за пропущенную ошибку в тексте. Они присылают скриншоты всевозможных email-рассылок, которые приходят на их почтовые ящики. И, к сожалению, тест в этих письмах не прочитать, кнопка с призывом к действию не видна, и письмо настолько "вырви-глаз", что его хочется не то, что закрыть и забыть, но заодно и отписаться, чтобы больше никогда такого ужаса в своей почте не видеть. Дизайн - это не только про картинки и цвета. Это про грамотное расположение всех элементов письма, чтобы помочь подписчику понять, что от него хотят и что ему предлагают сделать. В 2018 году существует множество бесплатных онлайн-инструментов, которые сделают подготовку рассылки не только быстрее, но и качественнее. Вначале вы потратите не один час на подготовку, но это хорошая инвестиция, т.к. на выходе получится письмо, которое подписчику захочется открыть и прочитать снова.

Выбор шаблона

Посмотрите как создатели рассылок придерживаются этих правил:

Если всё ещё сомневаетесь, то загляните в галерею шаблонов Mailigen, там достаточно примеров шаблонов для каждого типа писем:

Текст

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

  • Самые основные правила , без них никуда (в оригинале на английском).
  • Несколько комментариев из Ководства Артемия Лебедева.
  • Эта из ильяховской рассылки Главреда, там рассказывается о важности работы с заголовками.
  • можно увидеть конкретный пример письма с конкретными комментариями от дизайнера (спойлер: в том письме есть ещё что дорабатывать)

Есть несколько видов писем, где работа с текстом крайне важна:

  • письма-подтверждения (заказ, бронирование, доставка), т.к подписчик должен быстро прочитать информацию и подтвердить её или отклонить. Хороший пример - подтверждение бронирования на сайте airbnb.com

  • контентные письма - вдохновение можете найти на новостных порталах (meduza.io, lenta.ru)


Цвет

Идеально подобрать цвета на глаз дано не каждому, но, хвала программистам, мы живем в век, когда многое за нас могут делать роботы. В том числе и подбирать цвет. Из более чем двадцати ресурсов по подбору цвета я выбрала 3 наиболее интересных:

  • Adobe Color CC (color.adobe.com)

Полезен при подборе палитры к конкретному цвету: вводите значение цвета и кулер подберет подходящие цвета.

  • Color Hunt (colorhunt.co)

Если стоит вопрос о выборе цветовой палитры, то в этом сервисе почти бесконечное число сочетаний разнообразных цветов. Самая главная проблема - это остановиться на чем-то одном 🙂

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

Примеры хороших рассылок, где каждый цвет на своем месте:

Фотографии

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

Здесь можно найти векторную графику, использование точно такое же, как и в фотостоках - свободное использование при упоминании автора:

Не стоит забывать про иконки:

Проверьте вес фотографии, для письма она должна быть не больше 600 Кб! Иначе письмо будет долго загружаться и, возможно, потенциальный клиент не увидит ваше письмо из-за низкой скорости интернета.

Нужно найти подборки графики начиная от макетов визиток, заканчивая журнальными разворотами и плакатами? Есть отличный сервис с шаблонами. Что полезно - там есть картинки специально для email рассылок! Большинство макетов можно бесплатно загружать после редактирования:

Сервис для создания разной графики. Не так давно там появились и анимации, что, конечно, радует. Есть бесплатные картинки, есть платные, но цена символическая - 0,99$:

Нужно обрезать фотографию? Изменить её контрастность, а фотошоп так и не успели освоить? Этот сервис на порядок проще фотошопа, но набора базовых инструментов должно хватить:

Вдохновение

Если уже поднаторели во всех инструментах, но не хватает идей и каких-то новых решений, то стоит сходить на ресурсы с базами email-шаблонов. Бесконечный поток вдохновения обеспечен (частично примеры для этой статьи взяты оттуда):

  • EmailsFresh (emailsfresh.com)
  • Really Good Emails (reallygoodemails.com)
  • Email Gallery (email-gallery.com)

И, конечно, надо быть в курсе того, что делают конкуренты. Подпишитесь на максимальное число рассылок вашей сферы и смотрите что делают другие.

Пользуйтесь! И не заставляйте дизайнеров плакать, при виде ваших рассылок. Если время не позволяет учиться или просто нет желания “дизайнить”, то наймите человека, который знает своё дело. Цена за готовый шаблон с версткой стоит в среднем 8-12 тысяч (в нем можно менять текст и фотографии в зависимости от целей письма). Вы избавитесь от необходимости каждую рассылку делать не свою работу, а клиенты почувствуют, что вам не всё равно.

Порция свежих новостей из мира email маркетинга всегда на вашей почте.

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

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

Структура писем практически не отличается от структуры обычной веб-страницы:

Прехедер

В прехедере чаще всего располагается тема письма и ссылка на веб-версию.

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

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

Вот пример шапки письма от Амедиатеки, здесь просто логотип:

А вот письмо Ламоды, здесь и логотип, и информация по накопленным баллам, и меню:


Тело письма

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

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


Адаптивный дизайн email-рассылки

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

Есть несколько вариантов адаптивной вёрстки письма.

С помощью «плавающих блоков»

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

адаптивная вёрстка

С подстраивающимся содержимым

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

С помощью медиазапросов

Mediaquery - это компонент языка CSS. Этот метод позволяет менять расположение объектов при помощи медиазапросов. Не самый лучший способ адаптации для писем, так как далеко не все почтовые клиенты с ними работают.

Клиенты, поддерживающие и не поддерживающие медиазапросы:

Десктопные Мобильные Браузерные
AOL Desktop Android 4.2.2 Mail AOL Mail
Apple Mail 10 Android 4.4.4 Mail G Suite
IBM Notes 9 AOL Alto Android app Gmail
Outlook 2000–03 AOL Alto iOS app Google Inbox
Outlook 2007–16 BlackBerry Outlook.com
Outlook Express Gmail Android app Yahoo! Mail
Outlook for Mac Gmail Android app IMAP
Postbox Gmail iOS app
Thunderbird Gmail mobile webmail
Windows 10 Mail Google Inbox Android app
Windows Live Mai Google Inbox iOS app
iOS 10 Mail
Outlook Android app
Outlook iOS app
Sparrow
Windows Phone 8 Mail
Yahoo! Mail Android app
Yahoo! Mail iOS app

Зелёным обозначены почтовые клиенты, которые поддерживают медиазапросы, красным - не поддерживают. Данные взяты отсюда: campaignmonitor.com

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

Ещё я бы посоветовала почитать книгу Люка Вроблевски «Сначала мобильные!» . В ней доступно рассказывают о проектирования сайтов с учётом отображения на мобильных и планшетах, приводятся примеры и рекомендации по вёрстке. Этот подход можно применять и в дизайне писем.

Ошибки в адаптивном дизайне писем

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

Например, в этом письме теги задумывались в два столбца:

Теги отображаются в два столбца

Но в результате письмо выглядело вот так:

Письмо с ошибкой в вёрстке

Дело в том, что между плавающими блоками (

…) не должно быть пробелов в коде. В этом примере в коде случайно добавили пробел или перенос строки. Получился отступ между блоками, и два столбца не поместились.

Шрифты в электронных письмах

Это боль дизайнера. В дизайне писем мы можем использовать только стандартные шрифты:

  • Arial
  • Comic Sans MS
  • Courier New
  • Georgia
  • Impact
  • Tahoma
  • Times New Roman
  • Trebuchet MS
  • Verdana

Не самые красивые шрифты, но хорошо читаемые, и подписчик точно увидит весь текст в письме. Бонус «поиграть со шрифтами», как любят просить клиенты, не получится.

Кстати, стандартные системные шрифты на Android и iOS - это Helvetica и Roboto. Поэтому их тоже можно использовать, в случае чего они заменяются на родной всем Arial =) Так как они похожи по начертанию, это не сильно повредит макету и ничего не поедет.

Цвет текста

Цвет текста должен быть контрастным к фону. Некоторые дизайнеры считают, что лучше использовать тёмно-серый, например, #333333 к белому фону, так как чтение 100% чёрного текста утомляет глаза. Но это спорное утверждение. Можете , в которой автор рассказывает про удобочитаемость, контрастность цвета текста к фону, эволюцию шрифтов в вебе и приводит примеры.

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

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

Размер писем

Оптимальная ширина шаблона для писем - 600 -700px. Это ширина с учётом отступов. Почему 600px? В основном это связано с размером окна в почтовых клиентах и с адаптивной версткой. Самая распространённая ширина экрана на мобильных - 320 px.

Картинки в email-рассылках

Приступая к дизайну письма, опирайтесь на его контент. Если это персональное письмо, не забудьте добавить обращение.


Дизайн письма с персональным обращением

Письма не должны быть сплошной картинкой. Во-первых, они могут не отображаться у получателя. Во-вторых, такое письмо непросто верстать адаптивно, хотя верстать такое письмо быстрее.

Вот в этом примере письмо свёрстано картинками, и они не загрузились:



а без картинок вот так:


Также не стоит увлекаться фоновыми изображениями. Не все почтовые клиенты поддерживают отображение фона картинкой, как в этом письме, открытом с аутлука - вместо фоновой картинки - серая заливка:


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

Письмо - это не фото на память, здесь не нужно высокое качество изображений. Поэтому оптимизируйте картинки для веба, иначе они будут тяжёлыми и не отобразятся. Чтобы уменьшить вес картинок, мы используем compresspng.com (там же можно сжать jpg или pdf) или www.iloveimg.com .

Сейчас в письмах модно использовать простую анимацию с помощью гифок:


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

Порой, когда вы открываете проморассылку на iPhone или Mac, изображение немного замылено. Это не значит, что картинки плохого качества. Просто дизайнер при подготовке рассылки не подумал о том, что вы будете смотреть его на устройстве с экраном Retina. Чтобы макет не «плыл», мы собираем его в х2 размере, то есть ширина контента не 600px, а 1200, текст не 16px, а 32.

Целевое действие в письме

Письмо готовят ради конкретной цели: покупка, подтверждение подписки, написание отзыва, подписка в соцсетях… Всё содержание письма должно быть нацелено на то, чтобы получатель совершил целевое действие.

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

Во-вторых, кнопка должна быть заметной. Для этого лучше использовать контрастные к фону цвета. Также она должна быть достаточно крупной - минимальная рекомендуемая высота - 35 px. Средняя ширина указательного пальца 16-20 мм, это приблизительно 45 px. Пальцы у всех разные, но производители телефонов дают свои рекомендации. В гайде Apple тач-область - 44 px, Microsoft рекомендует размер 34px. Если размер кнопок будет меньше, попасть в них и выполнить целевое действие будет сложнее.

Как происходит работа над дизайном писем

Предварительное знакомство

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

Обсуждение структуры письма с копирайтером

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

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

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

Набросали макет, показали менеджеру. Письмо оказалось длинным и малоинформативным. Текстовые блоки разные по объёму, иллюстраций нет:


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

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

Подготовка шаблона

Когда все ответы получены, мы начинаем собирать шаблон по выбранной структуре. На этом этапе иногда возникают трудности: оказывается, что текста много или, наоборот, очень мало, абзацы в списке неравномерные, заголовки слишком длинные, баннер встаёт неаккуратно.

Обратитесь к писателям. Если текст уже согласован, есть два варианта: продолжить работу, или попробовать согласовать с клиентом изменения в тексте. Если аргументировать изменения, клиент, как правило, не возражает.

Передача верстальщику и проверка вёрстки

Макет готов. Менеджер счастлив, клиент согласовал. Время передавать работу в вёрстку. Но на этом работа дизайнера не закончена.

Всегда нужно контролировать вёрстку. Не поленитесь, посмотрите вёрстку или попросите прислать вам тест. Бывает, что свёрстанное письмо незначительно отличается от макета, как в этом примере:


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

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

Концепция email-маркетинга

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

Визуализация потребностей – мощный способ психологической стимуляции. От дизайна почтовой рассылки зависит дальнейшая судьба email-сообщения. Человек реагирует на что-то приятное, необычное, навевающее воспоминания, соответствующее текущему настроению. Поэтому часть, даже на первый взгляд малозначащих уведомлений, продолжает появляться изо дня в день перед взором пользователя. Подобная лояльность, в конце концов, приводит к ожидаемой конверсии. И наоборот, диссонирующее с внутренним мироощущением сообщение заставляет, после первого, мимолётно брошенного взгляда, немедленно закрыть письмо, а отправителя занести в чёрный список.

Пример

Адаптивный дизайн в современном маркетинге - это обязательное условие успешной e-mail рассылки. Одинаково удобное «прочтение» на любом виде устройств, гибкий дизайн, который подстраивается под размер экрана, оптимальное расположение всех кнопок и ссылок. Чтобы понять, как он выглядит и работает, посмотрите пример ниже.


Методы привлечения внимания

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

  • Минималистический стиль
  • Натурализация
  • Монохромность
  • Использование фотографий людей
  • Блочная структура
  • Презентация товара
  • Ассоциативность
  • и многое другое

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

Заказать дизайн почтовой рассылки

Для заказа профессиональной разработки дизайна рассылки необходимо оставить заявку. После этого, наш менеджер свяжется с вами и попросит заполнить бриф (для ускорения работы, вы можете самостоятельно подготовить примеры писем, которые вам нравятся и контент письма и указать все эти данные в комментарии к заказу). Чтобы не испортить дизайн, рекомендуем заказывать верстку почтового письма у нас.

Средняя цена

4 - 7 дней

Средний срок

Сделать заказ

Особенности почтовой рассылки

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

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

  • Перейти на сайт
  • Оформить заказ
  • Ответить на сообщение
  • Зарегистрироваться
  • Подписать петицию
  • прочее

Наши преимущества

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

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