CtrlK
BlogDocsLog inGet started
Tessl Logo

error-images

Use when reviewing image assets, markup, and CDN or build transforms related to Handle image loading errors gracefully. Check encoded size, rendered size, loading strategy, and above-the-fold impact together.

56

Quality

65%

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/error-images/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

71%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, concise overview that appropriately defers executable code to a real references/rule.md file, but the in-body guidance stays high-level and lacks concrete code or an explicit validate-fix-retry loop.

Suggestions

Inline one minimal executable example (e.g. the onerror fallback snippet) in the body so the skill is actionable before opening the reference.

Replace the generic Check/Fix/Explain placeholders with a concrete step sequence including a DevTools verification step.

Add an explicit validation checkpoint (open DevTools → confirm no broken-image icon → confirm fallback src applied) to lift workflow clarity.

DimensionReasoningScore

Conciseness

The body is lean with short sections and a tight bullet list; only the opening explanatory sentence and the thin, somewhat redundant Check/Fix/Explain sections could be trimmed, matching 'efficient; minor instances of over-explanation'.

4 / 5

Actionability

Quick Reference gives concrete hints ('Use onerror to replace broken images with fallbacks') but the body itself contains no executable code, and the Fix/Check sections stay high-level, so guidance is concrete but incomplete with key details deferred to the reference.

3 / 5

Workflow Clarity

As a simple single-purpose skill it has an unambiguous core action and a loose Check→Fix→Explain→Code Review structure with a soft validation cue ('describe how to confirm the fix in DevTools'), placing it just below the explicit-checkpoint anchor at 5.

4 / 5

Progressive Disclosure

The body is a concise overview with a single clearly signaled one-level-deep reference ('see references/rule.md') that exists and holds the executable code and framework examples, matching the 'clear overview with well-signaled one-level-deep references' anchor.

5 / 5

Total

16

/

20

Passed

Description

60%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 is concise and contains an explicit 'Use when' trigger plus several concrete actions, but it describes a broad image-review scope that mismatches the skill's actual error-handling purpose and omits the natural error-image trigger terms.

Suggestions

Rewrite the description around the skill's actual purpose — e.g. 'Add onerror fallbacks and placeholder states so broken images fail gracefully. Use when images may fail to load, when fixing broken-image icons, or when reviewing onerror/fallback handling.'

Add the natural trigger terms users would say ('broken images', 'image errors', 'fallback', 'onerror', 'placeholder') instead of generic image-optimization keywords.

Narrow the scope so the description does not compete with general image-optimization or performance skills.

DimensionReasoningScore

Specificity

Lists several concrete review actions — 'reviewing image assets, markup, and CDN or build transforms' and 'Check encoded size, rendered size, loading strategy, and above-the-fold impact together' — with only minor coverage gaps, fitting the 'several specific actions' anchor rather than the comprehensive 5.

4 / 5

Completeness

It has an explicit 'Use when reviewing...' trigger clause plus a stated 'what' (review/check the listed image attributes), satisfying both what and when, though the 'when' largely restates the 'what' and could be more specific to error handling.

4 / 5

Trigger Term Quality

It has relevant image-review keywords ('image assets', 'markup', 'CDN or build transforms', 'above-the-fold impact') but omits the natural terms users would say for this skill specifically ('broken images', 'image errors', 'fallback', 'onerror'), so it matches 'some relevant keywords but missing common variations'.

3 / 5

Distinctiveness Conflict Risk

The described triggers (encoded size, loading strategy, above-the-fold impact, CDN transforms) describe general image optimization rather than error handling, creating high overlap with any image-review skill and risking firing for the wrong skill.

2 / 5

Total

13

/

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.

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.