Сообщение на черном фоне

Обновлено: 05.07.2024

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

не мерцает экран;
меньше влияния на циклы сна;
людям с нарушениями зрения проще читать текст;
легче сфокусироваться на контенте.

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

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

Как мы делали письмо в темной теме без кода

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

15 топ-менеджеров , которые вывели свои компании на лидирующие позиции в рейтинге ESG.

Так как фонд планирует вести рассылки самостоятельно, нашей задачей было сделать универсальный и простой шаблон, который сотрудники смогут менять под себя. Мы изучили опыт Litmus и коллег из Email Soldiers и начали действовать.

Шаг 1. Фоновая заливка

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

При реализации что-то пошло не так. Вот какие проблемы у нас возникли:

Белое письмо в темной теме ослепляет и отталкивает.
Нужно долго все тестировать. Мы столкнулись с тем, что Outlook 2007, 2010, 2013 и 2016 не отображает фоновых картинок — приходилось дублировать их заливкой цветом и тестировать снова.
Текст на белом фоне, залитом картинкой, было плохо видно. Но эту проблему удалось решить — просто сделали текст серым.

Шаг 2. Замена цветов

Некоторые почтовики (Outlook и Apple Mail) не поддерживают инверсию цветов. Например, в одном из писем блок с книгами получил нежно-розовый бэкграунд, хотя в макете он белый. Также на черном фоне (который на самом деле белый) не читались синие заголовки. Синие блоки тоже не инвертировались.

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

Шаг 3. Косяки с почтовыми клиентами

Изначально в нашем макете были тени в блоках, выделявшие их на общем фоне. Но так как мы верстали шаблон не картинкой, а HTML + текстом, пришлось убрать тени, потому что большинство почтовиков их не поддерживает.

После множества тестов мы смогли сделать рассылки, которые хорошо отображаются как в светлой, так и в темной теме. Синие блоки залили не цветом, а картинками. Заголовки вместо синего залили красным (но все равно в некоторых версиях Outlook это не сработало).

Вот как теперь письмо выглядит в светлой и темной темах:

Альтернативные варианты

Для тех, у кого есть ресурсы, время и желание.

Что в итоге

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

Введите несколько слов в текстовое поле, коснитесь и удерживайте значок стрелки вверх, а затем коснитесь Экран.

Примечание: Получатель не может видеть фоновые обои на вашем телефоне Android.

Топ 2: Go SMS Pro

Вы должны видеть объявления, если вы не платите, чтобы удалить их.

Топ 3: Прокачай мой текст

Топ 4: Текстра СМС

Некоторые функции необходимо приобрести в приложении.

Топ 5: Mood Messenger

Он доступен только между пользователями Mood Messenger.

Как мне снова сделать белый экран белым?

Как мне изменить свой контактный фон?

Почему контакты в телефоне разного цвета?

Разные цвета в ваших контактах обозначают разные типы оператора связи и устройства, которые использует человек.

Что вы думаете об этом посте.

Рейтинг: 4.8 / 5 (на основе голосов 258) Подпишитесь на нас в

Восстановление данных iPhone

Лучшее программное обеспечение для восстановления данных iPhone, позволяющее пользователям безопасно восстанавливать потерянные данные iPhone / iPad / iPod с устройства iOS, резервное копирование iTunes / iCloud.

Почему сейчас так стали популярны темные темы в приложениях? Есть несколько причин, объясняющих этот факт. Контрастный вид стал востребованным из-за блогеров, других лидеров мнений и создателей тенденций. Программисты были вынуждены подстроиться под актуальные течения и внедрить альтернативные темы в приложения. Помимо существующего тренда и моды, причина востребованности темной темы в том, что она не так сильно утомляет глаза и нервную систему человека. Далее посмотрим, как сделать темную тему на Андроид устройствах и в приложениях.

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

