CtrlK
BlogDocsLog inGet started
Tessl Logo

select-name

Use when reviewing rendered HTML, interactive components, or design-system patterns related to Provide accessible names for select elements. 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/select-name/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

63%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 lean, well-organized overview that correctly pushes detail to a real, one-level-deep reference file with clear navigation. Its weaknesses are redundancy between the Check/Quick Reference/Explain sections and the absence of any inline markup example, which leaves the immediately actionable guidance thinner than it could be for an HTML-focused rule.

Suggestions

Merge the "Check" section into "Quick Reference" (they say the same thing) and drop or concretize the generic "Explain" section to eliminate redundancy.

Inline one minimal correct/incorrect <label for> + <select> snippet in the "Fix" section so the body is immediately actionable without loading the reference.

Promote the verification mention to an explicit checkpoint step, e.g., "Verify: confirm the accessible name in the browser accessibility tree and run axe/Lighthouse", ideally with a pointer to the Verification section of rule.md.

DimensionReasoningScore

Conciseness

"Check that every `<select>` element in your forms has a valid accessible name or linked label" largely duplicates the Quick Reference bullets, and the generic "Explain how accessible names for select elements provide the necessary context..." section adds little. Not 4 because of this redundancy across Check/Explain/Code Review; not 2 because the body is short, assumes competence, and never explains basics Claude already knows.

3 / 5

Actionability

"Add a `<label>` element with a `for` attribute that matches the `id` of the `<select>` tag" is concrete, but the body contains no inline executable code example (all code is deferred to the reference) and the aria-label/aria-labelledby alternatives are only named, never shown. Not 4 because an instruction-only skill of this type should include at least a minimal correct/incorrect markup snippet or specifics for the aria path; not 2 because the fix and check directives are specific enough to act on.

3 / 5

Workflow Clarity

The Check → Fix → Code Review section order forms a coherent sequence for a simple single-purpose skill, and verification is signaled via "note how to verify the fix with browser accessibility tooling or assistive tech". Not 5 because there is no explicit validate-checkpoint or fix-and-retry loop in the body itself; not 3 because verification is at least mentioned and the single action is unambiguous.

4 / 5

Progressive Disclosure

"For full implementation details, code examples, and framework-specific guidance, see `references/rule.md`" is a clearly signaled, one-level-deep reference, and the bundle file exists and delivers exactly what is promised (code examples, why-it-matters, verification steps). The overview/body split is appropriate for a short skill, matching the 'clear overview with well-signaled one-level-deep references' anchor.

5 / 5

Total

15

/

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 set of inspection actions and natural accessibility vocabulary. Its main weaknesses are the generic template-style trigger clause that invites confusion with sibling accessibility rules, and a 'what' that is expressed through an awkwardly embedded rule title rather than a direct capability statement.

Suggestions

Lead with a direct capability statement (e.g., "Ensures every <select> element has an accessible name via <label for>, aria-label, or aria-labelledby") instead of embedding the rule title mid-sentence.

Narrow the 'Use when' clause to select-specific triggers such as "dropdowns", "form labels", "aria-labelledby", or "screen readers on forms" to reduce overlap with sibling accessibility rules that share the same generic opener.

Add natural synonyms users actually say — "dropdown", "a11y", "form label" — to improve trigger term coverage.

DimensionReasoningScore

Specificity

"Check native semantics first, then inspect keyboard behavior, focus flow, accessible names, and screen-reader output" lists several concrete inspection actions, matching the 'several specific actions; minor gaps' anchor. It is not 5 because remediation/verification actions are absent, and not 3 because coverage goes well beyond 1-2 generic actions.

4 / 5

Completeness

Both parts are present: "Use when reviewing rendered HTML, interactive components, or design-system patterns related to..." supplies the when, and the check/inspect clauses supply the what. Not 5 because the 'what' is awkwardly conveyed via the embedded rule title "related to Provide accessible names for select elements" rather than a crisp capability statement; not 3 because neither half is missing or vague.

4 / 5

Trigger Term Quality

Includes natural a11y vocabulary users would say: "select elements", "accessible names", "screen-reader", "keyboard", "rendered HTML". Not 5 because common synonyms like "dropdown", "form label", "a11y", or "WCAG" are missing; not 3 because keyword coverage is genuinely good rather than partial.

4 / 5

Distinctiveness Conflict Risk

The templated opener "Use when reviewing rendered HTML, interactive components, or design-system patterns related to" would equally match any sibling frontendchecklist accessibility rule, so differentiation rests solely on the mid-sentence rule title. Not 4 because the broad first clause creates real overlap risk with closely related accessibility skills; not 2 because the select/accessible-name focus is still identifiable.

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.