Скрипт добавляет на сайт панель настройки отображения: размер до 200 %, пять контрастных схем, межбуквенный и междустрочный интервал, засечки, отключение картинок — набор, который проверяют по ГОСТ Р 52872-2019. Отдаю бесплатно и без условий.
Панель работает прямо на этой странице — включите её в разделе «Установка»
1
файл без зависимостей
0 ₽
и никакой подписки
ГОСТ Р 52872-2019
Шрифт
Контраст
Интервалы
Что умеет
Семь настроек — весь набор, который спрашивают по ГОСТу
Не «кнопка ради галочки»: каждая настройка стоит в стандарте и сделана по его цифрам, а не на глаз. Увеличить текст, убрать пестроту, развести буквы и строки, сменить шрифт, выключить картинки. Выбор сохраняется — на следующий визит настройки уже применены.
Размер шрифта
Четыре ступени до 200 % — верхняя ровно та, которую ГОСТ требует дать без вспомогательных программ. Масштабируется вся страница, вёрстка не рассыпается.
Пять контрастных схем
Чёрным по белому, белым по чёрному, тёмно-синим по голубому, коричневым по бежевому, зелёным по тёмно-коричневому. Контраст каждой пары не ниже 7:1.
Межбуквенный интервал
Разрядка от 0,12 кегля и расстояние между словами от 0,16 — те самые минимумы, которые проверяют по стандарту.
Междустрочный интервал
От 1,5 кегля, отступ между абзацами — полтора интерлиньяжа. Отдельная настройка, а не довесок к разрядке, как это обычно делают.
Шрифт с засечками
Переключение на антикву и обратно. Кому-то засечки помогают не терять строку, кому-то мешают — выбор за читателем.
Отключение изображений
Картинки, видео и иконки убираются совсем — освободившееся место уходит тексту, которого при 200 % на экране и так мало.
Озвучивание текста
Нажатие на абзац — и его читают вслух. Голос берётся из браузера, поэтому ни ключей, ни оплаты за синтез речи не нужно.
Соответствует ГОСТ Р 52872-2019
Национальный стандарт действует с 1 апреля 2020 года и опирается на
WCAG 2.1. Ниже — его требования и то, чем они закрыты в скрипте.
Масштаб текста до 200 % без вспомогательных программ
Четыре ступени: 100, 125, 150 и 200 %
Контраст 7:1 для обычного текста
Пять схем, минимальная пара — 7,8:1
Межбуквенный интервал от 0,12 кегля
Две ступени: 0,12 и 0,2
Расстояние между словами от 0,16 кегля
Меняется вместе с межбуквенным: 0,16 и 0,24
Междустрочный интервал от 1,5 кегля
Отдельная настройка: 1,5 и 2
Отступ абзаца от 1,5 интерлиньяжа
Ставится вместе с междустрочным
Отключение изображений
Картинки, видео и иконки убираются целиком
Управление с клавиатуры
Вся панель проходится табуляцией, Esc закрывает
Совместимость с экранными дикторами
aria-pressed на переключателях, изменения объявляются в aria-live
Панель закрывает требования к настройке отображения. Остальное —
alt-подписи, заголовки, структура и контраст самого дизайна — лежит
на стороне сайта: скрипт за вас их не напишет.
Установка
Два шага, третий — по желанию
Скрипт сам рисует панель и сам запоминает выбор посетителя. Никаких ключей, доменных лицензий и обращений ко мне за активацией. Кнопку он тоже нарисует сам, но если у вас уже есть своя ссылка «Версия для слабовидящих» — дайте ей id="a11y", и скрипт подхватит её, не трогая вёрстку.
Скрипт найдёт этот элемент сам и повесит на него панель. Ссылка,
кнопка, картинка — что угодно и где угодно: в подвале, в меню, в
шапке. Вид не меняется, свою кнопку скрипт тогда не рисует. Если на
сайте уже стоит id="specialButton" от другого такого
скрипта — он тоже подойдёт, переделывать не нужно.
Вопросы
Что обычно спрашивают
Почему бесплатно?
Такую панель просят почти все социальные учреждения, школы и клиники, а платить за неё отдельно бессмысленно — это полсотни строк кода. Мне проще отдать её всем, чем каждый раз выставлять счёт за одно и то же.
Можно использовать в коммерческом проекте?
Да. Ставьте на клиентские сайты, правьте под свой дизайн, убирайте упоминание MOADEV из файла — разрешение не требуется.
Это закрывает требования по доступности?
Панель — часть решения, но не всё. Полная доступность включает семантическую вёрстку, работу с клавиатуры, alt-подписи и контраст самого дизайна. Если нужен аудит и доработка — это уже платная работа, напишите.
Что-то сломалось на моём сайте
Напишите, посмотрю. Контрастные режимы намеренно перекрашивают всё агрессивно, и на нестандартной вёрстке иногда нужна пара правок.