Есть мнение, что ночной вид способствует не такому быстрому расходу заряда аккумулятора. Но это возможно, если экран девайса выполнен по технологии OLED или AMOLED. Простой LCD экрана будет расходовать энергию аккумулятора так же, как и ранее.

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

Например, в последнем обновлении Телеграм, для включения черного фона достаточно нажать на полумесяц, который “висит” на главной странице приложения.

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

Как выбрать темную тему в настройках Андроид

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

Корпорация Гугл анонсировала Android Q, в котором подразумевается возможность включения черной темы.

Но и для владельцев “старых” андроидов есть выход — использование сторонних приложений. Такой вариант универсальный, и его плюс в том, что он подходит для любой версии Android.

Потребуется всего лишь установить желаемый софт на свой мобильный. Вот некоторые из них:

Темная тема Ponder
Pure Black Launcher Theme

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

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

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

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

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

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

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

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

Как сделать темную тему на Андроид 9

Рассмотрим процесс включения черного оформления на Андроид 9.

1. Для активирования контрастной темы на Android 9 потребуется зайти в настройки гаджета. Можно тоже использовать специальные приложения, загруженные из магазина Плей Маркет.

2. Переходим в раздел “Экран“, где пролистываем вниз, и выбираем раздел “Дополнительно“.

3. На открывшейся странице выбираем раздел “Тема устройства“.

4. Здесь нужно выбрать “Темная“.

5. Все готово. Оформление экрана девайса автоматически изменится.

6. Для возвращения исходного варианта нужно пройти те же шаги, только в конце выбрать “Светлую” тематику оформления.

Как сделать темную тему в ВК

Разработчики “Вконтакте” делают все, чтобы радовать своих пользователей, поэтому черная вид была внедрен относительно быстро. Об этом были оповещены фактически все пользователи соцсети, был даже запущен некий флешмоб “Хочу темную тему“.

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

Сразу после отправки придет уведомление о том, что ночной вид ВК активирован.

Есть и другой вариант, как активировать дарк режим, просто изучите эту короткую инструкцию:

Как сделать темную тему Ватсап

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

Но владельцы андроидов могут не расстраиваться. Есть простая хитрость, как поставить черный вид на ватсап.

1. Зайдите в приложение.

2. Нажмите на 3 точки (правый угол экрана).

3. Выберите “Настройки” — “Чаты” – “Обои” – “Сплошной цвет“.

4. Выберите черный фон и нажмите “Установить“.

Внешний вид чата сменится, но само приложение останется привычного зеленого цвета.

Есть совсем экзотический способ поучить dark версию экрана на Whatsapp. Нужно написать письмо разработчикам, подтвердив свое согласие на участие в тестировании дарк-опции. Это не стопроцентная гарантия, но шанс есть у каждого.

Как сделать темную тему Инстаграм

По некоторым мнениям Инстаграм в черном цвете выглядит просто ужасно. Но любое мнение субъективно, и вы можете самостоятельно установить ночной режим на Инстаграм:

Скачайте программу Dark Mode Theme For Instagram . Это сторонняя программа, которую можно считать аналогом официального приложения Instagram. В программе также можно сделать и выложить сторис, размещать фото и отвечать на комменты, в контактах.
После установки нужно выбрать “Accept”, что означает ваше согласие с политикой конфиденциальности сервиса.
Пройдите авторизацию под своим аккаунтом, введите сведения учетной записи Инстаграмма (внимание, все данные вы вводите под свою ответственность!).
После загрузки страницы вы увидите, что оформление аккаунта, лента, и прочее выполнены в черном цвете.

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

Итак, мы разобрали все способы включения андроид – смартфона в темный режим. А каким методом пользуетесь вы? Напишите в комментариях!

В 2019 году крупные почтовые клиенты объявили о поддержке тёмной темы, или Dark Mode. Так вопрос о том, как адаптировать свои письма к новой среде, стал большой головной болью для email-маркетологов.

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

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

