CtrlK
BlogDocsLog inGet started
Tessl Logo

anchor-smooth-scroll

Use when reviewing rendered HTML, interactive components, or design-system patterns related to Provide instant anchor scroll option. Check native semantics first, then inspect keyboard behavior, focus flow, accessible names, and screen-reader output where relevant.

63

Quality

75%

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/anchor-smooth-scroll/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 body is a well-structured, lean overview for a simple accessibility rule: concrete check/fix instructions, a clear sequence, and a properly signaled one-level reference to references/rule.md that carries the code examples. Its only notable gaps are slight redundancy between the intro and 'Explain' sections and the lack of an inline how-to for emulating reduced motion during verification.

DimensionReasoningScore

Conciseness

The body is lean (~30 lines) with sectioned, checklist-style guidance and no padding of concepts Claude already knows; the one-line vestibular-disorder rationale is minimal and earns its place. It stops short of 5 because the 'Explain' section largely restates the intro sentence and the 'Code Review' section repeats the description's templated phrasing, both of which could be trimmed.

4 / 5

Actionability

The Fix section gives concrete, specific instruction — 'Use scroll-behavior: smooth only within a prefers-reduced-motion media query check' and 'Ensure focus moves to the anchor target' — and the Check section names the exact verification (disable smooth scrolling when prefers-reduced-motion is set). As an instruction-only skill the guidance is mostly executable, but no actual CSS snippet appears inline, leaving minor gaps covered only by the reference file.

4 / 5

Workflow Clarity

The Check → Fix → Explain → Code Review structure gives a clear, unambiguous sequence for this simple single-purpose skill, and the Check step doubles as a verification ('verify smooth scrolling is disabled when prefers-reduced-motion is set'). It misses 5 because the body never says how to emulate prefers-reduced-motion (e.g., browser dev-tools rendering option) — an implicit checkpoint rather than an explicit one.

4 / 5

Progressive Disclosure

The SKILL.md is a concise overview with well-organized sections, and the single bundle file references/rule.md exists and is clearly signaled one level deep: 'For full implementation details, code examples, and framework-specific guidance, see references/rule.md.' Code examples are appropriately deferred to the reference rather than inlined, matching the clear-overview anchor exactly; there is no nesting or buried reference.

5 / 5

Total

17

/

20

Passed

Description

71%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 answers both 'what' and 'when' with a concrete list of inspection actions and natural trigger keywords, placing it solidly above the midpoint. Its main weaknesses are a templated, non-specific 'Use when' clause and the absence of the rule's most natural trigger terms (smooth scroll, reduced motion), which create overlap risk with sibling accessibility skills.

Suggestions

Add the rule's most natural trigger terms to the description — e.g., 'smooth scroll(ing)', 'scroll-behavior', 'prefers-reduced-motion', and 'anchor links/navigation' — so users searching on those phrases reliably hit this skill.

Replace the generic 'reviewing rendered HTML, interactive components, or design-system patterns' boilerplate with rule-specific triggers (e.g., 'Use when reviewing same-page anchor navigation, scroll-behavior CSS, or reduced-motion handling') to reduce conflict with sibling accessibility skills that share the same templated opener.

State the skill's core remediation action in the 'what' clause (e.g., 'Disable smooth scrolling under prefers-reduced-motion and ensure focus moves to the anchor target') so the capability list is comprehensive, not just inspection-oriented.

DimensionReasoningScore

Specificity

The description lists several concrete actions — 'Check native semantics first, then inspect keyboard behavior, focus flow, accessible names, and screen-reader output' — which matches the anchor for several specific actions with minor gaps. It does not reach 5 because it omits the skill's core remediation actions (e.g., disabling smooth scroll under prefers-reduced-motion), and is above 3 because coverage goes well beyond naming the domain with 1-2 actions.

4 / 5

Completeness

Both parts are explicitly present: 'what' via 'Check native semantics first, then inspect keyboard behavior, focus flow, accessible names, and screen-reader output' and 'when' via 'Use when reviewing rendered HTML, interactive components, or design-system patterns related to...'. It is below 5 because the 'when' clause is templated and generic rather than giving concrete, rule-specific trigger phrases.

4 / 5

Trigger Term Quality

Includes natural, user-sayable phrases such as 'rendered HTML', 'interactive components', 'anchor scroll', 'keyboard behavior', 'focus flow', and 'screen-reader output', giving good keyword coverage. It falls short of 5 because the most natural trigger terms for this rule — 'smooth scroll(ing)', 'prefers-reduced-motion', 'reduced motion', 'anchor links' — are absent except via the rule title.

4 / 5

Distinctiveness Conflict Risk

The opening trigger ('reviewing rendered HTML, interactive components, or design-system patterns') plus the generic checklist of keyboard/focus/screen-reader checks is boilerplate shared across many accessibility skills, so it would readily fire for sibling rules like focus-order or link-name checks. Only the embedded rule name 'Provide instant anchor scroll option' provides a distinct signal, matching 'somewhat specific but could still overlap with similar skills' rather than the mostly-distinct anchor at 4.

3 / 5

Total

15

/

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.