Доступностьоформлено 2026.06
Сделано, чтобы этим пользовались.
the wingman project делает громкие, насыщенные цветом, анимированные работы. Всё это мало чего стоит, если вы не можете это прочитать, дотянуться до этого или пройти по этому с клавиатуры. На этой странице прямо сказано, что мы делаем для доступности, чего ещё не делаем и как сообщить нам, когда что-то вам мешает.
рис. 01: кольцо фокуса, которое никогда не прячется
Наше обязательство
Мы считаем доступность ремеслом, а не бумажной работой ради соответствия. Страница, которая работает только для части посетителей, это незаконченная страница. Поэтому доступность входит в то, как мы строим (в саму дизайн-систему, а не прикручивается потом), и каждая новая страница, которую мы выпускаем, проверяется по стандартам ниже.
Мы не будем делать вид, что работа закончена. Это не так. Но вот ровно то, где она находится сейчас.
Что сделано на сегодня
- 01
Ссылка-переход и ориентиры
Каждая страница начинается со ссылки «перейти к содержанию», которая появляется, как только получает фокус с клавиатуры, а содержание находится в настоящем ориентире
mainс объявленным языком документа. - 02
Уменьшенное движение, с уважением
Сайт намеренно построен на анимации, и движение подчиняется настройке
prefers-reduced-motionвашей системы. Наши таблицы стилей (включая навигацию) содержат правила уменьшенного движения, которые отключают анимацию, когда вы попросили спокойствия. - 03
Видимый фокус с клавиатуры
Там, где мы оформляем фокус, мы используем
:focus-visible, чтобы пользователи клавиатуры видели чёткое кольцо: меню навигации и форма обратной связи имеют собственные состояния фокуса, и мы никогда не убираем индикатор фокуса браузера по всему сайту. - 04
Цели касания, в которые можно попасть
Ссылки навигации, кнопки и элементы формы построены с минимальной целью касания в 44 пикселя. Большие пальцы не являются точными инструментами, и мы проектируем так, будто знаем это.
- 05
Подписанные формы, настоящие заголовки
У каждого поля нашей формы обратной связи есть программно связанная подпись (никаких трюков с placeholder вместо подписи), а страницы используют семантическую иерархию заголовков, а не стилизованные div.
- 06
Нижний предел размера текста на мобильных
Наша типографическая шкала плавная, и страницы, которые мы строим сейчас, держат основной текст и подписи не меньше 11 отрисованных пикселей на маленьких экранах.
Где мы не дотягиваем, честно
Этот сайт визуально насыщен намеренно: закрашенные поля, плотные рисунки, много движения. Эта амбиция создаёт настоящую работу по доступности, и часть её ещё впереди:
- Сайт сильно опирается на анимацию. Мы держим её за настройкой уменьшенного движения, но если эта настройка у вас не включена, некоторые страницы перегружены. Это компромисс, на который мы пошли сознательно, и выход из него настоящий.
- Некоторые декоративные микроподписи на старых страницах меньше 11-пиксельного предела, которого мы теперь придерживаемся. Мы убираем их по мере пересборки страниц.
- Мы рисуем сотни авторских иллюстраций и ещё не завершили полную проверку альтернативного текста на каждой странице с большим количеством иллюстраций.
- Собственное оформление фокуса есть там, где оно важнее всего (навигация и формы), но пока не единообразно для каждого интерактивного элемента на каждой странице.
Цель
Мы движемся к WCAG 2.2 AA на всём сайте. Формулировка намеренная: мы не заявляем о сертификации соответствия и не станем, пока это утверждение не будет верно везде, а не только на наших лучших страницах. Стандарт задаёт направление движения и проверяется на реальных страницах каждый раз, когда мы пересобираем одну из них.
Наткнулись на барьер? Скажите нам.
Если что-то на этом сайте трудно прочитать, трудно достать или трудно использовать (с программой чтения с экрана, клавиатурой, переключателем, большими пальцами, чем угодно), мы искренне хотим об этом знать. Напишите нам и опишите, что произошло и где. Мы ответим, и если это что-то, что мы можем исправить, мы исправим.
hello@thewingmanproject.com