Тёмный режим — это перевернутая цветовая схема, которая использует светлую типографику, элементы пользовательского интерфейса и иконки на тёмном фоне. Это одна из самых горячих тенденций цифрового дизайна в уходящем году. Все от операционной системы Apple до таких приложений, как Twitter, Slack и Facebook Messenger теперь позволяют пользователям переключаться в тёмный режим.

Многие пользователи предпочитают именно тёмный режим, и на это есть свои причины:

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

Какие почтовые клиенты поддерживают тёмную тему

Apple Mail
Outlook 2019 (Mac OS)
Outlook 2019 (Windows)

Красиво сверстаем ваши письма

Как почтовые клиенты применяют тёмный режим к письмам

На данный момент существует три принципиально разных типа цветовых схем, используемых почтовыми клиентами.

Никаких изменений цвета

В некоторых почтовых клиентах вы можете изменить пользовательский интерфейс, и это никак не повлияет на то, как отображаются письма. Так, iOS и Apple Mail по умолчанию отображают дизайн письма в Light Mode, если вы специально не добавите код для запуска Dark Mode.

Пример письма в Apple mail:

Частичная инверсия цвета

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

Частичная инверсия цвета в Outlook:

Полная инверсия цвета

Это наиболее агрессивная цветовая схема. Она не только инвертирует области со светлым фоном, но и влияет на тёмный фон. Поэтому, если вы уже разработали дизайн под тёмную тему, эта схема по иронии судьбы заставит его стать светлым. К сожалению, сейчас эту тактику используют Gmail (iOS 13) и Outlook 2019 (Windows).

На скриншоте из Outlook 2019 (Windows) видно, что белый фон стал тёмно-серым, а области, которые ранее имели тёмно-синий фон со светлым текстом, теперь стали светло-синими с тёмным текстом.

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

Тестирование обычного письма (без таргетинга на тёмный режим) в почтовых клиентах с тёмным интерфейсом:

Как применять собственные стили в тёмном режиме

Вот два метода, которые вы можете использовать:

@media (prefers-color-scheme: dark)

Этот метод работает почти так же, как блок стилей внутри запроса @media для адаптации под мобильный. Но этот блок CSS нацелен на любой пользовательский интерфейс, в котором настроен тёмный режим.

[data-ogsc] и / или [data-ogsb]

Это метод впервые предложил Марк Роббинс для таргетинга в приложении Outlook. Кажется, что этот способ имеет достаточно узкое применение, однако относительно легко просто скопировать стили @media (prefers-color-схема: dark), которые вы уже применили, и просто добавить соответствующие [data-ogsc] и / или [data-ogsb] префиксы к каждому правилу CSS.

Но! В электронной почте нет последовательной поддержки этих методов таргетинга.

Что стоит помнить, применяя эти методы.

Оптимизируйте логотипы и другие изображения для всех стилей.

Добавьте прозрачные контуры к прозрачным PNG с тёмным текстом для удобочитаемости в почтовых клиентах, где нет таргетинга на тёмный режим (Gmail App и Outlook 2019 Windows). Так вы избежите проблем, если почтовый клиент будет использовать частичную или полную инверсию цвета.

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

Включите тёмный режим в письме для пользователей, которые используют тёмный интерфейс

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

Для поддержки этих метаданных также необходимо добавить CSS:

Добавьте стили тёмного режима для @media (prefers-color-scheme: dark)

Дублируйте стили тёмного режима с префиксом [data-ogsc] и / или [data-ogsb]

Примените ваши стили для тёмного режима к телу письма

Убедитесь, что все ваши HTML-теги имеют соответствующие классы Dark Mode. Вот пример классов .dark-img и .light-img, которые появляются в логотипах Litmus в Light Mode и Dark Mode.
Пример HTML:

Используйте Litmus Email Previews, чтобы посмотреть, как будут выглядеть ваши письма в тёмном режиме.

Читайте также: