site-qualitylisted
Install: claude install-skill Yelpin/ux-ui-design-website
# site-quality — ворота качества
> Часть сборника **site-studio**. Финальные ворота: вызывается site-director перед находимостью и деплоем; при провале — возврат на переделку.
Отделяет «красивую картинку» от рабочего сайта и ловит «дёшево» до того, как это увидит клиент. Прогоняй перед сдачей; нарушение — возврат на исправление.
## Ремесло
- **Токены:** 4–6 именованных цветов, одна шкала кегля (12/14/16/20/28/44/72), один шаг отступов (8/16/24/40/64/96). Всё из них, ничего «на глаз». Сверь с `DESIGN.md` — вёрстка не должна расходиться со спекой.
- **Состояния:** у каждого интерактива `hover`, `focus-visible`, `active`, `disabled`; у полей — `error`. Кнопка без состояний — картинка. Полный разбор контейнеров и обратной связи — `references/interaction-patterns.md`.
- **Иерархия:** один главный акцент на экран; размер, вес, контраст и воздух ведут взгляд. «Почему» за проверками — `references/craft-laws.md` (законы UX, гештальт).
- **UX-текст:** активный залог; глагол+объект на кнопках; ошибка — как направление. Полный чек — `references/ux-writing.md`.
- **Формы:** отдельные ворота — `references/forms-and-inputs.md` (меньше полей, валидация на blur, ошибка как направление, экран успеха).
## Доступность (WCAG 2.2 AA)
- **Контраст — не на глаз, а скриптом.** Прогони `node "${CLAUDE_PLUGIN_ROOT}/skills/site-quality/scripts/contrast-check.js" "#ink" "#bg"` для каждой текст-на-фоне пары, или собери токены в JSON и добавь `--tokens tokens.json`. (Если `${CLAUDE_PLUGIN_ROOT}` не о