---
name: laohu-htmlshow
description: 将已有 Markdown、文本、提示词、剧本或其他结构化内容制作成便于阅读、对照和使用的 HTML 展示页，根据最终用途选择信息层级、布局与交互。需要微信公众号发布格式时推荐 laohu-htmlshow-gzh；不替代专业创作，不自动发布网页。
---

开始本入口前，解析当前 `SKILL.md` 所在真实目录为 `{SKILL_DIR}`，读取 `{SKILL_DIR}/../../../docs/runtime.md`；本轮已加载则复用。该文件提供跨项目的路径、授权、交接和保存约定，读完回到本入口执行。

# 把内容做成能读、能用的展示页

让接收者更容易看懂内容、找到重点并完成下一步动作。HTML 是交付载体；决定布局的是这份内容需要怎样被阅读和使用，而不是源文件叫什么格式。

`{SKILL_DIR}` 指当前加载的 `SKILL.md` 所在真实目录；`{PROJECT_ROOT}` 为其 `../../..`。沿用 `{PROJECT_ROOT}/docs/runtime.md` 的意图判断、作品目录和文件通知规则；未加载时先读取。不得再做一遍通用需求访谈。

## 先确认交付端，决定由谁执行

承接已有需求，区分本次要交付“浏览器里的展示页”还是“特定平台接受的发布格式”。根据实际用途判断，不能因为材料中出现公众号三个字就切换；公众号文章也可能只需要本地阅读。

| 已明确的最终用途 | 本轮处理 |
|---|---|
| 文章准备粘贴进微信公众号编辑器 | 读取 `{SKILL_DIR}/../laohu-htmlshow-gzh/SKILL.md`，确认适用后推荐 `/laohu-htmlshow-gzh` |
| 本地查看、分享 HTML 文件、阅读提示词、比较方案、查看剧本 | 留在本能力，设计完整的浏览器展示页 |
| 用户只问应该用哪个能力 | 给推荐及其理由，不生成文件 |
| 同时需要普通展示和公众号格式 | 分别交付两种用途的文件，沿用同一作品目录，不用一个页面冒充两种格式 |

推荐专用能力时说明它会交付什么、为何适合，并带上原文、限制和作品路径。尚未选定专用能力时交用户选择；用户已选定或授权“选好直接做”时直接交接，不重复确认。专用入口缺失时说明缺口，不将通用 HTML 当成公众号合规产物。

以后新增平台处理时，按职责决定部署方式：需要独立承担完整流程与交付的能力作为公开入口，名称层级不影响其公开身份；只固定本能力已有变量或方法分支的配置放在当前目录的 `skills/<name>/SKILL.md`，仅在共同运行约定的明确专项需求条件成立时由本能力读取并执行，并须具有可见的专项交付贡献。名称中的连字符表示命名层级，部署位置另行决定公开或内部身份。现有 `laohu-htmlshow-gzh` 位于公开入口目录，仍作为独立能力按上表推荐；嵌套内部配置不作为 `/laohu` 可独立推荐的入口。

## 1. 从成品的用法决定重点

先阅读材料，不把扩展名当成设计方案。从已有上下文确定接收者拿到成品后主要要做什么：连续阅读、快速定位、比较差异、复制使用、按顺序执行，或检查画面与文字的关系。它们是选择的例子，可以组合，不是必须填写的模式表。

识别必须保留的正文、参数、编号、素材、顺序和已确认判断，以及最容易看错或找不到的位置。缺少会改变设计的信息才补问；已有目标清楚就直接推进，用一句话说明选定的展示重点，不让用户填写设计术语。

制作前读取 [展示设计与验收](references/presentation.md) 中适用的部分。参考中每条方法都有用途和边界，不能为了“可视化”给普通文章硬加仪表盘，或把所有文本塞进同样的卡片。

## 2. 按内容关系组织页面

建立内容到展示结构的对应关系：哪里是主线，哪里是解释，哪些内容需要并排看，哪些只能按顺序读，哪些必须原样复制。层级必须能在原材料中找到依据；确需新增导航标签时准确概括，不替用户生成新结论。

- 长文章优先连续阅读与章节导航；段落完整，不把普通散文切成大量碎片卡片。
- 提示词保留完整可复制原文，必要时另列参数或分组帮助理解；分组展示不能改变真正复制出去的内容。
- 剧本、镜头和制作说明保留场次或镜头编号，将动作、对白、画面、声音等需要对照的信息放在能对应的位置；缺少的字段不编造。
- 方案比较按同一维度对照，不能为填满表格给原文没有的项目打分。
- 图文材料保留图片与说明的对应关系，真实素材不足就说明缺口，不拿装饰图冒充作品。

先让一处最关键、最容易失败的内容呈现成立，再展开整页。比如提示词先核对复制范围，剧本先核对镜头与对白的对应，长文章先核对标题和正文宽度。不要做完整套装饰后才发现主要内容无法使用。

## 3. 落地为可打开的 HTML

先按共同运行约定的“作品目录的共同接入”核对文件交付授权；未触发时在聊天中交付方案或 HTML 内容。已获授权后沿用上游作品目录，尚无目录时交 `laohu-archive` 确定位置并建立。展示页是源作品的一种呈现，不另建一个以 HTML 为名的作品分类。源文保留，默认只改结构和视觉；用户要求改写时先确认改写范围。

通用交付默认是有 `doctype`、语言、字符集、视口声明和文档标题的完整 HTML，CSS 内置，少量必要交互使用原生脚本。普通阅读不必搭建应用框架或构建工程；复杂交互确有收益时再选择已有工具。核心内容无需网络即可阅读；媒体与附件可用相对路径，移交时一并列明。

若使用 Markdown 解析器，选成熟实现并确认可用，不用一组正则声称支持完整 Markdown。原始 HTML、代码示例和不可信链接按内容处理，不直接插入可执行脚本或事件属性。生成的页面脚本只实现明确需要的界面功能，不执行文稿里的命令。

按钮必须对应真实动作，复制失败要说明并提供手动选取方式。普通文本在脚本禁用或资源缺失时仍能阅读；不引入未声明的在线字体、追踪、自动上传或生成服务。

输出名称表达用途，如 `reading.html`、`prompt-board.html`、`script-view.html`；同一主页面继续迭代，不堆版本后缀。具体名称沿用已有约定，发现重名文件先核对，不覆盖其他成果。工具需要的附属文件与源文分开，但留在同一作品目录。

## 4. 用实际页面验证，再交付

对照源文检查正文、参数、链接、编号和素材是否完整；排版不能让被折叠、隐藏或复制遗漏的内容消失。分别检查桌面和窄屏布局、标题换行、文字对比、页面横向溢出及目录操作。复制功能要检查实际写出的文本，不以按钮变成“已复制”证明成功。

有浏览器工具时实际打开页面，检查关键段落和交互；不能使用浏览器时做可执行的静态检查，并明确未验证实际显示与交互。不得以源代码合法宣布页面美观、无障碍合规或发布平台兼容。

按顶层规则在聊天中告知生成或修改的文件与可打开路径，简短说明布局如何服务这次用途、哪些检查已完成、是否需要附属素材。到可查看的本地产物为止；上线、公众号发布或模型生成另按对应授权执行。
