CtrlK
BlogDocsLog inGet started
Tessl Logo

autofocus-avoidance

Use when reviewing rendered HTML, interactive components, or design-system patterns related to Avoid autofocus on form fields. Check native semantics first, then inspect keyboard behavior, focus flow, accessible names, and screen-reader output where relevant.

58

Quality

67%

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/autofocus-avoidance/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 clean, well-organized overview with a real one-level-deep reference, but it suffers from cross-section repetition, a missing concrete JS-focus example, and a loosely sequenced Check/Fix/Explain/Code Review flow.

Suggestions

Consolidate the redundant explanation of autofocus disrupting screen-reader context (currently in the intro, Explain, and Quick Reference) into one place to tighten token use.

Add a short executable snippet for the recommended JS-after-interaction focus pattern so the Fix section is copy-paste ready rather than descriptive.

Order the sections as a single Check → Fix → Verify flow (including how to confirm focus no longer moves on load) so the workflow has an explicit verification step.

DimensionReasoningScore

Conciseness

Mostly efficient, but the intro, Explain, and Code Review sections restate the same mid-page-context idea, and the Code Review paragraph is generic boilerplate that could be trimmed.

2 / 3

Actionability

Concrete directives exist ("Search for autofocus attributes", "Remove autofocus attributes"), but the JS-focus alternative is described without a runnable snippet, leaving a key detail incomplete.

2 / 3

Workflow Clarity

Check then Fix provides a light sequence, but Check/Fix/Explain/Code Review interleave without crisp ordering or any verification checkpoint, so the workflow is present but not clearly sequenced.

2 / 3

Progressive Disclosure

The body is a concise overview with a well-signaled one-level-deep pointer ("see `references/rule.md`") to a bundle file that exists, matching the clear-overview-with-one-level-reference anchor.

3 / 3

Total

9

/

12

Passed

Description

77%

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 concrete actions and an explicit trigger, but its templated opening dilutes trigger-term naturalness and raises conflict risk against similar accessibility skills.

Suggestions

Lead the description with the autofocus-specific trigger (e.g., "Use when a form field grabs focus on page load or when the user mentions autofocus, unexpected scrolling, or lost page context") so it reads as a natural user phrase and is distinct from sibling accessibility skills.

Drop the generic "rendered HTML, interactive components, or design-system patterns" preamble that is shared across many skills, since it does not differentiate this skill.

DimensionReasoningScore

Specificity

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

3 / 3

Completeness

Explicitly answers both — the "Use when reviewing..." clause gives the trigger, and the subsequent "Check native semantics...inspect keyboard behavior..." clause gives what to do.

3 / 3

Trigger Term Quality

Relevant keywords like "autofocus", "form fields", and "rendered HTML" are present, but the opening "reviewing rendered HTML, interactive components, or design-system patterns" reads as templated boilerplate and misses common user phrasings like "focus" or "page jumps on load."

2 / 3

Distinctiveness Conflict Risk

The "Avoid autofocus on form fields" niche is distinct, but the shared templated opening ("rendering HTML, interactive components, or design-system patterns") overlaps with sibling accessibility skills, creating trigger ambiguity.

2 / 3

Total

10

/

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.