Разборы

Как адаптировать дизайн рассылки под тёмную тему

Что надо знать о dark mode в email-рассылках
зачем нужна тёмная тема

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

Тёмная тема в Opera
Тёмная тема в Opera

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

Поговорим о тёмной теме в разрезе email-маркетинга:

  • нужны ли такие письма в ваших рассылках;
  • как узнать, у кого из подписчиков тёмная тема;
  • как создать «тёмное» письмо.

Для удобства рассказываю в формате вопросов-ответов.

В дизайнерской тусовке только и говорят, что о тёмной теме оформления. Из-за чего шум?

В конце 2018 года Windows и MacOS выпустили обновление своих операционных систем. Одним из нововведений стала возможность переключиться между тёмным и светлым режимом оформления.

Сначала тёмную тему оформления получили предустановленные приложения Windows и MacOS. Со временем даркмод появился и в других программах: браузерах, софте для разработчиков и дизайнеров.

При чём тут письма?

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

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

Рассылать обычные письма подписчикам с тёмной темой — неэффективно.

Как адаптировать письма под пользователей с тёмным режимом?

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

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

1    Вставить в начале письма чекбокс, который включает тёмный режим. Это не лучший вариант, но у клиента хотя бы появится возможность переключиться в удобный режим. С чекбоксами экспериментировали Litmus — у них даже есть пример такого письма и HTML-кода.

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

@media (-ms-high-contrast)

Медиа-запросы поддерживают не все приложения. Посмотреть, какие почтовые клиенты их отображают, можно в таблице CampaignMonitor.

3    Сегментировать базу по предпочтениям. Можно спросить у подписчиков, какой режим они используют. По результатам опроса делим базу на две группы и каждой отправляем своё письмо. Это универсальный вариант — подписчики сами говорят нам, в каком виде им удобнее получать письма.

Допустим, я сегментировал подписчиков. Что дальше?

Дальше — готовим отдельное письмо для пользователей, которые работают в тёмном режиме. Что это значит:

  1. Используем тёмные оттенки для фона письма.
  2. Текст набираем белым или светло-серым. Иногда подходят светлые оттенки других цветов. Например, если акцентный цвет зеленый, можно попробовать использовать светло-зеленый для основного цвета текста.
  3. Для акцентов выбираем красные, синие, зелёные и жёлтые цвета. Все те, которые выглядят контрастно на черном фоне и отличаются от цвета основного текста.

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

Письмо в тёмном режиме
Тестовое письмо, которое я отправил сам себе. Письмо автоматически отобразилось в тёмном режиме

А есть компании, которые уже внедрили такую практику? Можете показать примеры писем в тёмном режиме?

Да, таких компаний много. Делюсь своими любимыми рассылками.

Framer X

Не все рассылки этой компании выполнены в темных тонах, но в половине писем тёмный фон есть.

Письмо Framer

Apple Music

Письмо Apple Music

Infinity Nation

Письмо Infinity Nation

Slides

Письмо Slides

Complements

Письмо Complements

Что в итоге: адаптировать или нет?

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

Адаптация рассылок под тёмный режим поможет поднять открытия и переходы с рассылки:

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

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