site-qualitylisted

Проверяет готовую вёрстку сайта на ремесло, доступность и «дешевизну» перед сдачей. Используй после сборки лендинга, страницы или интернет-магазина, чтобы поймать проблемы до публикации. Держит токены, состояния, контраст, иерархию, формы, UX-тексты, Core Web Vitals и ловит главные признаки дешёвого AI-сайта. Работает в связке с site-director и site-motion.
Yelpin/claude-site-skills · ★ 0 · Web & Frontend · score 75

Install: claude install-skill Yelpin/claude-site-skills

# 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}` не о