Claude Code 团队力推 HTML 替代 Markdown:AI 输出格式正在被重新定义
Anthropic Claude Code 团队成员 Thariq Shihipar 发文力荐用 HTML 替代 Markdown 作为 AI 输出格式,Simon Willison 跟进验证后也公开转向。这一趋势正在改变开发者与 AI 协作的方式——从静态文档到交互式可视化。
2026年5月9日 · 阅读约 5 分钟
核心结论
2026 年 5 月 8-9 日,Anthropic Claude Code 团队成员 Thariq Shihipar 在 X 上发布长文,系统性地论证了 用 HTML 替代 Markdown 作为 AI 输出格式 的优势。Python 生态标杆人物 Simon Willison 随即跟进验证并公开转向。这标志着 AI 协作输出格式正在经历一次重要的范式转换——从"省 token 的纯文本"走向"富交互的可视化输出"。
关键要点
- 事件:Claude Code 团队成员 Thariq Shihipar 发文建议开发者要求 Claude 输出 HTML 而非 Markdown
- 影响人群:所有使用 Claude Code / AI 编码工具的开发者
- 核心理由:HTML 提供交互式 SVG 图表、内联导航、数据可视化等 Markdown 无法实现的能力
- Simon Willison 验证:用 GPT-5.5 制作 HTML 版漏洞分析页面,效果远超 Markdown
- 实用建议:一次性分析/解释用 HTML,需要协作迭代的文档用 Markdown
背景:从 Token 限制到输出自由
在 GPT-4 时代(2023-2024 年),8,192 token 的限制让 Markdown 成为唯一合理的选择。Markdown 比 HTML 更省 token,可以在有限的上下文窗口中传递更多信息。当时如果你让 GPT-4 输出 HTML,可能会浪费一半的上下文窗口在标签上。
但 Claude Code 和 GPT-5.5 等新一代模型拥有 100K-200K 的超大上下文窗口,token 效率不再是瓶颈。这让开发者开始重新审视:既然输出空间充足,为什么不追求更好的呈现效果?
Thariq 提出了一个关键洞察:AI 生成 HTML 的质量出奇地高——模型的训练语料中 HTML 占比极大,它对 HTML 的理解和生成能力远超许多人想象。
HTML vs Markdown:关键差异
| 维度 | Markdown | HTML |
|---|---|---|
| Token 效率 | ✅ 极高 | ❌ 较低(多 3-5 倍) |
| 交互式图表 | ❌ 不支持 | ✅ SVG、图表、动画 |
| 内联导航 | ❌ 无 | ✅ 锚点 + 导航栏 |
| 信息密度/屏 | ❌ 低 | ✅ 极高 |
| 人类可编辑性 | ✅ 极好 | ❌ 较困难 |
| 直接分享 | ❌ 需预览工具 | ✅ 浏览器直接打开 |
| 交互式输入 | ❌ 无 | ✅ 表单、按钮、搜索 |
| AI 训练覆盖 | ✅ 大量 | ✅ 更大量 |
实战:Claude Code 中的 HTML 输出
Thariq 推荐在 Claude Code 中使用这样的 prompt:
Help me review this PR by creating an HTML artifact that describes it. I'm not very familiar with the streaming/backpressure logic so focus on that. Render the actual diff with inline margin annotations, color-code findings by severity and whatever else might be needed to convey the concept well.
效果是 Claude Code 会在终端内直接渲染出一个交互式 HTML 页面,包含:
- 带行内批注的代码 diff
- 按严重程度颜色编码的问题分类
- 可点击的章节导航
- 嵌入式 SVG 流程图
Simon Willison 的实战验证
Simon Willison 用 GPT-5.5 分析 copy.fail 上的 Linux 内核漏洞 PoC,prompt 如下:
Explain this code in detail. Reformat it, expand out any confusing bits and go deep into what it does and how it works. Output HTML, neatly styled and using capabilities of HTML and CSS and JavaScript to make the explanation rich and interactive and as clear as possible.
结果是一个单页 HTML,包含格式化重排后的漏洞代码、逐行注解、交互式图表说明漏洞原理,不需要任何外部依赖,一个文件打开即看。Simon 在博客中写道:
"我自 GPT-4 时代就默认用 Markdown 输出,Thariq 的这篇文章让我重新思考,尤其是输出场景。"
社区讨论
HN 上该话题获得 75+ 点赞和 32 条评论,社区反应两极但总体积极。
支持方认为这是一个被低估的实践。开发者分享:"过去一个月我一直在用 Claude 制作交互式 HTML 交互件——比做幻灯片和静态文档有趣多了。" 另一位开发者说他已经用它来做 PR Review Dashboard、Workshop 互动页面和内部备忘录。
质疑方指出三个关键权衡:
- Token 成本更高:HTML 比 Markdown 多消耗 3-5 倍 token,这对 Anthropic 来说是商业利好
- 人类可编辑性下降:如果需要在 AI 输出基础上手动修改,Markdown 远比 HTML 容易
- 反馈精确性:在 HTML 上标注修改请求比 Markdown 困难得多
实操建议:如何开始
对于 Claude Code 用户,立即可以尝试:
- 下次要求 Claude 解释代码时,在 prompt 末尾加上 "Output as HTML"
- 用浏览器直接打开生成的 HTML 文件(无需服务器)
- 探索更多用法:PR Review、设计文档、数据分析报告、交互式教程
对于其他 AI 工具用户,GPT-5.5、Gemini 等模型同样擅长生成 HTML,原理相同。
工具词条
Claude、Claude Code、OpenAI、ChatGPT、GPT-5.5、Anthropic、Hermes Agent
内链引导
- 想深入掌握 Claude Code?看教程:如何用 Claude Code 实现自动化内容生产
- 有人用 Claude Code 赚到钱了:Claude Code 48小时创业:一人+29美元月费,3个月做到月入$9,000
- 搭配 n8n 搭建完整自动化流水线:数据分析师用 Claude Code + n8n 搭建自动化报表 SaaS,月入 $3,800