Лого vc.ru

Тренды в дизайне email-рассылок в 2017 году

Тренды в дизайне email-рассылок в 2017 году

Команда дизайн-студии AIC изучила исследования аналитиков и мнения специалистов email-маркетинга и написала для vc.ru колонку с трендами в дизайне 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. Гибридная верстка рассылок

Технология hybrid coding вместо того, чтобы полагаться на media queries, помогает создавать макеты, адаптивные по умолчанию. Технология совмещает принципы статичной и «резиновой» верстки, что позволяет ей корректно подстраиваться под размеры экрана даже у пользователей Microsoft Outlook.

4. Яркие цветовые схемы

Общие тенденции веб-дизайна найдут отражение в рассылках. Дуплекс потеснит полноцветные изображения (мы писали об этом стиле в блоге), а общее оформление писем станет ярким — как в «Мемфисе».

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

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

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

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

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

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

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

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

Ссылки на социальные сети — обязательный элемент каждого письма. В 2017 году их будет всё чаще дополнять встроенная «живая» лента — например, Twitter.

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

7. Мини-игры в рассылках

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

Мы всё уже привыкли к тому, что рассылки стали интерактивными — опросы, товарные карточки, просто анимированные элементы. В скором времени от email-маркетинга стоит ожидать более смелых экспериментов по вовлечению пользователей — например, в письма будут интегрировать небольшие игры — например, с механикой point-and-click.

Почему рассылки не умрут в 2017 году

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

— Пол Бакхейт, программист и ведущий разработчик Google

Смерть email-маркетингу предрекали много раз — от SMS, социальных сетей и даже приложений для совместной работы. Однако маркетологи продолжают использовать рассылки. Эксперты дают этому три объяснения:

  • Персонализация. Электронная почта — это канал коммуникации, где содержимое можно адаптировать для каждого получателя в отдельности.
  • Окупаемость. Рассылки — один из самых доступных инструментов маркетинга. ROI может достигать 4300%.
  • Измеримость. Эффективность рассылок легко измерить, при этом письма можно оптимизировать и улучшать результаты с каждой отправкой.

Используйте тенденции в дизайне email-рассылок в своей контент-стратегии и помните, что дизайн — это только половина успеха.

Присылайте свои колонки и интерфейсные кейсы на interface@vc.ru.

Теги
Статьи по теме
«Мемфис» в веб-дизайне: как «яркий» тренд из 80-х возвращается в 2016 году

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

Если подписан на 50+ сайтов, тогда да, засоряют.

0

На деле вставить видео в рассылку нетрудно
- вставить нетрудно, только вот отображается корректно не везде

накой делать слайдер в рассылках? CTA сделать хороший - и пусть на сайт переходят, там смотрят..

0

Круто! СПасибо за обзор.

а векторные изображения уже можно использовать при верстке писем разве? Вроде как рекомендовался растр всегда из-за совместимости.

Хорошая статья, но я всегда улыбаюсь подобным утверждениям "Конверсия растёт на 24%, ROI — на 20%." :))))

0

Какие тренды? Вы видели акутальную конверсию с рассылки?

0

такое чувство, что это была статья типа "тренды веб дизайна 2014", из нее сделали эту...

Прямой эфир
Нейронная сеть научилась читать стихи
голосом Пастернака и смотреть в окно на осень
Подписаться на push-уведомления