web-design-reviewer

This skill enables visual inspection of websites running locally or remotely to identify and fix design issues. Triggers on requests like "review website design", "check the UI", "fix the layout", "find design problems". Detects issues with responsive design, accessibility, visual consistency, and layout breakage, then performs fixes at the source code level.

Quality

69%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Low

Low-risk findings worth noting

Fix and improve this skill with Tessl

tessl review fix ./skills/web-design-reviewer/SKILL.md

The canonical home for this skill is web-design-reviewer in github/awesome-copilot

Quality

Content

47%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.

A thorough, well-sequenced review workflow with a clear validation/iteration loop, but it is markedly verbose and leans on Claude-known definitions rather than executable instruction. Progressive disclosure is uneven: one reference is linked while a second exists unlinked and much reference-grade content stays inline.

Suggestions

Trim the layout/responsive/accessibility issue-definition tables and framework detection heuristics to essentials Claude already knows, moving detail to a reference and keeping only the non-obvious severity/priority rules inline.

Add executable fixing examples (e.g., a concrete selector-based grep/replace snippet or a minimal CSS fix) in Step 3 instead of deferring all detail to framework-fixes.md.

Link visual-checklist.md from the visual-inspection section so both bundle files are discoverable, and move the issue-category tables into that checklist.

Dimension	Reasoning	Score
Conciseness	Noticeably verbose at ~370 lines; large formatted tables restate domain knowledge Claude already has (layout/responsive/accessibility issue definitions, framework detection heuristics) rather than instructing, and boilerplate DO/DON'T and best-practice sections pad the skill.	2 / 5
Actionability	Some concrete guidance (file-pattern globs, viewport widths, Playwright MCP tool names, MCP config JSON) but the core fixing steps defer to a reference and lack executable code; much guidance is tabular description rather than copy-paste commands.	3 / 5
Workflow Clarity	A clear four-step sequence with a feedback loop (re-verify, iterate until issues cleared, 3-attempt consult-user checkpoint) and mermaid diagrams; minor gaps are that validation is 'compare before/after' rather than a concrete automated check.	4 / 5
Progressive Disclosure	Two real reference files exist, but only framework-fixes.md is linked from the body while visual-checklist.md is unlinked, and a large amount of issue-category and capability table content that could live in references is inlined in SKILL.md rather than well-signaled one-level-deep.	3 / 5
	Total	12 / 20 Passed

Description

91%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.

A strong, well-structured description that clearly states both what the skill does and when to use it, with natural trigger phrases. Minor specificity gap (no mention of the iteration/re-verification loop or specific tooling) keeps it from being a perfect example.

Dimension	Reasoning	Score
Specificity	Lists several concrete actions (visual inspection, identify and fix design issues, detect responsive/accessibility/consistency/layout problems, perform source-code fixes) with only minor gaps; not quite the comprehensive multi-action level of a 5.	4 / 5
Completeness	Explicitly answers both what (enables visual inspection to identify and fix design issues at source level) and when (explicit 'Triggers on requests like...' clause with concrete trigger phrases).	5 / 5
Trigger Term Quality	Provides multiple natural phrases users would actually say ('review website design', 'check the UI', 'fix the layout', 'find design problems'), covering synonyms and common phrasings.	5 / 5
Distinctiveness Conflict Risk	Targets a clear niche (visual website design review + source-level fixes) with distinct triggers, minimal overlap risk with unrelated skills.	5 / 5
	Total	19 / 20 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
frontmatter_unknown_keys	Unknown frontmatter key(s) found; consider removing or moving to metadata	Warning

	Total	15 / 16 Passed

Repository: Galaxy-Dawn/claude-scholar
Path: skills/web-design-reviewer/SKILL.md
Commit: 6ed46da

Reviewed: 8 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.