CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

accessible-notifications

Use when reviewing templates, rendered HTML, or shared components related to Make notifications accessible. Validate the final browser-facing markup, not just the source framework abstraction.

55

Quality

69%

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/accessible-notifications/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 well-structured with an excellent progressive-disclosure split to references/rule.md, and the Check/Fix/Explain/Code Review flow is coherent for a simple review skill. Its weaknesses are redundancy (motivational prose and polite/assertive explanations Claude already knows, repeated across sections) and incomplete actionability — vague persistence criteria and no example markup at the top level.

Suggestions

Cut the opening motivation paragraph ('Without proper ARIA attributes, screen reader users miss...') — Claude already knows why ARIA matters, and the 'Why It Matters' detail lives in references/rule.md anyway.

De-duplicate the aria-live/role/persistence guidance repeated across Quick Reference, Check, and Fix, and inline one small before/after HTML snippet so the fix is executable without opening the reference.

Define 'adequate display time'/'persist long enough to be read' with a concrete acceptance criterion, and add a re-check step after Fix to close the workflow's validation gap.

DimensionReasoningScore

Conciseness

The motivational opening ('Without proper ARIA attributes, screen reader users miss critical notifications...') and the Quick Reference bullet explaining what 'polite'/'assertive' mean restate knowledge Claude already has, and the aria-live/role/persistence guidance is repeated across Quick Reference, Check, and Fix. This fits 'mostly efficient but includes some unnecessary explanation or could be tightened'; not a 2 because the body is short and not heavily padded, not a 4 because the cross-section redundancy exceeds minor over-explanation.

3 / 5

Actionability

Concrete attribute names are given ("role='alert' or role='status'", "aria-live='polite' or 'assertive'") — more than high-level hints — but key details are missing: no example markup in SKILL.md, no guidance on when alert vs status applies, and 'adequate display time'/'persist long enough to be read' offer no threshold or verification method. This matches 'some concrete guidance but incomplete; missing key details'; a 4 would need executable-level guidance with only minor gaps.

3 / 5

Workflow Clarity

The Check → Fix → Explain → Code Review sections form a clear, coherent sequence for this simple review task, with the review target (templates, rendered HTML, shared components) explicitly stated — fitting 'clear sequence with most checkpoints present; minor validation gaps'. Not a 5 because there is no re-validation step after Fix and 'adequate display time' leaves the acceptance criterion ambiguous; not a 3 because the sequence is unambiguous for a single-purpose skill.

4 / 5

Progressive Disclosure

A short, well-sectioned body with a clearly signaled, one-level-deep pointer ('For full implementation details, code examples, and framework-specific guidance, see references/rule.md') to a real file that contains substantive implementation detail (code examples, attribute tables) with no nested pointers. The split is clean: overview in SKILL.md, detail in the reference — matching 'clear overview with well-signaled one-level-deep references; content appropriately split'.

5 / 5

Total

15

/

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 correctly uses the 'Use when...' pattern and names both the review targets and the validate-the-rendered-markup intent, but its action coverage is thin and it omits the natural trigger vocabulary (ARIA, aria-live, screen reader, accessibility) users would actually say. The embedded rule-name phrasing 'related to Make notifications accessible' reads awkwardly and weakens trigger explicitness.

Suggestions

State the concrete checks in the description, e.g. 'Validate aria-live regions, role="alert"/"status", and notification persistence in the final browser-facing markup' — this lifts specificity and the 'what' half of completeness.

Add natural trigger synonyms users would say: 'ARIA live regions', 'screen reader announcements', 'accessible toasts/alerts', 'accessibility review'.

Rewrite the awkward 'related to Make notifications accessible' clause into fluent trigger phrasing such as 'related to accessible notifications (ARIA alerts, toasts, status messages)'.

DimensionReasoningScore

Specificity

The description names the domain ("templates, rendered HTML, or shared components") and two concrete actions ("reviewing", "Validate the final browser-facing markup"), but coverage is not comprehensive — it never states what validation involves (aria-live regions, roles, persistence). This matches the 'names domain and 1-2 concrete actions, but not comprehensive' anchor; a 4 would require several specific actions with only minor gaps.

3 / 5

Completeness

Both parts are explicit: 'what' ("Validate the final browser-facing markup, not just the source framework abstraction") and 'when' ("Use when reviewing templates, rendered HTML, or shared components related to Make notifications accessible"), so the 'Use when...' requirement is satisfied. Not a 5 because the 'what' is a single validation action without concrete checks, and the awkward phrasing 'related to Make notifications accessible' slightly muddies the trigger's explicitness.

4 / 5

Trigger Term Quality

Relevant keywords are present ("templates", "rendered HTML", "shared components", "notifications"), but common natural phrasings users would actually say are missing: "accessibility", "ARIA", "aria-live", "screen reader", "toasts". This fits 'some relevant keywords but missing common variations or synonyms'; a 4 would need good coverage with only a few natural terms absent.

3 / 5

Distinctiveness Conflict Risk

Clear niche (accessible notifications in browser-facing markup) with a distinct trigger term ("notifications"), fitting 'mostly distinct; minor overlap risk'. Not a 5 because sibling frontend-checklist rule skills would share the identical boilerplate 'Use when reviewing templates, rendered HTML, or shared components...' trigger, leaving overlap with closely related skills slightly above minimal; not a 3 because the rule-specific differentiator does distinguish it.

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

Path

skills/accessible-notifications/SKILL.md

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.