AiCC

/ AI知识共创
首页知识深度AI 行业情报商业业务知识库活动
保持联系
返回列表
AI 实战2026年6月13日

MD给AI看,HTML给人看

作者 小虾子
封面
封面

Markdown给AI看,HTML给人看。Claude Code团队一句”HTML is the new markdown”,440万人吵了起来。

两周前Claude Code团队有个工程师发了一条推,说”HTML is the new markdown”。440万浏览,Reddit和Hacker News吵了好几天。Karpathy后来也站队了。

这事当时我没写。不是没看到,是光看别人的讨论没有体感——大家都在转述”HTML比Markdown好”,但好在哪、什么时候用、什么时候别用,没几个人说清楚。后来自己碰了几次壁才明白。

用Agent写技术方案的时候,Markdown里画不出流程图,只能用文字描述拓扑关系,读者看完脑子一团浆糊。想做个Tab切换对比三个方案,做不到。嵌套表格在Markdown里丑到没法给客户看。每次碰到这些限制,都得把内容搬进Notion或者画PPT,多一道手。后来才想起来Thariq说的那句话,把输出格式从Markdown换成HTML试了一下——直接解决问题。

Markdown的两个老本,Agent时代吃不下了

Markdown能统治开发者工具二十年,靠两件事:人能直接编辑,文件到处都能打开。

但现在的实际情况是——超过100行的Markdown文件,我自己不读。每次要改内容,我都是让AI改,不是自己上手改。

Markdown是过程中的东西,HTML是结果的东西。 你跟Agent来回沟通、迭代、打草稿,用Markdown没问题——那是你们俩的工作语言。但最终交付给人看的东西,方案、规划、技术解读,Markdown的表达力就到头了。你不会把草稿本直接递给客户。

这个前提一变,选择逻辑就清楚了。

什么时候该换

Thariq(发推的那位)的意思不是HTML要取代Markdown。他自己也说了,Git里的README、changelog、API文档,该用Markdown还是用Markdown。他换的场景很明确:给人类快速理解的东西,不是给Git diff看的东西。

他做了个页面放了20个HTML示例。PR review不是一坨diff加几行注释,而是带导航的页面——模块用SVG画了方块图,改动用颜色标注,reviewer一眼看到代码结构变了什么。实现计划不是按时间排的列表,是时间轴+数据流图+内联mockup+风险表格,一个文件交付完整方案。还有feature flag编辑器、prompt调参器、事故时间线,全是打开浏览器直接用的交互界面。

HTML示例页面总览
HTML示例页面总览
实现计划示例——时间线+任务卡片+风险标注
实现计划示例——时间线+任务卡片+风险标注

这不是让AI写网页。 不需要前端知识,不需要React或Vue,就是纯HTML+CSS+一点内联JS。Agent一次生成,浏览器打开就是成品。Simon Willison用GPT-5.5做了同样的事——用curl拉一段代码,让它输出HTML做交互式解读,效果也很好。所以这不是Claude的独家能力,是HTML这个格式本身的表达上限比Markdown高出一截。

Markdown到头了:表格、嵌套列表、代码块。HTML能做SVG流程图、折叠面板、Tab切换、搜索过滤、交互组件。差距不是一个量级。

什么时候不该换

Reddit上有人提了个实际问题:如果你要Git做版本对比、代码review、diff追踪,HTML就是负担。二进制文件没法diff,改一行HTML标签整个文件标红。

还有个现实问题——token消耗。HTML标签比Markdown语法多出一大截。Thariq自己说了,这事在Opus 4.7的一百万token上下文窗口出来之后才真正可行。上下文窗口不够大的模型,生成一个复杂HTML文件可能直接把上下文吃满,后面就没法继续对话了。

所以不是什么都要换。Markdown负责机器要review的东西,HTML负责人要快速理解的东西。 只是后者的场景,现在远比前者多。

一个prompt就能试

下次你要让AI做技术方案、项目规划、代码解读,把”output as markdown”换成这行:

Read the relevant code and produce a single HTML explainer page: a diagram of the flow, the key code snippets annotated, and a gotchas section at the bottom.

翻译:让AI读完相关代码,生成一个HTML解读页——上面画流程图,中间标注关键代码片段,底部列出容易踩的坑。

如果你想试更完整的,GitHub上有个项目叫html-anything,是个Claude Code skill,能把各种内容自动转成编辑级HTML。Thariq自己的20个示例页面也在:

https://thariqs.github.io/html-effectiveness

https://github.com/iharnoor/html-everything

不急着换,但要记住

Thariq管自己的工作流叫”living design system”——HTML设计规范跟着代码走,随时更新,随时可视化,不依赖Figma或Keynote的导出步骤。

他在ChatPRD的播客里说了个有意思的观点:AI时代的开发者不应该只把算力花在写代码上。99%的token应该花在规划、界面和沟通上——计划、review、方案展示,产出代码只占1%。这话在项目规划阶段确实有道理——你让Agent花3万个token生成一个带流程图和风险表的HTML方案文档,比让它花3千个token写一个没人看的Markdown计划有用。但到了执行阶段写业务代码,这个比例反过来才对。

这些你不用马上都学。等哪天你让AI写了个技术方案,发现Markdown里画不出流程图、嵌套表格丑到没法看、想做个Tab页签切换的时候——把输出格式换成HTML就行。

说到底不是格式之争。Markdown是过程,HTML是交付——你不会把草稿本直接递给客户,Agent时代也一样。


参考: Thariq原文: https://x.com/trq212/status/2052811606032269638 20个HTML示例: https://thariqs.github.io/html-effectiveness Simon Willison评注: https://simonwillison.net/2026/May/8/unreasonable-effectiveness-of-html ChatPRD播客: https://www.youtube.com/watch?v=Qrpm7E80wQ0 html-anything项目: https://github.com/iharnoor/html-everything

原文发布于 AiCC,转载或引用请注明出处

We don't just produce information, we reconstruct knowledge. Elevating AI efficiency to an architectural art form.

Follow
公众号
公众号:AI知识共创
小程序
小程序:AI信息王哥
Explore
  • 首页
  • 知识深度
  • AI 行业情报
  • 商业业务
  • 知识库
  • 活动
Connect
  • 活动论坛
  • AI账号
  • 提示词商城
  • AI网址导航
  • 自媒体进化
  • AI应用分享
© 2023 AiCC · JOVI / AI Creative commons
POWERED BY Claude code