Run accessibility and visual design review on components. Use when reviewing UI code for WCAG compliance and design issues.
Overall
score
85%
Does it follow best practices?
If you maintain this skill, you can automatically optimize it using the tessl CLI to improve its score:
npx tessl skill review --optimize ./path/to/skillValidation for skill structure
Discovery
75%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 description has good structure with explicit 'what' and 'when' clauses, and carves out a distinct niche around accessibility review. However, it could be strengthened by listing more specific actions it performs and including additional natural trigger terms users commonly use when discussing accessibility.
Suggestions
Add specific concrete actions like 'check color contrast ratios, verify ARIA labels, audit keyboard navigation, validate semantic HTML'
Include common accessibility trigger terms users might say: 'a11y', 'screen reader support', 'ADA compliance', 'contrast ratio', 'keyboard accessible'
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | Names the domain (accessibility, visual design) and general actions (review components), but lacks specific concrete actions like 'check color contrast', 'verify ARIA labels', or 'audit keyboard navigation'. | 2 / 3 |
Completeness | Clearly answers both what ('Run accessibility and visual design review on components') and when ('Use when reviewing UI code for WCAG compliance and design issues') with explicit trigger guidance. | 3 / 3 |
Trigger Term Quality | Includes some relevant terms ('accessibility', 'WCAG', 'UI code', 'design') but misses common variations users might say like 'a11y', 'screen reader', 'ADA compliance', 'contrast ratio', or 'keyboard accessible'. | 2 / 3 |
Distinctiveness Conflict Risk | Clear niche combining accessibility + visual design review with specific WCAG mention; unlikely to conflict with general code review or design system skills due to the explicit accessibility focus. | 3 / 3 |
Total | 10 / 12 Passed |
Implementation
87%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
This is a strong, well-structured skill that efficiently communicates accessibility and design review criteria. The use of tables for WCAG checks is excellent for scannability and actionability. The main weakness is the implicit workflow - while the guidelines section provides some direction, a more explicit step-by-step review process would improve consistency.
Suggestions
Add an explicit numbered workflow at the top (e.g., '1. Read file completely, 2. Scan for critical issues first, 3. Document with line numbers, 4. Provide fixes, 5. Calculate score')
Consider adding a brief note on how the score (XX/100) should be calculated based on issue severity counts
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The skill is lean and efficient, using tables to compress accessibility checks into scannable format. No unnecessary explanations of what WCAG is or how accessibility works - assumes Claude's competence. | 3 / 3 |
Actionability | Highly actionable with specific patterns to look for (e.g., '<div onClick>' without role/tabIndex), concrete fixes ('Add aria-label="Close"'), and exact WCAG references. The output format template is copy-paste ready. | 3 / 3 |
Workflow Clarity | The workflow is implicit rather than explicit - guidelines mention 'read file first' and 'prioritize critical issues' but lacks a clear numbered sequence. For a review task, validation/verification steps (e.g., confirming fixes work) are missing. | 2 / 3 |
Progressive Disclosure | Well-organized with clear sections (Accessibility Review → Visual Design Review → Output Format → Guidelines). Content is appropriately contained in a single file given its focused scope, with logical hierarchy using headers and tables. | 3 / 3 |
Total | 11 / 12 Passed |
Validation
87%Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.
Validation — 14 / 16 Passed
Validation for skill structure
| Criteria | Description | Result |
|---|---|---|
metadata_version | 'metadata' field is not a dictionary | Warning |
license_field | 'license' field is missing | Warning |
Total | 14 / 16 Passed | |
Table of Contents
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.