來討論下：HTML 一定比 Markdown 好？
整理版優先睇
HTML 比 Markdown 更適合 AI Agent 輸出？但分場景先係關鍵
呢篇文章係由 Anthropic 工程師 Thariq Shihipar 寫嘅，佢提出喺 AI Agent 時代，HTML 正在取代 Markdown 成為人機之間最高效嘅溝通格式，仲得到 Karpathy 點讚。作者整理咗呢個觀點，雖然贊成長遠嚟講 HTML 可能更好，但佢認為目前 Markdown 仍然有佢嘅地位，要視乎場景。
文章從 Markdown 嘅限制講起——當 Agent 輸出越來越長，人唔會讀完，而且編輯都交畀 AI，Markdown 嘅優勢消失。HTML 則可以做到表格、佈局、圖表、交互等 Markdown 做唔到嘅嘢。Karpathy 補充咗一個更大視角：人類大腦三分一算力用嚟處理視覺，所以 AI 輸出應該係可視化內容。
作者亦提供咗上手方法，就係喺提示詞嗰度叫 AI 生成 HTML。整體結論係：HTML 令人真正睇得明 AI 做緊乜，從而保持對決策嘅掌控，但生成時間同維護成本都要考慮，唔係一刀切嘅解決方案。
- 結論：HTML 喺 Agent 時代更適合表達複雜資訊，但 Markdown 嘅生態壁壘同維護成本仍然令佢不可替代，應按場景取捨。
- 方法：喺提示詞最後加一句「structure your response as HTML」，就可以令 AI 輸出可視化內容，提升閲讀率。
- 差異：HTML 可以做到表格、佈局、圖表、交互等，Markdown 難以實現；但 HTML 生成慢 2-4 倍，手改難度高，Git diff 可讀性差。
- 啟發：人腦視覺處理頻寬遠高於文字，AI 輸出應該善用 HTML 嘅可視化能力，先至可以令人真正參與協作。
- 可行動點：即時用 Thariq 提供嘅提示詞，叫 AI 生成方案對比、PR 審查、互動式編輯器等 HTML 文檔，提升工作效率。
html-effectiveness 開源項目
Thariq 製作嘅示例畫廊，收錄 20 個 HTML 文件，覆蓋探索規劃、程式碼審查、設計原型等 9 大場景。
HTML 示例畫廊
可直接瀏覽嘅 HTML 文件展示，方便即時睇效果。
生成方案對比 HTML
「生成 6 個截然不同嘅 onboarding 方案，放喺同一個 HTML 檔案用 grid 展示，每個方案標明佢嘅取捨。」
背景：呢個觀點點樣爆紅
最近 Anthropic 工程師 Thariq Shihipar 寫咗篇文章《The Unreasonable Effectiveness of HTML》，核心觀點係 AI Agent 時代 HTML 正取代 Markdown 成為最高效溝通格式。
HTML 正在取代 Markdown
Andrej Karpathy 轉發讚好，認為視覺係人類大腦接收資訊嘅十車道高速公路，所以 AI 輸出應該係有顏色、佈局、交互嘅內容。
視覺係人類大腦接收資訊嘅十車道高速公路
作者整理呢個觀點，雖然贊成，但認為要分場景，Markdown 仍有其位置。
點解 Markdown 唔夠用？
Thariq 指出 Markdown 雖然簡單通用輕量，但當 Agent 輸出超過 100 行嘅 spec、plan、report，佢同團隊都唔會讀完。
超過 100 行嘅 Markdown 文件基本唔會讀完
更重要係，呢啲長文件而家都係由 Claude 編輯，Markdown 最大優勢「方便手動編輯」已經消失。
Markdown 最大優勢「方便手動編輯」已經消失
- Markdown 喺 Agent 時代變成一種限制
- 人唔願意讀，AI 又唔需要佢嘅可編輯性
HTML 有咩 Markdown 做唔到？
Thariq 列舉 HTML 嘅碾壓級能力：用表格呈現數據、CSS 控制設計、SVG 畫圖、script 嵌入代碼、canvas 畫圖等。
幾乎沒有任何一種資訊係 HTML 無法表達
- 1 探索規劃：一次生成 6 種方案並排對比，唔使讀文字牆
- 2 程式碼審查：渲染 diff、標註、流程圖，比 GitHub 默認 diff 好用
- 3 設計原型：直接畫設計稿，再翻譯成 React、Swift 等框架
- 4 報告彙報：生成帶圖表交互嘅 HTML 報告，老闆會睇
- 5 臨時編輯器：做一次性編輯器調顏色、動畫曲線、正則
HTML 比 Markdown 被閲讀概率高幾倍
不過 HTML 都有維護成本問題：手改 HTML 比手改 Markdown 難 10 倍，Git diff 幾乎不可讀，Code Review 可讀性差。
Karpathy 嘅更大視角
Karpathy 提出音頻係人類畀 AI 輸入嘅首選，但視覺先係 AI 輸出畀人類嘅首選。
視覺係資訊進入大腦嘅十車道高速公路
佢畫咗條演進路線：純文本 → Markdown → HTML → 交互式神經視頻。
Simon Willison 用 GPT 將混淆腳本解析成精美 HTML 文檔，證明呢個方法可行。
點樣開始用 HTML 輸出
Thariq 強調唔需要複雜配置，只需喺提示詞講「make a HTML file」就得。
關鍵唔係點生成，而係你想用 HTML 做乜
佢提供咗幾個直接可用嘅提示詞，仲開咗個示例畫廊。
Generate 6 distinctly different approaches for the onboarding screen, and lay them out as a single HTML file in a grid so I can compare them side by side. Label each with the tradeoff it's making.GitHub 項目 html-effectiveness 收錄 20 個 HTML 文件，覆蓋 9 大場景。
HTML 令人真正睇得明 AI 做緊乜，保持對決策嘅掌控
下面係對 Thariq 同 Karpathy 觀點嘅總結，我都幾贊成，長遠嚟睇可能真係咁。
但係以目前嚟講，Markdown 依然係無可替代，各有各嘅長處。
都係要分場景去睇。
HTML 都有啲問題，佢有標籤資訊，可能會帶嚟成本、影響效率。
目前，唔係所有人都用 Opus 4.7，呢種 100 萬上下文窗口嘅頂級模型。
雖然冇耐一百萬上下文窗口會成為各個模型廠商嘅標配。
而且 Markdown 嘅生態壁壘比想像中深。例如各種 Readme，各種文件產品都兼容呢個格式。
另外，HTML 都有 Markdown 冇嘅坑，例如維護成本：手改 HTML 比手改 Markdown 難 10 倍。
當 AI 生成嘅 HTML 唔太啱嘅時候，你自己微調嘅門檻好高
仲有就係工具鏈斷裂，Git diff 睇 HTML 改動幾乎睇唔到，Code Review 嗰陣 HTML 嘅可讀性反而比 Markdown 差。
如果係 Agent 中間產物仲可能要係 Markdown，如果係最終產品或方案對比，HTML 確實合適啲。
Markdown 嘅真正優勢唔係人能讀，而是 AI 可以高效處理。
01
近期討論
Claude Code 團隊嘅工程師 Thariq Shihipar 寫咗一篇長文，標題好猛：The Unreasonable Effectiveness of HTML（HTML 唔合理嘅有效性）。
核心觀點得一個：喺 AI Agent 時代，HTML 正喺度取代 Markdown，成為人同 AI 之間最高效嘅溝通格式。
Andrej Karpathy 轉發咗並評論咗呢條推文。佢話自己都一直係咁做，仲分享咗一個更大嘅視角：
人腦大約三分之一嘅運算能力專門用嚟處理視覺資訊，視覺係人類大腦接收資訊嘅十車道高速公路。
所以 AI 嘅輸出唔應該係一堆文字，而應該係有顏色、有佈局、有互動嘅可視化內容。
02
點解 Markdown 唔夠用
Thariq 認為 Markdown 可以咁流行係有原因嘅：簡單、通用、輕量。
Claude 甚至可以用 ASCII 喺 Markdown 度畫圖。
但問題係，當 AI Agent 越來越勁，佢輸出嘅 spec、plan、report 都越來越長。
超過 100 行嘅 Markdown 文件，佢基本上唔會睇完，佢團隊入面都冇人願意睇。
而且呢啲長文件而家基本上都唔係人喺度編輯，都係叫 Claude 去改。
Thariq 認為 Markdown 最大嘅優勢：方便手動編輯 直接消失咗。
Markdown 喺 Agent 時代變成咗一種限制。
03
HTML 做到啲乜嘢 Markdown 做唔到
Thariq 列咗一堆 HTML 相對於 Markdown 嘅碾壓級能力：
用表格呈現數據，用 CSS 控制設計，用 SVG 畫圖，用 script 標籤嵌入代碼，用 HTML 元素做互動，用絕對定位做空間佈局，用 canvas 畫圖，用 img 標籤放圖片。
佢嘅原話係：幾乎冇任何一種資訊係 HTML 表達唔到嘅。
佢舉咗幾個實際應用場景：
探索同規劃。 唔確定方向嘅時候，叫 Claude 一次過生成 6 種唔同嘅方案，鋪喺一個 HTML 頁面裏面並排對比，而唔係睇三幅文字牆然後喺腦入面來回比較。
代碼審查。 HTML 可以渲染 diff、標註、流程圖、模塊圖。Thariq 話佢而家每個 PR 都會附一個 HTML 代碼解讀文件，比 GitHub 預設嘅 diff 視圖好用。
設計原型。 HTML 本身就係設計語言。Claude 可以喺 HTML 度畫出設計稿，然後再翻譯成 React、Swift 等你需要嘅框架。仲可以加滑塊同旋鈕俾你實時調整參數。
報告同彙報。 叫 Claude 將 Slack 討論記錄、代碼庫、Git 歷史等資訊綜合起來，生成一份帶圖表同互動嘅 HTML 報告。Send 俾老細，老細大概率會睇。Send 個 Markdown，大概率唔會。
臨時編輯器。 有啲嘢喺文本框入面好難描述，例如顏色、動畫曲線、正則表達式。咁就叫 Claude 直接幫你做一個一次性嘅 HTML 編輯器，調完之後㩒複製掣貼返過去就得。
仲有一點好關鍵，分享更方便。
Markdown 文件喺大多數瀏覽器入面冇辦法直接渲染，只可以當附件 send email、send 消息。
HTML 文件上載到任何地方（例如 S3），直接 send 個連結就得。同事喺手機、電腦上面都可以開嚟睇。
人哋真正睇完你份 spec、report、PR 描述嘅概率，HTML 比 Markdown 高咗幾倍。
04
Karpathy 嘅更大視角
Karpathy 喺轉發入面補充咗一個更加有意思嘅觀點。
他說：音頻係人類俾 AI 輸入嘅首選方式，但視覺：圖片、動畫、視頻，先係 AI 俾人類輸出嘅首選方式。
人腦大約三分之一嘅運算能力專門處理視覺資訊。視覺係資訊進入大腦嘅十車道高速公路。
佢畫咗一條演變路徑：
Karpathy 仲俾咗一個好實用嘅操作建議：喺提示詞最後加一句 structure your response as HTML，然後將生成嘅文件喺瀏覽器入面打開。
效果會好好多。佢都試過叫 LLM 將輸出整成幻燈片。
Simon Willison 都驗證咗呢個方法。
佢用 GPT-5.5 將 copy.fail 網站上面一個混淆過嘅 Python 提權腳本掟入去，叫 AI 生成一份 HTML 格式嘅詳細解析。結果係一份帶側邊欄、代碼標註、顏色標記、步驟拆解嘅精美技術文件。
05
點樣上手
Thariq 特別強調咗一點：唔需要搞啲咩複雜嘅配置或者 Skill。
你只需要喺提示詞度講 make a HTML file 或者 make a HTML artifact 就得。
關鍵唔係點樣生成，而係你想用呢個 HTML 做啲乜。
幾個可以直接用嘅提示詞：
Generate 6 distinctly different approaches for the onboarding screen, and lay them out as a single HTML file in a grid so I can compare them side by side. Label each with the tradeoff it's making.
Help me review this PR by creating an HTML artifact that describes it. Render the actual diff with inline margin annotations, color-code findings by severity.
I need to reprioritize these 30 tickets. Make me an HTML file with each ticket as a draggable card across Now / Next / Later / Cut columns. Add a copy as markdown button.
Thariq 做咗一個示例畫廊，收集咗 20 個 HTML 文件，涵蓋探索規劃、代碼審查、設計、原型、圖表、幻燈片、研究學習、報告、自定義編輯器等 9 大類場景。
即係上面提到嗰個開源項目。
GItHub 地址：https://github.com/ThariqS/html-effectiveness
示例畫廊地址：https://thariqs.github.io/html-effectiveness/06
最後講兩句
Thariq 有一句話我覺得係全文最核心嘅：
我以前驚自己因為唔睇計劃而喺決策中逐漸脱節，但而家用了 HTML 之後，我覺得比以往任何時候都更深咁參與咗同 AI 嘅協作入面。
唔係為咗花巧，唔係為咗炫耀技術。
係因為 HTML 令人可以真正睇得明 AI 做緊乜，從而保持對決策嘅掌控。
生成時間係長啲，HTML 比 Markdown 慢 2-4 倍。但考慮到你真正睇完佢嘅概率高咗幾倍，呢筆數點計都抵。
用 Opus 4.7 嘅 100 萬上下文窗口，多出嚟嘅 token 開銷基本上可以忽略。
07
㩒下面張卡片，關注逛逛 GitHub
呢個公眾號歷史發佈過好多有趣嘅開源項目，如果你懶得翻文章一個一個揾，你直接關注微信公眾號：逛逛 GitHub ，後台對話聊天就得：
下面是對 Thariq 和 Karpathy 觀點總結，我挺贊成的，長遠來看可能確實是這樣。
但目前而言，Markdown 依然不可替代，各有所長。
還是得分場景去看。
HTML 也有一些問題，它有標籤信息，可能會帶來成本、影響效率。
目前，不是所有人都用 Opus 4.7，這種 100 萬上下文窗口的頂級模型。
雖然不久百萬上下文窗口會成為各個模型廠商的標配。
而且 Markdown 的生態壁壘比想象中深。比如各種 Readme，各種文檔產品兼容這個格式。
另外，HTML 也有 Markdown 沒有的坑，比如維護成本：手改 HTML 比手改 Markdown 難 10 倍。
當 AI 生成的 HTML 不太對時，你自己微調的門檻很高
還有就是工具鏈斷裂，Git diff 看 HTML 改動幾乎不可讀，Code Review 時 HTML 的可讀性反而比 Markdown 差。
如果是 Agent 中間產物還可能得是 Markdown，如果是最終產品或方案對比，HTML 確實合適一些。
Markdown 的真正優勢不是人能讀，而是 AI 能高效處理。
01
近期討論
Claude Code 團隊的工程師 Thariq Shihipar 寫了一篇長文，標題很猛：The Unreasonable Effectiveness of HTML（HTML 不合理的有效性）。
核心觀點就一個：在 AI Agent 時代，HTML 正在取代 Markdown，成為人和 AI 之間最高效的溝通格式。
Andrej Karpathy 轉發並評論了這條推文。他說自己也一直在這麼幹，還分享了一個更大的視角：
人腦大約三分之一的算力專門用來處理視覺信息，視覺是人類大腦接收信息的十車道高速公路。
所以 AI 的輸出不應該是一堆文字，而應該是有顏色、有佈局、有交互的可視化內容。
02
為什麼 Markdown 不夠用了
Thariq 認為 Markdown 能火起來是有原因的：簡單、通用、輕量。
Claude 甚至能在 Markdown 裏用 ASCII 畫圖。
但問題是，當 AI Agent 越來越強，它輸出的 spec、plan、report 也越來越長。
超過 100 行的 Markdown 文件，他基本不會讀完，他團隊裏也沒人願意讀。
而且這些長文件現在基本也不是人在編輯了，都是讓 Claude 去改。
Thariq 認為 Markdown 最大的優勢：方便手動編輯 直接消失了。
Markdown 在 Agent 時代變成了一種限制。
03
HTML 能幹什麼 Markdown 幹不了的
Thariq 列了一堆 HTML 相對於 Markdown 的碾壓級能力：
用表格呈現數據，用 CSS 控制設計，用 SVG 畫圖，用 script 標籤嵌入代碼，用 HTML 元素做交互，用絕對定位做空間佈局，用 canvas 畫圖，用 img 標籤放圖片。
他的原話是：幾乎沒有任何一種信息是 HTML 無法表達的。
他舉了幾個實際使用場景：
探索和規劃。 不確定方向的時候，讓 Claude 一次生成 6 種不同的方案，鋪在一個 HTML 頁面裏並排對比，而不是讀三堵文字牆然後在腦子裏來回比較。
代碼審查。 HTML 能渲染 diff、標註、流程圖、模塊圖。Thariq 說他現在每個 PR 都會附一個 HTML 代碼解讀文件，比 GitHub 默認的 diff 視圖好用。
設計原型。 HTML 本身就是設計語言。Claude 可以先在 HTML 裏畫出設計稿，然後再翻譯成 React、Swift 等你需要的框架。還能加滑塊和旋鈕讓你實時調參數。
報告和彙報。 讓 Claude 把 Slack 討論記錄、代碼庫、Git 歷史等信息綜合起來，生成一份帶圖表和交互的 HTML 報告。發給老闆，老闆大概率會看。發個 Markdown，大概率不會。
臨時編輯器。 有些東西在文本框裏很難描述，比如顏色、動畫曲線、正則表達式。那就讓 Claude 直接給你做一個一次性的 HTML 編輯器，調完了點複製按鈕粘貼回去就行。
還有一點很關鍵，分享更方便。
Markdown 文件在大多數瀏覽器裏沒法直接渲染，只能當附件發郵件、發消息。
HTML 文件上傳到任何地方（比如 S3），直接發個連結就行。同事在手機上、電腦上都能打開看。
別人真正讀完你的 spec、report、PR 描述的概率，HTML 比 Markdown 高了好幾倍。
04
Karpathy 的更大視角
Karpathy 在轉發中補了一個更有意思的觀點。
他說：音頻是人類給 AI 輸入的首選方式，但視覺：圖片、動畫、視頻，才是 AI 給人類輸出的首選方式。
人腦大約三分之一的算力專門處理視覺信息。視覺是信息進入大腦的十車道高速公路。
他畫了一條演進路線：
Karpathy 還給了一個很實用的操作建議：在提示詞最後加一句 structure your response as HTML，然後把生成的文件在瀏覽器裏打開。
效果會好很多。他也試過讓 LLM 把輸出做成幻燈片。
Simon Willison 也驗證了這個方法。
他用 GPT-5.5 把 copy.fail 網站上的一個混淆過的 Python 提權腳本丟進去，讓 AI 生成一份 HTML 格式的詳細解析。結果是一份帶側邊欄、代碼標註、顏色標記、步驟拆解的精美技術文檔。
05
怎麼上手
Thariq 特別強調了一點：不需要搞什麼複雜的配置或 Skill。
你只需要在提示詞裏說 make a HTML file 或者 make a HTML artifact 就行。
關鍵不是怎麼生成，而是你想用這個 HTML 做什麼。
幾個可以直接用的提示詞：
Generate 6 distinctly different approaches for the onboarding screen, and lay them out as a single HTML file in a grid so I can compare them side by side. Label each with the tradeoff it's making.
Help me review this PR by creating an HTML artifact that describes it. Render the actual diff with inline margin annotations, color-code findings by severity.
I need to reprioritize these 30 tickets. Make me an HTML file with each ticket as a draggable card across Now / Next / Later / Cut columns. Add a copy as markdown button.
Thariq 做了一個示例畫廊，收集了 20 個 HTML 文件，覆蓋探索規劃、代碼審查、設計、原型、圖表、幻燈片、研究學習、報告、自定義編輯器等 9 大類場景。
也就是上面提到的那個開源項目。
GItHub 地址：https://github.com/ThariqS/html-effectiveness
示例畫廊地址：https://thariqs.github.io/html-effectiveness/06
最後說兩句
Thariq 有一句話我覺得是全文最核心的：
我以前害怕自己因為不讀計劃而在決策中逐漸脱離，但現在用了 HTML 之後，我感覺比以往任何時候都更深地參與到了和 AI 的協作中。
不是為了花哨，不是為了炫技。
是因為 HTML 讓人能真正看懂 AI 在做什麼，從而保持對決策的掌控。
生成時間是長一些，HTML 比 Markdown 慢 2-4 倍。但考慮到你真正讀完它的概率高了好幾倍，這筆賬怎麼算都划算。
用 Opus 4.7 的 100 萬上下文窗口，多出來的 token 開銷基本可以忽略。
07
點擊下方卡片，關注逛逛 GitHub
這個公眾號歷史發佈過很多有趣的開源項目，如果你懶得翻文章一個個找，你直接關注微信公眾號：逛逛 GitHub ，後台對話聊天就行了：