CtrlK
BlogDocsLog inGet started
Tessl Logo

focus-management

Use when reviewing rendered HTML, interactive components, or design-system patterns related to Manage focus during dynamic interactions. Check native semantics first, then inspect keyboard behavior, focus flow, accessible names, and screen-reader output where relevant.

65

Quality

78%

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/focus-management/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

57%

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

A well-organized, concise review skill that correctly defers deep implementation to a real reference file. Its weaknesses are conceptual padding in the intro, absence of any executable example in the body, and a review workflow that lacks an explicit validation/feedback step.

Suggestions

Drop or trim the opening "Poor focus management leaves keyboard users stranded..." sentence; it explains the why of focus management that Claude already knows — lead directly with the actionable Quick Reference.

Add one small executable snippet in the Fix section (e.g., a focus-trap pattern using tabindex='-1' and element.focus()) so the body is actionable without opening rule.md.

Turn the review flow into an explicit sequenced checklist with a validation step, e.g. after Fix add "Verify: re-tab through the component and confirm focus lands on the expected element before considering it resolved."

DimensionReasoningScore

Conciseness

The body is mostly lean (Quick Reference bullets, short Check/Fix/Explain/Code Review sections), but the opening sentence explains why focus management matters — "Poor focus management leaves keyboard users stranded..." — which is conceptual context Claude already knows and could be cut.

2 / 3

Actionability

It names concrete techniques ("tabindex='-1'", "focus()", "focus trapping") and specific things to flag in Code Review, but provides no executable example in the body — all implementation detail is deferred to references/rule.md, leaving the guidance incomplete on its own.

2 / 3

Workflow Clarity

Check → Fix → Explain → Code Review gives a loose sequence and Code Review mentions verifying the fix with browser tooling, but there is no explicit validation checkpoint or feedback loop structured into the flow; the verify hint is buried in prose.

2 / 3

Progressive Disclosure

A concise overview body with a clearly signaled, one-level-deep pointer — "see `references/rule.md`" — to a file that exists, matching the score-3 anchor for clear overview with well-signaled shallow references.

3 / 3

Total

9

/

12

Passed

Description

100%

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 description with an explicit "Use when" trigger, several concrete inspection actions, natural accessibility vocabulary, and a well-scoped niche. The only rough edge is the embedded rule title "Manage focus during dynamic interactions," which reads slightly awkwardly but does not weaken any dimension against the anchors.

DimensionReasoningScore

Specificity

Lists multiple concrete inspection actions — "inspect keyboard behavior, focus flow, accessible names, and screen-reader output" plus "Check native semantics first" — matching the score-3 anchor for multiple specific concrete actions.

3 / 3

Completeness

Explicitly answers both what ("Check... inspect...") and when via a present "Use when reviewing rendered HTML..." trigger clause, satisfying the score-3 anchor and avoiding the missing-trigger cap at 2.

3 / 3

Trigger Term Quality

Covers natural terms an accessibility reviewer would say ("rendered HTML", "interactive components", "keyboard behavior", "focus flow", "accessible names", "screen-reader output"), giving good coverage rather than just a few relevant keywords.

3 / 3

Distinctiveness Conflict Risk

Targets a clear niche — focus management during dynamic interactions / accessibility review — with distinct triggers, making it unlikely to fire for unrelated skills.

3 / 3

Total

12

/

12

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