Safari научился затемнять сайты, у которых нет тёмной темы
Safari introduces Adaptive Dark Mode in 27.3
В бета-версии Safari 27.3 появился Adaptive Dark Mode: если у сайта нет собственной тёмной темы, браузер сам анализирует цвета страницы и перекрашивает её. Это закрывает заметный разрыв — около 40% загрузок страниц приходятся на пользователей с тёмной темой, но лишь 10% сайтов её поддерживают. Движок сохраняет оттенки, следит за контрастом текста по WCAG, аккуратно обрабатывает SVG-иконки и не даёт сайтам определить, что режим включён.
Почти 40% загрузок веб-страниц приходятся на пользователей в тёмном режиме, и при этом лишь 10% загрузок страниц его поддерживают.
- kickingvegas
К сведению: light-dark() в CSS теперь существует.
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/V...
- nsoam
Я хочу обратного. У меня астигматизм, из-за которого белый текст на чёрном фоне читается с трудом. Хотел бы, чтобы Safari умел превращать сайты с тёмной темой в сайты со светлой темой.
- marcellosso
Я использую тёмную тему везде, так что я этому очень рад. Некоторые сайты явно спроектированы под светлую тему, и навязывание им тёмной может сломать впечатление, но именно для этого и существует `color-scheme: light only`, и хорошо, что Safari это уважает. Кроме этого, по-моему, это беспроигрышный вариант: отлично для пользователей тёмной темы, а для разработчиков мало что меняется — просто добавляешь "light only", если не хочешь, чтобы твой сайт затрагивался.
- greazy
Всем стоит попробовать расширение Dark Reader — оно уже много лет делает адаптивную тёмную тему, и его можно настраивать. Оно даже светлую тему умеет. Прямо сейчас использую его в Firefox на HN!
- macNchz
Лично я в восторге от этого на iOS — я обнаружил, что читать скучную всячину в тёмной теме на минимальной яркости телефона — это, пожалуй, самый эффективный для меня способ заснуть (вопреки советам про синий свет и никаких телефонов в постели). С OLED-экраном количество излучаемого света намного ниже, чем у любой альтернативы, которую я пробовал. Для таких сайтов, как HN (некоторые ветки на HN довольно скучные), у которых нет нативной тёмной темы, моим решением было настроить функцию "Accessibility Shortcut", чтобы инвертировать цвета на экране. Три нажатия на кнопку блокировки — и страница инвертируется. Работает сносно, но требует ручного вмешательства для каждого сайта в зависимости от того, поддерживает ли он тёмную тему.
- Reason077
Сам Hacker News — яркий пример сайта, который не поддерживает тёмную тему, хотя мог бы это сделать тривиально (и, по-моему, выглядел бы гораздо лучше, если бы поддерживал!)
- JulianPaul
Я всё ещё единственный, кто не пользуется тёмной темой? Мой астигматизм её не выносит
- AndrewStephens
Это хорошая штука.
Я добавил тёмную тему в свой блог некоторое время назад, и сделать это как следует оказалось слегка муторно.
Можно реализовать халтурную тёмную тему самому, добавив следующий CSS.
@media(prefers-color-scheme: dark) {
body {
filter: invert();
}
}
Все твои изображения тоже инвертируются, а для фотографий это плохо работает.