CtrlK
BlogDocsLog inGet started
Tessl Logo

tabs-accessibility

Use when reviewing templates, rendered HTML, or shared components related to Make tabs keyboard navigable. Validate the final browser-facing markup, not just the source framework abstraction.

60

Quality

70%

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

Fix and improve this skill with Tessl

tessl review fix ./skills/tabs-accessibility/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

78%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.

The content is a compact, well-structured overview: concrete ARIA criteria inline, a clear check/fix/explain/review flow, and full implementation detail correctly pushed to a single verified reference file. Weaknesses are minor — some role-name repetition between Check and Fix, and an implicit rather than explicit verification method in the Check step.

DimensionReasoningScore

Conciseness

The body is lean and assumes Claude's ARIA knowledge ('Use tablist, tab, and tabpanel roles', 'roving tabindex') with no padding or beginner explanation. Anchor 4 rather than 5 only because the Check and Fix sections repeat the same role names, and the awkward 'related to Make tabs keyboard navigable' phrase recurs in the Code Review section.

4 / 5

Actionability

Concrete, specific guidance throughout: exact roles (tablist/tab/tabpanel), roving tabindex, arrow-key/Tab behavior, and aria-controls/aria-labelledby pairing, plus 'Flag exact elements, attributes, and routes'. Anchor 4 rather than 5 because there is no inline code example — the working markup lives in references/rule.md — leaving a minor gap for immediate execution.

4 / 5

Workflow Clarity

The single-purpose review flow is coherent and well-sequenced: Quick Reference criteria, then Check, Fix, Explain, and Code Review sections. Anchor 4 rather than 5 because the Check step does not specify how to verify (e.g., which key interactions to test or what counts as a violation), leaving the verification checkpoint implicit.

4 / 5

Progressive Disclosure

The short body is a clear overview with well-organized sections, and all implementation detail is split into a single, clearly signaled, one-level-deep reference ('For full implementation details, code examples, and framework-specific guidance, see references/rule.md', verified to exist). Matches the anchor-5 pattern exactly for a skill of this size.

5 / 5

Total

17

/

20

Passed

Description

62%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.

The description has an explicit 'Use when...' trigger and a clear review-vs-framework-abstraction angle, but it embeds the awkward rule-title phrase 'related to Make tabs keyboard navigable' and omits the most natural trigger terms (accessibility, ARIA, screen reader). It is functional but sits below the top anchors on specificity and keyword coverage.

Suggestions

Add natural trigger synonyms users would actually say — 'accessibility', 'a11y', 'ARIA', 'screen reader', 'tab key' — to the trigger clause, e.g. 'Use when reviewing templates, rendered HTML, or shared components for tab accessibility (a11y), ARIA tab patterns, or keyboard navigation.'

Reword the embedded rule title into a natural capability statement: replace 'related to Make tabs keyboard navigable' with something like 'that render tab widgets', and name the concrete actions (check ARIA tablist/tab/tabpanel roles, roving tabindex, arrow-key navigation; flag violations in rendered markup).

State the full 'what' explicitly — checking roles and keyboard interaction patterns, flagging exact elements/attributes/routes, and guiding fixes — so the capability side matches the detail level of the 'when' clause.

DimensionReasoningScore

Specificity

The description names the domain and two concrete actions ('reviewing templates, rendered HTML, or shared components' and 'Validate the final browser-facing markup, not just the source framework abstraction'), but coverage is not comprehensive — the checking/fixing workflow implied by the skill body is not reflected. It falls between anchor 3 and 4, but closer to 3 since the 'what' is limited to reviewing/validating.

3 / 5

Completeness

Both parts are present: an explicit 'Use when reviewing templates, rendered HTML, or shared components...' trigger clause, and a 'what' ('Validate the final browser-facing markup, not just the source framework abstraction'). Not a 5 because the 'what' could be more concrete about what the skill actually does (check roles, keyboard patterns, flag violations).

4 / 5

Trigger Term Quality

Relevant keywords like 'tabs', 'keyboard navigable', 'templates', and 'rendered HTML' are present, but common natural variations users would say are missing — notably 'accessibility', 'a11y', 'ARIA', and 'screen reader'. Matches anchor 3 (some relevant keywords but missing common variations), not 4 which requires good coverage with only a few terms missing.

3 / 5

Distinctiveness Conflict Risk

The tabs keyboard-navigability niche is distinct with clear triggers, but 'reviewing templates, rendered HTML, or shared components' is a broad framing that could overlap with other HTML/component review skills. Mostly distinct with minor overlap risk — anchor 4, not 5.

4 / 5

Total

14

/

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.

Validation — 15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

metadata_version

'metadata.version' is missing

Warning

Total

15

/

16

Passed

Repository
thedaviddias/Front-End-Checklist
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.