Как сделан этот сайт

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

Уровень доступности

Сайт сделан по стандарту WCAG 2.2, уровень AA. Это международный стандарт доступности веб-контента; на него опираются европейские требования, в том числе Европейский акт о доступности.

Что сделано

• Сайт работает с клавиатуры, фокус всегда виден: жёлтая полоса с тёмным контуром.
• Первая ссылка на каждой странице — «Перейти к содержимому».
• Контраст текста не ниже 4.5:1 в светлой и тёмной теме.
• Страница не ломается при увеличении до 400% и на экране шириной 320 пикселей.
• Сайт следует системным настройкам темы и уменьшения движения. Их можно поменять в «Настройках отображения».
• У картинок есть текстовые описания, картинки кейсов открываются в полном размере.
• Цветные поля и клавиша Tab на страницах — украшение: скринридер их пропускает. Текст на цветных полях всегда тёмный.
• Нет cookie, счётчиков и сторонних скриптов.

Как проверено

Полная проверка проводится перед запуском сайта.

• Автоматическая проверка axe на всех страницах в светлой и тёмной теме — запланировано
• Lighthouse, раздел «Доступность» — запланировано
• Навигация только с клавиатуры — запланировано
• Экранный диктор NVDA + Firefox (Windows) — запланировано
• Экранный диктор VoiceOver + Safari (iPhone) — запланировано
• Увеличение браузера до 200% и 400%, ширина 320 px — запланировано
• Контраст всех пар цветов в обеих темах — запланировано
• Системная настройка «уменьшить движение» — запланировано

Известные ограничения

Пока не обнаружено. Если вы нашли проблему — напишите, исправлю.

Сообщить о проблеме

Telegram: @mysvet_life. Почта: mysvetlife@gmail.com.