前言¶

交付物是 HTML 的时候，最难的不是写标签，而是定视觉方向：报告、解释器、落地页、演示、工具，每一种的版式、节奏、信息密度都不一样。从零搭一套方向成本高，套现成模板又和 brief、项目、主题对不上。

下面介绍的 HTML Skill 定位就是这件事：接收用户的 brief、项目和主题，生成或改造一个自包含的单文件 HTML 产物，并让视觉方向由这三者共同塑造。

这是什么¶

一句话定位：按 brief 创建或重新设计自包含单文件 HTML 产物的 Skill，视觉方向随用户的 brief、项目、主题而定。

• 名称：HTML
• 坐标：@org-eyw2ohcx/plannotator-effective-html-html
• 版本：1.0.0
• 发布者：RealQ
• 来源：enterprise
• 分类：design-media
• 标签：requires_api_key=false
• SkillHub 页面数据（抓取时）：评分 100000，下载 821，安装 0

官方地址见文末。

核心能力¶

以下均来自官方简介。

1. 创建或重新设计自包含（self-contained）的单文件 HTML 产物。单文件意味着不依赖外部资源即可打开和分发。
2. 视觉方向由用户的 brief、项目和主题共同塑造，而不是固定模板。
3. 触发条件：当 HTML 是交付物时使用，覆盖 report、explainer、landing page、presentation、tool、mixed artifact、broad request。
4. 这是该 collection 里唯一的隐式路由器（implicit router）：遇到明确的 wireframe、prototype、mockup、plan、diagram 请求，会路由到对应的 direct-invocation specialist（若可用）。
5. 明确不用于普通应用实现（官方简介原文：Do not use for ordinary application implementation when a stand…，后文被截断）。

安装与启用¶

该 Skill 以通用 SKILL.md 格式分发，坐标 @org-eyw2ohcx/plannotator-effective-html-html，标签 requires_api_key=false（无需 API key）。

需要说明的是：本次未能从官方页面抓取到具体的安装命令，也未能核实 Cursor / Codex CLI / Claude Code 在安装方式上的差异。在核实到确切命令前，建议以官方地址为准，不要照搬第三方命令。

典型用法¶

据官方简介，用法不是固定命令，而是触发与路由行为。

当交付物是 HTML 时，把产物类型作为请求的一部分：

report / explainer / landing page / presentation / tool / mixed artifact / broad request

遇到明确的设计图类请求，Skill 会路由到 specialist：

wireframe  -> 对应 direct-invocation specialist（若可用）
prototype  -> 对应 direct-invocation specialist（若可用）
mockup     -> 对应 direct-invocation specialist（若可用）
plan       -> 对应 direct-invocation specialist（若可用）
diagram    -> 对应 direct-invocation specialist（若可用）

普通应用实现不在此 Skill 范围内。

适用场景与注意¶

适合：

• 交付物明确是 HTML，且需要视觉方向随 brief 变化的报告、解释器、落地页、演示、工具、混合产物。
• 想用一个入口处理宽泛的 HTML 请求，再由路由机制分派到 specialist。

注意：

• 明确的 wireframe / prototype / mockup / plan / diagram 请求会被路由走，不是直接在这个 Skill 里完成。
• 普通应用实现不适用。
• 单文件产物意味着要自带样式与资源，外部依赖需自行内联或说明。
• 评分与下载数据为抓取时页面值，可能随时间变化。

结尾¶

HTML Skill 的价值在于把”定视觉方向 + 产出单文件 HTML”这一步收敛到一个入口，方向随 brief 走，设计图类请求自动分派。适合交付物就是 HTML、又不想套固定模板的场景。

官方地址：https://api.skillhub.cn/org-eyw2ohcx/plannotator-effective-html-html

SkillHub 页面：https://www.skillhub.cn/skills/org-eyw2ohcx/plannotator-effective-html-html