AIKraft/AI/Войти
AIKraft/Skills/Веб-типографика

Веб-типографика

Select, pair, and implement typefaces for web projects. Use when the user mentions

wondelai official Другое

Что делает навык

Навык предоставляет практическое руководство по выбору, сочетанию и внедрению шрифтов для веб-проектов, основанное на принципе «прозрачного бокала», чтобы типографика не отвлекала от контента. Он позволяет оценить текущее состояние реализации через систему из 10 диагностических строк и достичь целевого балла 10/10.

Когда применять

  • Аудит существующей веб-страницы на соответствие стандартам веб-типографики
  • Выбор шрифтовых пар с учетом тональности контента (например, юридический сайт или приложение для детей)
  • Оптимизация параметров чтения (размер, длина строки, межстрочный интервал) для повышения доступности
  • Диагностика проблем производительности, таких как FOIT (Flash of Invisible Text) или большой вес шрифта
  • Настройка fallback-шрифтов и проверка отображения при увеличении масштаба до 200%

Как работает

  1. Определить контекст и тональность контента, чтобы выбрать подходящий шрифт, соответствующий принципу «прозрачного бокала».
  2. Провести быструю диагностику (Quick Diagnostic) по 10 ключевым параметрам: размер body (16px+), длина строки (до 75ch), line-height (1.4+), контраст уровней, вес шрифта (<200KB), наличие fallback-шрифтов, устойчивость к зуму 200% и отсутствие FOIT.
  3. Присвоить текущий балл (от 0 до 10) на основе количества выполненных диагностических строк.
  4. Выявить конкретные строки диагностики, которые не выполнены, и сформулировать текущий статус.
  5. Внести изменения в реализацию для устранения выявленных недостатков и повышения балла до целевого значения 10/10.
  6. Повторно проверить реализацию и подтвердить достижение целевого балла.

Примеры запросов агенту

Проведи быструю диагностику веб-страницы по навыку Web Typography и оцени текущий балл.
Как выбрать шрифт для юридического сайта, чтобы он соответствовал принципу «прозрачного бокала»?
Проверь, удовлетворяет ли моя верстка требованиям к размеру body, длине строки и весу шрифта согласно SKILL.md.

Описание составлено по SKILL.md навыка, сверено 05.10.2026.

Как подключить

1Скачать навык
# возьмите папку навыка «web-typography» из репозитория: # https://github.com/wondelai/skills
2Положить папку с SKILL.md к навыкам ассистента
# положите папку навыка туда, где ассистент ищет skills: cp -r web-typography/ ~/.claude/skills/web-typography/

Навык — папка с файлом SKILL.md (описание + инструкции) и опциональными скриптами. Ассистент (Claude, Claude Code и совместимые) подхватывает его по описанию и следует шагам.