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.

Quality

92%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Passed

No findings from the security scan

Quality

Content

85%

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

A well-structured, concise design-direction skill with a clear sequenced workflow, explicit verification checkpoints, and excellent progressive disclosure via real one-level-deep reference files. Its main gap is the absence of any concrete code examples or starter skeleton for an HTML-artifact-producing skill.

Suggestions

Add a minimal self-contained HTML starter skeleton (inline <style>/<script>, semantic structure) so the "Build contract" directives have a copy-paste-ready starting point rather than only requirements.

Include a concrete CSS-token example (e.g., a small :root token block) to illustrate "Define a small set of CSS tokens... use them consistently" with an executable pattern.

Show a reduced-motion media query and visible-keyboard-focus snippet, since accessibility is a stated requirement but currently lacks any accompanying code illustration.

Dimension	Reasoning	Score
Conciseness	The body is lean and assumes Claude's competence — it never explains basic concepts (HTML/CSS/JS) and every section (routing, build contract, finish) is purposeful, with no token-padding.	3 / 3
Actionability	Concrete, specific directives on file structure, accessibility, tokens, and verification, but no executable code examples, starter skeleton, or copy-paste snippets to ground an artifact-producing skill — which the score-3 anchor requires.	2 / 3
Workflow Clarity	Clear sequenced workflow (route → read the room → load guidance → build → finish) with an explicit validation checkpoint (browser inspection of wide/narrow viewports, console check) and a fix-and-originality checklist before delivery.	3 / 3
Progressive Disclosure	A concise overview that clearly signals one-level-deep references (creative-direction, documents-and-presentations, interfaces, diagrams, charts-and-data) — all verified to exist as real files — with explicit per-form routing guidance.	3 / 3
	Total	11 / 12 Passed

Description

100%

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

A strong, third-person description that concretely states what the skill does and when to use it, with rich natural trigger terms and explicit routing/exclusion logic that makes it highly distinctive from sibling skills.

Dimension	Reasoning	Score
Specificity	Lists multiple concrete actions ("Create or redesign self-contained single-file HTML artifacts", "Route clear wireframe, prototype, mockup, plan, or diagram requests to the matching direct-invocation specialist") rather than vague language.	3 / 3
Completeness	Clearly answers both what ("Create or redesign self-contained single-file HTML artifacts...") and when ("Use when HTML is the deliverable for a report, explainer, landing page...") with explicit triggers.	3 / 3
Trigger Term Quality	Covers natural terms users would actually say — "report, explainer, landing page, presentation, tool", "wireframe, prototype, mockup, plan, or diagram", "HTML", "HTML file" — in an explicit "Use when" clause.	3 / 3
Distinctiveness Conflict Risk	Explicitly distinguishes itself as "the collection's only implicit router", routes specialist sub-types to siblings, and excludes "ordinary application implementation when a standalone HTML file is not the deliverable" — clear niche, low conflict risk.	3 / 3
	Total	12 / 12 Passed

Validation

93%

Warnings & errors only

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

Criteria	Description	Result
relative_links	Relative link issues: 4 suspicious	Warning

	Total	15 / 16 Passed

Repository: plannotator/effective-html
Path: skills/html/SKILL.md
Commit: 4a9a1e5

Reviewed: 3 days ago

Table of Contents

Discovery Implementation Validation

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.