960万人围观！Claude Code工程师谈HTML“复兴”：Agent时代，Markdown不够用了

智东西作者 江宇编辑 漠影

Agent越来越能干，但它写出的长文档，人类还看得完吗？

(资料图片仅供参考)

智东西5月11日报道，近日，Claude Code工程师Thariq Shihipar发布长文《Using Claude Code: The Unreasonable Effectiveness of HTML》（《在Claude Code工作流中，HTML为何“不讲道理地好用”》），给出了一个答案：相比Markdown，HTML正在成为他更常使用的Agent输出格式。

截至目前，这篇文章在X上的浏览量已超过950万，近3000人收藏。从Markdown转向HTML，这种看似简单的变化，究竟能给AI Agent工作流带来什么不同？

在这篇文章中，Thariq Shihipar分享了几项核心观点。

1、Markdown虽然简单、便携，但当Agent开始生成长规格文档、复杂计划和研究报告时，Markdown的阅读体验和信息承载能力正在变弱。

2、HTML能承载表格、CSS设计、SVG图示、交互组件、图片、代码片段和空间布局，信息密度比Markdown更高。

3、HTML不只是“花哨好看”，还可以让Agent输出变成一个可阅读、可分享、可交互的工作界面。

4、在规格规划、代码评审、设计原型、研究报告和临时编辑器等场景中，HTML比Markdown更适合承载复杂信息。

5、HTML的真正价值，是让用户重新进入Agent工作流。

Thariq Shihipar也承认，HTML生成速度更慢，版本控制更麻烦，但他认为，只要结果更容易被读完、理解和使用，这些代价就是值得的。

以下是这篇文章的核心内容。

一、Agent越会写，Markdown越不够看了

在Thariq Shihipar看来，Markdown过去之所以成为Agent输出的主流格式，是因为它足够简单、便携，也方便人类编辑。Claude已经很擅长在Markdown文件里用ASCII字符画图，把一些结构和流程解释清楚。

但问题在于，Agent正在做越来越复杂的工作。它不再只是回答一个问题、列一个清单，而是开始生成上百行的规格文档、实现计划、研究报告和代码解释。

Thariq Shihipar坦言，自己很难认真读完一份超过100行的Markdown文件，更不用说让组织里的其他同事也读完。

与此同时，他也发现，自己越来越少亲手编辑这些文件。很多Markdown文档只是被用作规格说明、参考资料、头脑风暴结果或汇报材料。即便真的要修改，他通常也会继续提示Claude去改，而不是自己打开文件逐行编辑。

这意味着，Markdown最大的优势之一正在变弱。它原本胜在“人能方便编辑”，但在Agent工作流里，人类越来越多是在审阅、理解和反馈，而不是直接改文档。

于是，Markdown在视觉组织、信息呈现和复杂表达上的短板，就变得越来越明显。

二、HTML的关键优势，在于把复杂信息讲清楚

Thariq Shihipar转向HTML，也并不是因为HTML看起来更花哨，而是因为它能承载更多类型的信息。

Markdown可以写标题、列表、加粗和代码块，但HTML能表达的东西要多得多。它可以用表格展示结构化数据，用CSS呈现设计信息，用SVG画插图，用脚本嵌入代码片段，也可以加入滑块、按钮、标签页等交互元素。对工作流、空间布局、图片、画布和复杂页面结构，HTML也有更强的表达能力。

他甚至认为，只要Claude能读取的信息，几乎都可以被相对高效地表示成HTML。换句话说，HTML给Agent提供了一块更大的表达画布。

在Markdown里，Agent面对复杂信息时常常会变得笨拙。比如用ASCII字符画流程图，或者用Unicode字符近似表达颜色。这些方法不是不能用，但它们更像是在用文本硬凑视觉效果。一旦内容变复杂，读者很快就会失去耐心。

▲Claude Code试图在Markdown中展示颜色

HTML的价值就在这里。它可以把信息拆成更容易阅读的模块，也可以通过图示、颜色、布局和交互降低理解成本。

对Agent来说，这是一种更高效的表达方式；对用户来说，这也是一种更容易看进去的阅读方式。

▲同样的信息，HTML换成了更适合阅读的结构

三、从方案规划到代码评审，HTML可以成为“工作看板”

在实际使用中，Thariq Shihipar最常把HTML用于规格文档、方案规划和探索性工作。

