CtrlK
BlogDocsLog inGet started
Tessl Logo

frontend-a11y

Accessibility patterns for React and Next.js — semantic HTML, ARIA attributes, form labeling, keyboard navigation, focus management, and screen reader support. Use when building any interactive UI component or form.

71

Quality

87%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

Passed

No findings from the security scan

SKILL.md
Quality
Evals
Security

Quality

Content

82%Weight 40%Scale 1-5

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

A highly actionable, well-structured accessibility reference with executable examples and a useful checklist. It could be slightly tighter and might split some full component examples into reference files for better progressive disclosure.

Suggestions

Trim restating prose and redundant code comments (e.g. the Modal focus-save comment) so examples carry the explanation.

Move the longer full-component examples (LoginForm, Dropdown, Modal) into a references/ file, leaving concise BAD/GOOD pairs inline with clear links.

Add a brief validate→fix→retry note for the Checklist so the review workflow has an explicit feedback loop.

DimensionReasoningScore

Conciseness

Mostly lean BAD/GOOD pairs with tight inline comments and minimal padding, but a few prose lines and code comments restate what the examples already show (e.g. 'Use the element that matches the intent', 'Save currently focused element and move focus into modal'), keeping it just below the leanest anchor.

4 / 5

Actionability

Provides fully executable, copy-paste-ready React/TSX components (LoginForm, Dropdown, Modal, Accordion, useReducedMotion, StatusMessage) plus concrete BAD/GOOD snippets covering the common accessibility cases.

5 / 5

Workflow Clarity

As a single-purpose patterns reference it has a 'When to Activate' list and a pre-review 'Checklist' acting as verification checkpoints, but there is no validate→fix→retry feedback loop, so it sits just below the top anchor.

4 / 5

Progressive Disclosure

Well-organized into clear one-level section headers with no nested references, but the ~435-line body keeps several full components inline where a longer reference file split could aid navigation, leaving a minor organization gap.

4 / 5

Total

17

/

20

Passed

Description

92%Weight 40%Scale 1-5

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

A strong, concrete description that names specific accessibility patterns and provides an explicit 'Use when' trigger clause. Its only gap is keyword synonym coverage (e.g. 'a11y', 'WCAG').

DimensionReasoningScore

Specificity

Lists multiple concrete capability areas — 'semantic HTML, ARIA attributes, form labeling, keyboard navigation, focus management, and screen reader support' — giving comprehensive coverage of the accessibility domain rather than vague language.

5 / 5

Completeness

Explicitly answers both what (the enumerated pattern areas) and when ('Use when building any interactive UI component or form'), matching the anchor that requires clear concrete trigger phrases for both.

5 / 5

Trigger Term Quality

Includes natural terms a user would say ('form', 'interactive UI component', 'ARIA', 'screen reader', 'keyboard navigation'), but omits common synonyms/extensions like 'a11y', 'accessibility', 'WCAG', or 'modal', so it is not fully comprehensive.

4 / 5

Distinctiveness Conflict Risk

Occupies a clear niche (React/Next.js accessibility) with distinct, domain-specific triggers and minimal realistic overlap with other skills.

5 / 5

Total

19

/

20

Passed

Validation

93%

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

metadata_version

'metadata.version' is missing

Warning

Total

15

/

16

Passed

Repository
affaan-m/ECC
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.