accessibility · davila7 — скилл для Claude Code: доступность и установка
Скилл помогает проверять веб-интерфейсы на доступность по WCAG 2.1 и предлагать правки. Запросите аудит, поддержку клавиатуры или улучшения для скринридеров.
npx claude-code-templates@latest --skill development/accessibilityЧто делает accessibility
Скилл направляет Claude Code при проверке доступности веб-страниц по WCAG 2.1. Он охватывает альтернативный текст для изображений, контраст, подписи к медиа, управление с клавиатуры, видимый фокус, язык страницы и другие элементы интерфейса.
По этим рекомендациям агент может находить проблемы и предлагать изменения в коде: например, добавить доступное имя кнопке с иконкой или сделать ошибки формы понятными не только по цвету. В документе также приведены примеры для модальных окон, ссылок перехода к основному содержимому и настройки анимации.
Это набор рекомендаций, а не гарантия соответствия стандарту: результат зависит от того, что агент проверит в проекте. Установите скилл в Claude Code командой npx claude-code-templates@latest --skill development/accessibility.
Какие задачи решает
- найти изображения без текстовой альтернативы
- проверить контраст текста и элементов интерфейса
- добавить управление интерактивными элементами с клавиатуры
- сделать состояния фокуса заметными
- пояснить ошибки формы без опоры только на цвет
Примеры запросов агенту
- Проверь страницу формы на доступность по WCAG 2.1 и предложи правки.
- Найди элементы интерфейса, которыми нельзя пользоваться с клавиатуры.
- Проверь подписи изображений и доступные имена кнопок с иконками.
Как установить accessibility
1Через claude-code-templates
npx claude-code-templates@latest --skill development/accessibility2Через Skills CLI (Vercel)
npx skills add davila7/claude-code-templates --skill accessibility -a claude-code3Вручную: положить файлы
~/.claude/skills/accessibility/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/accessibility/
Вручную: положить файлы
.agents/skills/accessibility/SKILL.mdДля всех проектов — ~/.agents/skills/
Вручную: положить файлы
.cursor/skills/accessibility/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install davila7/claude-code-templates accessibility2Вручную: положить файлы
.github/skills/accessibility/SKILL.mdКомандой платформы
gemini skills install https://github.com/davila7/claude-code-templates --path cli-tool/components/skills/development/accessibilityВручную: положить файлы
.devin/skills/accessibility/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Claude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о accessibility
Как установить accessibility в Claude Code?
Выполните npx claude-code-templates@latest --skill development/accessibility.
Что делает скилл accessibility?
Он помогает проверять веб-интерфейсы на доступность по WCAG 2.1 и предлагать изменения. Среди тем — контраст, клавиатурная навигация, фокус и альтернативы для медиа.
Проверяет ли accessibility доступность с клавиатуры?
Да. Рекомендации охватывают клавиатурное управление, видимый фокус и отсутствие ловушек фокуса в модальных окнах.
Похожие скиллы
Все скиллы по теме «Фронтенд и UI» →Сначала — accessibility от других авторов.