当他开始处理一个问题时，他不再期待Claude Code只生成一份Markdown计划，而是希望它生成一组HTML文件。

比如先让Claude Code探索多个方案方向，再展开其中一个方向，补充界面草图、数据流图和关键代码片段，最后再形成一份实现计划。等方案确认后，他会开启新的Claude Code会话，把这些HTML文件作为上下文交给Agent继续执行。

▲通过HTML生成可交互调节面板后，用户可以调整参数，再将结果复制回Claude Code执行

这套流程的好处是，规划不再是一段段文字，而是变成了更接近“工作看板”的东西。不同方案可以并排比较，关键取舍可以直接标出来，数据流和模块关系也可以用图示呈现。用户能更快理解Agent到底在怎么想、准备怎么做。

▲可将不同实现方案整理成并排对比页面，方便用户查看各方案的取舍并选择后续方向

代码评审也是类似逻辑。Thariq Shihipar认为，代码和diff放在Markdown里并不好读，但HTML可以渲染差异、加入旁注、画出流程图和模块关系，还可以用颜色区分问题严重程度。他提到，自己现在会给每个PR都附上一份HTML代码解释文件。

▲代码评审将代码diff、问题标注和修改建议整合到同一页面中

这其实把Agent输出从“解释给你听”，升级为“整理给你看”。它还把变化、风险、上下文和关键逻辑放在一个更容易审阅的界面里。对复杂PR、陌生模块或多人协作来说，这种呈现方式明显比一长段Markdown说明更清晰、易懂。

四、HTML还能变成一次性的临时工具

更具启发性的是，Thariq Shihipar不只把HTML当成文档，也把它当成临时编辑器。

他说，有些需求很难只靠文本框描述清楚。比如重新排列30个Linear工单、调整功能开关配置、调试系统提示词、筛选数据集、标注文档，或者选择颜色、缓动曲线、裁剪区域、Cron表达式和正则规则。这些任务如果只用文字来回描述，效率很低，也容易说不清楚。

他的做法是，让Claude Code直接生成一个“用完即扔”的HTML编辑器。这个编辑器不是正式产品，也不需要长期维护，只服务于当前这一件事。

▲设计方向的临时编辑器，包含颜色、字体、按钮和间距规范等

再比如，他可以让Claude把30个Linear工单做成可拖拽卡片，分成Now、Next、Later、Cut几栏，并加入“复制为Markdown”的按钮。

他也可以让Claude针对一份feature flag配置生成表单式编辑器，展示不同开关之间的依赖关系，并提醒某个前置开关是否未开启。

同样，他还可以让Claude做一个提示词调试界面，左侧编辑prompt，右侧实时预览不同输入下的填充结果，并提供token计数和复制按钮。

▲提示词调试的临时编辑器

这类HTML文件的关键不是“编辑”，而是“导出”。用户在界面里完成调整后，可以一键复制成JSON、Markdown、diff或prompt，再粘贴回Claude Code继续执行。这样一来，HTML就不只是Agent给人看的结果，也变成了人向Agent反馈结构化信息的中间层。

▲提示词临时编辑器，直接导出Prompt

五、让人重新跟上Agent的工作过程

Thariq Shihipar在文章结尾提到，自己使用HTML最核心的原因，是它让他在Claude工作流中更有参与感。

随着Agent能力增强，用户可能越来越少认真阅读Agent生成的计划，只是把任务交给它执行。表面上看，这提高了效率；但另一面是，人可能逐渐脱离Agent的决策过程。Agent为什么这样做、哪里需要判断、方案之间有什么取舍，都容易被藏在一大段没人愿意读完的文本里。

HTML在一定程度上解决了这个问题。它让计划、报告、代码解释和设计探索更容易阅读，也让用户可以通过滑块、按钮、拖拽、表单等方式参与调整。相比一份长Markdown，HTML更像一个可操作的协作界面。

当然，HTML也有明显代价。Thariq Shihipar承认，HTML生成时间通常比Markdown长，可能需要2到4倍时间；HTML的版本控制也更麻烦，diff往往嘈杂，不如Markdown容易审阅。

不过在他看来，只要最终产物更容易被真正读完、理解和使用，这些成本就是值得的。

标签： 编辑器 工作流 工程师 html 显式标识 a