web-design-guidelines
Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site against best practices".
60
69%
Does it follow best practices?
Impact
—
No eval scenarios have been run
Advisory
Suggest reviewing before use
Optimize this skill with Tessl
npx tessl skill review --optimize ./skills/web-design-guidelines/SKILL.mdQuality
Discovery
82%Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.
This is a solid description with excellent trigger term coverage and a clear 'Use when' clause that makes it easy for Claude to know when to select it. Its main weaknesses are the lack of specific concrete actions (what exactly does the review check?) and some potential overlap with other UI/UX/accessibility-related skills due to broad trigger terms.
Suggestions
Add specific concrete actions the skill performs, e.g., 'Checks color contrast ratios, validates semantic HTML, audits keyboard navigation, reviews responsive design patterns'
Narrow distinctiveness by referencing the specific guidelines framework more prominently and distinguishing from general accessibility or code review skills
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | It names the domain (UI code review) and the framework (Web Interface Guidelines compliance), but doesn't list specific concrete actions like 'check color contrast', 'validate ARIA labels', 'audit navigation patterns'. The description tells us the general activity but not the specific checks or outputs. | 2 / 3 |
Completeness | Clearly answers both 'what' (review UI code for Web Interface Guidelines compliance) and 'when' (explicit 'Use when' clause with multiple trigger phrases). The when clause is explicit and well-structured. | 3 / 3 |
Trigger Term Quality | Includes strong natural trigger terms that users would actually say: 'review my UI', 'check accessibility', 'audit design', 'review UX', 'check my site against best practices'. These cover multiple natural phrasings a user might employ. | 3 / 3 |
Distinctiveness Conflict Risk | While 'Web Interface Guidelines compliance' is somewhat specific, terms like 'review UX', 'audit design', and 'check accessibility' could overlap with general accessibility audit skills, design review skills, or code review skills. The specific framework reference helps but the trigger terms are broad enough to cause conflicts. | 2 / 3 |
Total | 10 / 12 Passed |
Implementation
57%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
This skill is a lightweight wrapper that delegates almost all substantive logic to an externally fetched document. While concise and well-structured, it suffers from redundancy between sections and lacks actionable fallback guidance, concrete output examples, or validation steps. The skill essentially tells Claude to fetch a URL and follow whatever it says, which limits its standalone value.
Suggestions
Merge the redundant 'How It Works' and 'Usage' sections into a single clear workflow to eliminate repetition.
Add a fallback or error-handling step for when the URL fetch fails (e.g., cached rules, user notification).
Include a concrete example of expected output format inline (e.g., a sample `file:line` finding) so Claude knows the target format even before fetching.
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The skill is relatively short but has some redundancy—the 'How It Works' and 'Usage' sections largely repeat the same 4-step process. The explanation could be tightened by merging these into a single workflow. | 2 / 3 |
Actionability | It provides a concrete URL to fetch and mentions using WebFetch, but the actual review logic is entirely delegated to the fetched content. There's no concrete example of output format, no sample findings, and no fallback if the fetch fails. The skill itself doesn't contain executable guidance—it's a pointer to external guidance. | 2 / 3 |
Workflow Clarity | Steps are listed and sequenced, but there's no validation checkpoint (e.g., what to do if the fetch fails, how to handle parse errors in the fetched guidelines, or how to verify the output). The workflow is also stated twice in slightly different forms without adding clarity. | 2 / 3 |
Progressive Disclosure | For a simple, single-purpose skill under 50 lines with no bundle files, the content is well-organized into clear sections (How It Works, Guidelines Source, Usage). The structure is appropriate for the skill's complexity. | 3 / 3 |
Total | 9 / 12 Passed |
Validation
100%Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.
Validation — 11 / 11 Passed
Validation for skill structure
No warnings or errors.
- Repository
- vercel-labs/agent-skills
- Commit
b9c8ee0
- Reviewed
Table of Contents
Is this your skill?
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.