Темный режим для электронных писем

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

Что такое темный режим?

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

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

Но это не совсем так. Он не инвертирует зеленый в красный, а синий в золотой или желтый. Темный режим использует более светлые оттенки тех же самых цветов (в случае, если вы не установили определенный цвет в качестве фона контента).

Как это делается? Клиент электронной почты определяет цветовую схему фона содержимого письма. Затем применяет темный фон, если он не установлен, и применяет контрастные оттенки цветов содержимого письма.

(Электронная почта в легком режиме)

(Электронная почта в темном режиме)

Однако в Gmail на iOS и Android темный режим делает его белым, когда дело касается черного фона. Темно-серый цвет смещается в светло-серый и т. д.

Почему темный режим так популярен?

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

  • рекомендуется офтальмологами

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

  • это сейчас в тренде

Ну. Это правда. Многие включают его просто потому, что темный режим — это что-то новое, и они хотят его попробовать. В результате  81,9%  пользователей используют темный режим только на телефонах;

  • это просто удобно

Некоторым пользователям удобнее читать в темном режиме, особенно когда на улице ночь;

  • это экономит заряд батареи

Google подтвердил , что темный Лидер по продаже бизнеса режим на Android экономит заряд батареи до 50%, поскольку снижает яркость экрана. Однако это актуально только для OLED-экранов;

Wired утверждает, что темный режим не влияет на батарею, если мы говорим о ЖК-экранах, которые широко используются Apple. Кстати,  Apple обещала отказаться от всех ЖК-экранов в пользу OLED.

Список почтовых клиентов, поддерживающих темный режим, и как в них отображаются ваши письма

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

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

  • Приложение Gmail на Android (Android 13)

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

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

Android 10 не инвертирует темные цвета в светлые, но изменяет белую строку на темную.

(Темный режим электронной почты, темная тема)

Важно отметить:

Как мы уже говорили, только последняя версия Android — Android 10 — отображает электронные письма в темном режиме. Но есть и другие обязательные условия, на которые следует обратить пристальное внимание, если вы хотите видеть электронные письма в темном режиме Android. Они следующие:

  1. Ваше приложение Gmail должно быть загружено из Google PlayStore, а не из того приложения, которое было на вашем телефоне по умолчанию. На телефонах Samsung они иногда есть.
  2. У вас должна быть установлена ​​последняя версия приложения Gmail.
  • Приложение Gmail на iOS (iOS 13)

Что делает приложение Gmail на iOS?

Мой email изначально был темным со светлой строкой меню. iOS инвертировала цвета шрифтов и фонов. Например, светлые фоны с темным цветом текста превращаются в темные цвета со светлыми цветами шрифтов.

Важно отметить:

Gmail все еще разворачивает темный режим писем на iOS. Предполагается, что он станет полностью видимым и доступным для всех пользователей примерно через 2 недели. Но тот же процесс для Android занял у Google около двух месяцев вместо двух недель. Нам просто нужно набраться терпения.

  • Приложение «Почта» для iPhone (приложение «Почта» для iOS)

Apple добавила поддержку темного режима, начиная с iOS 13 в своем родном почтовом приложении Apple. Этот почтовый клиент позволяет вам включить темный режим для пользовательского интерфейса и области электронной почты. Если вы установили прозрачный цвет фона, то iPhone Mail изменит его на более темный фон.

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

  • Apple Mail на macOS

Та же ситуация и здесь. Apple Mail позволяет включать темный режим для пользовательского интерфейса, но это не влияет на поддерживаемые цветовые схемы ваших HTML-писем в темном режиме. Кроме того, Apple Mail на macOS позволяет добавлять пользовательский код для настройки темного режима по вашему вкусу через CSS. Это включает в себя HTML meta tags, CSS target и обновленные свойства, которые позволяют разработчикам электронной почты изменять цвета шрифтов, визуальных элементов, фоновых изображений и т. д.

  • Gmail на macOS и Windows

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

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

  • Приложение Outlook на Android

Говорят, что он частично инвертирует цвета. Однако, когда я тестировал темный мод на своем устройстве Android, никаких инвертированных цветов замечено не было. Однако, если вы столкнулись с такой проблемой или если ваша электронная почта в темном режиме несовместима с Outlook на Android, просто добавьте префикс data-ogsc, чтобы дублировать стили темного режима. В результате у вас должно получиться что-то вроде этого

Этот почтовый клиент должен частично инвертировать цвета в темном режиме. Но у меня также нет приложения Outlook на моем iPhone.

  • Outlook 2019 на macOS

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

  • Outlook.com

Ситуация с Outlook.com очень интересная.

При включении темного режима предполагается частичная инверсия цветов. Но когда я отправляю письмо с темной цветовой схемой, Outlook.com в темном режиме меняет цвета на светлые. А когда я отправляю письмо с дизайном, выполненным в светлых тонах, Outlook.com инвертирует цвета на темные.

Интересные факты о темном режиме на Outlook.com:

1. Outlook.com вообще не влияет на дизайн писем AMP.

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

2. Outlook.com позволяет просматривать электронную почту как в светлом, так и в темном режиме, не меняя цвет пользовательского интерфейса.

Чтобы включить эффект темного режима для ваших писем, вам нужно всего лишь нажать эту кнопку

3. Outlook не инвертирует цвета границ.

Советы по оптимизации писем для темного режима

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

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

1. Работа над образами

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

Согласитесь, что это не лучший пример темной темы письма, поскольку изображения на белом фоне разного размера портят все впечатление?

б) Будьте осторожны с прозрачными изображениями PNG

Вам следует использовать прозрачные изображения для карточек продуктов, чтобы создать соответствующие изображения в темном режиме для вашей рассылки. Не забудьте добавить полупрозрачный контур к прозрачным PNG с темным текстом в вашем электронном письме в темном режиме.

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

 

 

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top