Content
71%Weight 40%Scale 1-5Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
The content is a well-structured, appropriately split skill: the body stays at overview altitude, operational guidance is concrete (inline onerror handler, per-scenario fixes, DevTools verification), and all code examples are correctly pushed one level deep into a real references/rule.md. The main weaknesses are the intro paragraph duplicated almost verbatim in the Explain section and the absence of an explicit re-validate step closing the Check→Fix loop.
Suggestions
Remove the duplicated UX rationale: the intro paragraph and the Explain section say nearly the same thing — keep one, and let the 'why' detail live in references/rule.md's 'Why It Matters' section.
Close the workflow loop with an explicit re-validation step after Fix, e.g., 'Re-run the build-time check / DevTools scan and confirm zero broken images before finishing'.
Add one executable detection snippet to the Check section (e.g., the document.querySelectorAll('img').filter(img => !img.complete) one-liner from rule.md) so the scan step is runnable directly from the body.
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The Check/Fix sections are tight and imperative, but the opening paragraph ("A broken image shows an ugly placeholder icon, breaks visual layouts, and communicates that the site is poorly maintained...") is re-explained nearly verbatim in the Explain section, duplicating UX rationale Claude already knows. This matches the score-3 anchor (mostly efficient with some unnecessary explanation that could be tightened); it is not 2 because the operational sections carry no padding, and not 4 because the intro/Explain duplication is a full redundant section rather than a minor trim. | 3 / 5 |
Actionability | The Fix section gives a copy-paste-ready handler — onerror="this.src='/images/fallback.png'; this.onerror=null;" — plus concrete numbered remedies per scenario (wrong path, missing asset, framework onError callback, self-hosting external images), and Quick Reference names a concrete verification method (DevTools Network tab, blocked requests). This fits the score-4 anchor (mostly executable guidance with minor gaps); not 5 because detection code and the CI check live only in the reference file, so the body alone is not fully self-sufficient for execution. | 4 / 5 |
Workflow Clarity | The body sequences Check (scan and identify broken images with numbered categories) → Fix (numbered remediation) → verify ("Test with DevTools Network tab blocked requests to verify fallback behaviour"), a clear sequence with an explicit validation checkpoint matching the score-4 anchor. Not 5 because there is no explicit re-check loop after fixing (e.g., re-run the scan/build check to confirm zero broken images), which the score-5 anchor's feedback-loop pattern expects. | 4 / 5 |
Progressive Disclosure | The 45-line body is well-organized into Quick Reference / Check / Fix / Explain / Code Review sections and ends with a clearly signaled, one-level-deep pointer — "For full implementation details, code examples, and framework-specific guidance, see references/rule.md" — which resolves to a real file containing the code examples, framework guidance, and verification steps. This matches the score-5 anchor (clear overview with well-signaled one-level-deep references, content appropriately split, easy navigation), and the simple-skill note allows 5 for a short, well-organized single-purpose skill. | 5 / 5 |
Total | 16 / 20 Passed |