Темний режим став стандартом майже на всіх сайтах і в додатках — користувачам він подобається, він економить батарею на OLED-екранах і іноді його навіть сприймають як «більш доступний». Але перехід на темну колірну палітру, якщо це зробити без ретельного обмірковування, може насправді зашкодити доступності. У цій статті пояснюється, як це зробити правильно.
Коротко — про що йдеться в цій статті
Коли темний режим сприяє доступності
Для користувачів із чутливістю до світла (світлобоязнь), мігренню або цифровим напруженням очей темний фон може значно зменшити дискомфорт під час тривалого використання, особливо в темному середовищі. Деякі користувачі з дислексією також повідомляють про комфортніше читання на темному тлі.
Коли справді боляче
З іншого боку, для користувачів з астигматизмом (поширеним порушенням зору) світлий текст на темному тлі створює ефект «галяції», через який літери виглядають розмитими — інколи їм зручніше читати світлий фон із темним текстом. Підсумок: немає єдиної правильної відповіді для всіх, тому найкращим рішенням є дозволити користувачеві вибрати, а не нав’язувати йому один режим.
💡 Важливий момент
Найважливіше: ніколи не покладайтеся лише на автоматичне налаштування системи (`prefers-color-scheme`), не даючи користувачеві можливість вручну перемикатися на самому сайті — не всі, чия система працює в темному режимі, хочуть, щоб сайт був темним, і навпаки.
Контраст у темному режимі відрізняється від світлого
Поширена помилка: взяти ті самі кольори тексту зі світлого режиму та просто перевернути фон на темний, без повторної перевірки коефіцієнтів контрастності. Чистий чорний (#000000) на чистому білому дає максимальний контраст 21:1, але реверс, чистий білий на чистому чорному, створює особливо сильний ефект «галяції», який втомлює очі. Краще використовувати темно-сірий фон (наприклад, #121212) замість чисто чорного, а нечисто-білий текст (наприклад, #e8e8e8) замість чисто білого — це все одно відповідає вимогам WCAG щодо контрастності (детально описано в нашому посібнику на кольоровий контраст З’являється), але значно легше для очей.
Практичні правила
- Окремо перевірте контрастність у кожному режимі — світлому й темному — не лише один раз.
- Уникайте особливо насичених кольорів (яскраво-червоні або сині) на темному фоні — вони, як правило, візуально «вібрують» і ускладнюють читання.
- Зберігати ручний перемикач на сайті, а не лише покладатися на налаштування системи.
- Перевірте зображення та логотипи розроблені для світлого фону — іноді їм потрібна окрема версія для темного режиму, щоб залишатися розбірливими.
Чи готові ваші документи до темного режиму?
Багато PDF-файлів сьогодні відкриваються в темному режимі програм читання — наш інструмент перевіряє, чи контраст тексту у ваших документах відповідає стандарту в кожному режимі.
Відскануйте свій сайт безкоштовно ←Після сканування ви також можете зробити доступ до знайдених документів безпосередньо та безкоштовно через AccessiDoc.