前言¶

交付物是 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