accessibility-auditor
Аудит и исправление проблем веб-доступности
也可从以下获取: CrazyDubya
Проблемы веб-доступности могут лишить пользователей с ограниченными возможностями доступа к вашему сайту. Этот навык предоставляет комплексное руководство по внедрению стандартов WCAG 2.1, ARIA-атрибутов и навигации с клавиатуры для создания инклюзивного опыта для всех пользователей.
下载技能 ZIP
在 Claude 中上传
前往 设置 → 功能 → 技能 → 上传技能
开启并开始使用
测试它
正在使用“accessibility-auditor”。 Сделайте это навигационное меню доступным
预期结果:
- Используйте элемент nav с aria-label для идентификации навигационной области
- Убедитесь, что все ссылки доступны для фокусировки с правильными значениями tabindex
- Добавьте навигацию с клавиатуры с помощью клавиш-стрелок для выпадающих меню
- Включите ссылку для пропуска повторяющейся навигации
- Убедитесь, что индикатор фокуса виден на всех интерактивных элементах
正在使用“accessibility-auditor”。 Исправьте эту форму для обеспечения доступности
预期结果:
- Добавьте явные элементы label с атрибутами for, соответствующими идентификаторам input
- Группируйте связанные поля с помощью fieldset и legend
- Используйте aria-required для обязательных полей
- Добавьте aria-invalid и aria-describedby для сообщений валидации
- Убедитесь, что сообщения об ошибках используют области aria-live
安全审计
安全Pure documentation skill containing only accessibility guidance, code examples, and best practices. All static findings are false positives: ARIA attributes (like aria-checked, aria-expanded) were misidentified as cryptographic algorithms; markdown code block backticks were misidentified as shell execution; legitimate W3C URLs are not security risks. No executable code, network calls, or credential access.
风险因素
🌐 网络访问 (3)
⚙️ 外部命令 (78)
质量评分
你能构建什么
Создание доступных компонентов
Создание доступных модальных окон, аккордеонов, вкладок и форм с правильными ARIA-атрибутами и управлением фокусом.
Аудит веб-доступности
Проверка веб-сайтов на нарушения WCAG с использованием включённого контрольного списка тестирования и рекомендаций по доступности.
Проектирование инклюзивных интерфейсов
Проектирование пользовательского опыта, совместимого с вспомогательными технологиями и соответствующего стандартам доступности.
试试这些提示
Проверьте этот HTML-код на соответствие WCAG 2.1 AA. Проверьте отсутствие альтернативного текста, проблемы контрастности цветов и проблемы семантического HTML.
Помогите мне добавить правильные ARIA-атрибуты, чтобы сделать этот пользовательский компонент доступным. Это компонент выпадающего списка/модального окна/аккордеона.
Этот компонент недоступен для навигации с клавиатуры. Покажите мне, как реализовать правильный порядок табуляции и обработку событий клавиатury.
Какие тесты программы чтения с экрана мне следует выполнить, чтобы проверить доступность этой страницы для пользователей с нарушениями зрения?
最佳实践
- Начинайте тестирование доступности на ранних этапах разработки, а не исправляйте проблемы в конце
- Используйте семантические HTML-элементы перед добавлением ARIA-атрибутов
- Тестируйте с реальными вспомогательными технологиями, а не только с автоматизированными инструментами
避免
- Использование role="button" на div-элементах без надлежащей поддержки клавиатуры
- Использование текста-заполнителя в качестве замены видимых меток форм
- Использование только цвета для передачи информации пользователям