Проверка проекта в AI
На гитхабе дизайнер создал файл A11y.md — готовый контекст, который загружаешь в Claude (или любую другую нейронку) — и она начинает проверять твои макеты по стандартам WCAG 2.2.
Дима и Миша рассказывали уже о том, что если не спросить нейронку, то она и не расскажет о доступности, так вот md решает данную проблему.
Мне нравится, как этот диз написал: Accessibility is not a feature or an incremental improvement; it is a pre-condition for use. Доступность — это необходимое условие.
Как пользоваться, если ты диз?
1. Открыть файл на GitHub A11Y.md из папки docs/en/
2. Вставить в начало чата с AI «Строго следуй правилам разработки, описанным в файле A11Y.md»
3. Скинуть файл или ссылку на свой проект
4. Готово!
Что внутри репозитория:
⚡ Command Center — главный файл с матрицей приоритетов, правилами поведения для AI и протоколом для сложных компонентов.
📚 Support Library — справочная библиотека с готовыми решениями по контрасту, формам, кнопкам, навигации и модалкам.
🛠️ Templates — шаблоны для финальной проверки перед релизом и структурированный лог для фиксации технического долга.
📝 Examples — реальные ошибки доступности из проекта на Figma Make, с конкретными исправлениями, которые предложил A11Y.md в роли автоматического ревьюера.
Немного того, что важно для дизайнера:
→ Контраст текста должен быть 4.5:1, элементов UI — 3:1
→ Нельзя передавать состояние только цветом — нужны иконка + текст + цвет
→ Минимальный размер кнопки — 44×44px
→ Плейсхолдер не заменяет подпись к полю
→ Графики обязаны различаться без цвета — текстурами или штриховкой
и многое другое
Этот файл не научит доступности с нуля, он действует скорее как быстрый фильтр и сверка с WCAG. Конечно, я за то, чтобы изучать A11y глубже )