CtrlK
BlogDocsLog inGet started
Tessl Logo

empty-heading

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

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/empty-heading/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 lean, well-structured overview for a simple single-purpose rule: concrete check and fix guidance, a coherent Check/Fix/Explain/Code Review flow, and an appropriately signaled one-level reference to rule.md that carries the code examples. Remaining weaknesses are minor — slight duplication between Quick Reference and Check/Fix, and a vague verification gesture ('browser accessibility tooling') with no named tool or check.

DimensionReasoningScore

Conciseness

The ~30-line body assumes Claude's competence — no explanations of what HTML or headings are — with each section delivering one directive ("Find any heading tags (h1 through h6) that are empty or contain only non-perceivable whitespace"). It falls at anchor 4 rather than 5 because the Quick Reference bullets ('Add visible, descriptive text to all heading elements', 'Avoid using headings solely for styling...') partially duplicate the Check/Fix sections and could be trimmed, and the Explain section is a meta-instruction that adds little.

4 / 5

Actionability

For an instruction-only skill the guidance is actionable: the Check gives a specific criterion (headings h1-h6 that are empty or whitespace-only), and the Fix gives two concrete options ("Add descriptive text content to the empty heading or remove the heading tag if it's not needed"), with executable code examples delegated to references/rule.md. It stays at 4 rather than 5 because no concrete detection mechanism (e.g., a selector like h1:empty, an axe/Lighthouse rule, or a grep pattern) is given inline — a minor gap per the instruction-only scoring note.

4 / 5

Workflow Clarity

The Check → Fix → Explain → Code Review sequence is coherent and the single action (find and fix empty headings) is unambiguous, with Code Review gesturing at verification ("note how to verify the fix with browser accessibility tooling or assistive tech"). It is not 5 because the verification step is vague — no specific tool or check is named — matching anchor 4's 'clear sequence with most checkpoints present; minor validation gaps'. No cap applies since this is not a destructive or batch operation.

4 / 5

Progressive Disclosure

The body is a lean overview with well-organized sections (Quick Reference, Check, Fix, Explain, Code Review) and a single, clearly signaled, one-level-deep pointer: "For full implementation details, code examples, and framework-specific guidance, see `references/rule.md`" — the file exists (63 lines with good/bad HTML examples) and nothing is nested further. This matches the anchor-5 pattern exactly.

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 concrete review actions, satisfying the completeness requirement, but it leans on generic accessibility-review boilerplate instead of stating the skill's heading-specific behavior (detect empty h1-h6 elements and fix them) and misses the natural trigger phrases users would say. The awkward construction "related to Ensure headings contain text" reads like a template artifact rather than a natural trigger clause.

Suggestions

State the skill's actual capability concretely, e.g., 'Flags empty or whitespace-only heading elements (h1-h6) in rendered HTML and guides adding descriptive text or removing the tag.'

Add natural trigger terms users would say, such as 'empty heading', 'heading with no text', 'document outline', or 'screen-reader heading navigation', instead of the template phrase 'related to Ensure headings contain text'.

Tighten the trigger to the rule's actual scope (heading markup review) rather than the broad 'interactive components or design-system patterns' boilerplate, which overlaps with sibling accessibility-rule skills.

DimensionReasoningScore

Specificity

The description names the domain and a few review actions ("Check native semantics first, then inspect keyboard behavior, focus flow, accessible names, and screen-reader output"), but these are generic accessibility-review actions rather than heading-specific ones — it never states what the skill actually does about empty headings (e.g., flag or fix them). It matches anchor 3 (domain plus 1-2 concrete actions, not comprehensive) rather than 4, which would require several specific actions covering the skill's actual capabilities; it is above 2 because the actions are concrete, not minimal.

3 / 5

Completeness

Both parts are present: the "what" ("Check native semantics first, then inspect keyboard behavior, focus flow, accessible names, and screen-reader output") and an explicit "Use when reviewing rendered HTML, interactive components, or design-system patterns related to Ensure headings contain text" trigger clause. It falls short of the anchor-5 example because the trigger conditions are broad template language rather than concrete phrases users would naturally say (e.g., "when you find empty h1-h6 tags"), and the "what" is generic review boilerplate; it is clearly above 3 since the 'when' is explicit, not weakly implied.

4 / 5

Trigger Term Quality

Trigger terms include "reviewing rendered HTML", "interactive components", "design-system patterns", and the rule name "Ensure headings contain text", but natural user phrasings like "empty heading", "heading has no text", "a11y", or "screen-reader navigation" are missing. This fits anchor 3 (some relevant keywords, missing common variations/synonyms) — better than 2 because the terms are domain-relevant, short of 4-5 because the key synonyms a user would naturally say are absent.

3 / 5

Distinctiveness Conflict Risk

The rule-specific phrase "related to Ensure headings contain text" carves out a clear niche, but the rest ("reviewing rendered HTML, interactive components, or design-system patterns... Check native semantics first, then inspect keyboard behavior, focus flow, accessible names...") is boilerplate that would equally match sibling accessibility-rule skills, creating minor overlap risk with closely related skills — fitting anchor 4 rather than 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.