CtrlK
BlogDocsLog inGet started
Tessl Logo

viewport

Use when reviewing templates, rendered HTML, or shared components related to Set the responsive viewport meta tag. Validate the final browser-facing markup, not just the source framework abstraction.

63

Quality

75%

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

Quality

Content

77%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, simple skill with a clear workflow and clean one-level-deep progressive disclosure to a real reference file. Its main weakness is mild verbosity in the explanatory and directive sections that assume too little of Claude.

Suggestions

Trim the intro sentence and the redundant 'controls how the page is displayed on mobile devices' phrasing in the Check section; Claude already knows what the viewport tag does.

Replace the abstract 'Code Review' instruction with a concrete example (e.g. a rendered <meta> snippet to flag and the corrected output) so the guidance is copy-paste ready.

Drop or tighten the 'Explain' section's directive ('Explain how the viewport meta tag enables responsive design...') since it restates common knowledge rather than adding skill-specific value.

DimensionReasoningScore

Conciseness

Mostly efficient with a tight Quick Reference and an exact Fix tag, but it includes unnecessary explanation Claude already knows (the intro sentence on mobile shrinking) and padded directive sections ('controls how the page is displayed on mobile devices', 'Explain how...'); could be tightened, so it does not reach 4.

3 / 5

Actionability

The Fix and Quick Reference give the exact copy-paste-ready viewport tag plus concrete anti-patterns (maximum-scale=1, user-scalable=no), but the 'Code Review' guidance ('Flag exact elements, attributes, and routes') stays abstract with no concrete example, leaving a minor gap.

4 / 5

Workflow Clarity

This is a simple single-purpose skill (under 50 lines, single unambiguous action, no destructive or batch operation), and its Check→Fix→Explain→Code Review sections are clearly sequenced and well-organized, meeting the simple-skill exception for a top score.

5 / 5

Progressive Disclosure

The SKILL.md body is a concise overview that points with a clear one-level-deep reference ('see references/rule.md') to the verified bundle file for full details, with easy navigation and appropriate content split.

5 / 5

Total

17

/

20

Passed

Description

73%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 specific, well-triggered, and distinct, cleanly answering both what the skill does and when to use it. It is held back only by slightly limited action coverage and a slightly awkward connective phrase.

DimensionReasoningScore

Specificity

Names the domain (viewport meta tag, templates, rendered HTML, shared components) and two concrete actions ('reviewing' and 'Validate the final browser-facing markup'), matching the 1-2 concrete actions anchor; not 4 because coverage is limited to those two actions.

3 / 5

Completeness

Explicitly answers both 'when' ('Use when reviewing templates, rendered HTML, or shared components...') and 'what' ('Validate the final browser-facing markup'); sits above the midpoint but the single-action 'what' and slightly awkward 'related to Set the responsive viewport meta tag' phrasing keep it from a clean 5.

4 / 5

Trigger Term Quality

Includes natural frontend terms a user would say ('templates', 'rendered HTML', 'shared components', 'viewport meta tag', 'browser-facing markup'), giving good coverage; a few natural synonyms (e.g. 'mobile-friendly', 'responsive layout') are missing so it does not reach 5.

4 / 5

Distinctiveness Conflict Risk

A clear, narrow niche (the viewport meta tag) with a distinctive framing ('final browser-facing markup, not just the source framework abstraction') that minimizes overlap with other skills.

5 / 5

Total

16

/

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.