CtrlK
BlogDocsLog inGet started
Tessl Logo

html

Create or redesign self-contained single-file HTML artifacts with a visual direction shaped by the user's brief, project, and subject. Use when HTML is the deliverable for a report, explainer, landing page, presentation, tool, mixed artifact, or broad request. This is the collection's only implicit router. Route clear wireframe, prototype, mockup, plan, or diagram requests to the matching direct-invocation specialist when available. Do not use for ordinary application implementation when a standalone HTML file is not the deliverable.

68

Quality

83%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

Low

Low-risk findings worth noting

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 well-structured orchestration and build-contract skill: lean, actionable, and cleanly split across one-level-deep references with explicit validation on the way out. The weakest spots are the lack of a concrete HTML scaffold example and an explicit re-validate feedback loop in the finish step.

Suggestions

Add a minimal copy-paste HTML scaffold (inline CSS/JS, token block, reduced-motion media query) under the Build contract so the common case is executable without inventing structure.

Make the Finish section an explicit validate-fix-revalidate loop: after fixing clipping/overflow/console errors, re-open the artifact and re-check before delivery.

Tighten the editorial phrasing in the opening and the originality-check paragraph to remove the few non-actionable sentences.

DimensionReasoningScore

Conciseness

The ~75-line body is lean and assumes Claude's competence without explaining basic concepts, but a few editorial phrases ('The standard is consistent care, not a consistent look') and the originality-check paragraph could be trimmed.

4 / 5

Actionability

Concrete, specific guidance throughout (a build contract specifying inline CSS/JS, semantic HTML, contrast, reduced-motion; plus verification actions like inspecting viewports and checking the console), but no copy-paste HTML scaffold example for the common case.

4 / 5

Workflow Clarity

A clear five-stage sequence (Route -> Read the room -> Load guidance -> Build -> Finish) with explicit validation in the finish step (inspect wide/narrow viewports, check console, fix issues), though it lacks an explicit re-validate-after-fix loop or a tight checklist.

4 / 5

Progressive Disclosure

A clear overview with a 'Load only the guidance the artifact needs' section pointing to five well-signaled, one-level-deep reference files (all present on disk) plus sibling-skill routing, matching the anchor for clean progressive disclosure.

5 / 5

Total

17

/

20

Passed

Description

87%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 strong across the board: it states a clear niche, gives explicit trigger guidance with a 'Use when' clause, and adds negative boundary language to avoid misrouting. Minor gaps are the absence of file-extension terms and the build-level actions being deferred to the body.

DimensionReasoningScore

Specificity

Names the domain ('self-contained single-file HTML artifacts') and several concrete actions ('Create or redesign', 'Route ... wireframe, prototype, mockup, plan, or diagram'), though the actual build actions live in the body rather than the description.

4 / 5

Completeness

Explicitly answers both what ('Create or redesign self-contained single-file HTML artifacts...') and when ('Use when HTML is the deliverable for...') with concrete trigger phrases plus a 'Do not use for...' boundary.

5 / 5

Trigger Term Quality

Strong natural-term coverage with synonyms ('report, explainer, landing page, presentation, tool' and 'wireframe, prototype, mockup, plan, diagram'), but no file-extension phrasing like '.html' or 'single HTML file'.

4 / 5

Distinctiveness Conflict Risk

Self-declared 'collection's only implicit router' with explicit routing to sibling specialists and a negative boundary clause, giving it a clear niche with minimal conflict risk.

5 / 5

Total

18

/

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

relative_links

Relative link issues: 6 suspicious

Warning

Total

15

/

16

Passed

Repository
plannotator/effective-html
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.