新智元報道

編輯：好困

【新智元導(dǎo)讀】時代變了！統(tǒng)治十年的Markdown被無情拋棄，Anthropic大牛爆改工作流：讓Claude直出HTML，閉環(huán)操作體驗拉滿。

就在剛剛，Anthropic的工程大佬Thariq Shihipar發(fā)了一篇長文，標題叫「HTML好用得離譜」。

他說，自己已經(jīng)幾乎不用Markdown了，全部切換成讓Claude Code生成HTML。

而且不只他一個人，Claude Code團隊里越來越多的人都在這么干。

統(tǒng)治了開發(fā)者世界十年的Markdown，就這么水靈靈地被自家人拋棄了？

舉個例子你就知道了。

你讓Claude Code展示一組設(shè)計色板，它在Markdown里憋了半天，最后用ASCII字符拼了一排灰撲撲的方塊。

hex值倒是標得很準，但旁邊這堆灰色的點陣圖案，根本看不出是個啥。

換成HTML輸出后，同樣的信息就變成了下面這樣。不用腦補，一看就懂。

你品品這個畫面，全世界最強的編程AI，被困在純文本格式里時，竟然只能用打字機字符假裝自己在展示色板……

20個HTML文件全開源

每個都能替掉一份Markdown

說到這位Thariq Shihipar，他可不是一般的工程師。

MIT Media Lab出身，之前開了五年游戲公司，融了1700萬美元。

他加入Anthropic的理由挺有意思的，用他自己的話說，叫「AI psychosis」，AI精神病。

Thariq覺得Claude Code就是軟件開發(fā)的未來，不來不行。

Claude Code之父Boris Cherny招人的標準是「ex-founder, high agency」，創(chuàng)過業(yè)、執(zhí)行力強。Thariq正好兩條都占。

進了Claude Code團隊之后，他同時管著工程、內(nèi)容和用戶反饋三條線。

期間做的最有名的功能是AskUserQuestion，就是讓Claude在信息不夠的時候主動問你問題，而不是瞎猜。

他把這個叫「解除模型的束縛」，讓AI把本來就有的能力釋放出來。

今年3月，他寫了一篇關(guān)于Claude Code內(nèi)部怎么用Skills的長文，也炸了一輪。

里面透露了一個關(guān)鍵細節(jié)，Anthropic內(nèi)部有幾百個活躍的Skills在跑，遠比外界想象的多。

這次，Thariq把自己和團隊用Claude Code生成的20個HTML文件全部開源在GitHub Pages上，按用途分成九大類。

每一個都是單獨的HTML文件，瀏覽器打開就能用。

項目地址：https://thariqs.github.io/html-effectiveness/#code-review

代碼審查：比GitHub的diff更好用

首先，是開發(fā)者反應(yīng)最強烈的場景。

Thariq讓Claude Code審查一個PR，生成了一個HTML頁面。

里面是完整的diff渲染，每段改動旁邊有內(nèi)聯(lián)注釋，每條注釋按嚴重程度顏色編碼。

紅色是Blocking級別的問題，黃色是Worth a look，綠色是Safe。

頂部有一張風險地圖（Risk Map），六個被修改的文件用不同顏色標注風險等級，一眼就能看出該重點審查哪個文件。底部還自動生成了修復(fù)建議清單。

Thariq說他現(xiàn)在每次提PR都附帶一個HTML的代碼講解頁，比GitHub默認的diff視圖好用得多。

原因很簡單。代碼的diff是空間信息，Markdown把它壓平了，HTML能把它還原回來。

交互式教程：一致性哈希，一個環(huán)搞定

讓Claude解釋一個技術(shù)概念，Markdown只能輸出線性的文字，但HTML就不一樣了。

Thariq展示了一個一致性哈希的交互教程。

頁面上畫了一個環(huán)，4個節(jié)點、32個key分布在環(huán)上，每個節(jié)點用顏色標注它管轄的弧段。

你可以點「加一個節(jié)點」或「刪一個節(jié)點」，實時看到key的重新分配。

旁邊還有一張對比表，hash mod N vs 一致性哈希，指標清清楚楚。底部是一個懸停高亮的術(shù)語表。

同樣的內(nèi)容用Markdown寫，大概是兩頁干巴巴的文字加一張ASCII畫的圓圈。你選哪個？

用完即棄的編輯器：拖完就扔，扔前導(dǎo)出

再比如24個工單需要重新排序。

讓Claude Code生成一個HTML文件，每個工單是一張可拖拽的卡片，在「Now / Next / Later / Cut」四列之間拖動。Claude會先用自己的判斷做一輪預(yù)排序，你只需要微調(diào)。

調(diào)完了，點底部的「Copy as markdown」按鈕，導(dǎo)出最終順序。

微調(diào)系統(tǒng)prompt的場景也一樣。

Claude Code生成一個左右對照的編輯器，左邊是可編輯的prompt，高亮顯示變量槽位，右邊實時渲染三個樣例輸入，還有字符/token計數(shù)器。

這些工具不是產(chǎn)品，不是可復(fù)用的組件，就是一個為當前任務(wù)量身定制的、用完就扔的單HTML文件。

Thariq給這種玩法起了個名字，叫「throwaway editor」，用完即棄的編輯器。

更關(guān)鍵的是他提到的另一個概念，「雙向交互」。

HTML文檔不再是只讀的，你可以在頁面里操作。

Claude生成的滑塊、旋鈕、拖拽區(qū)域都是活的，調(diào)完之后點導(dǎo)出按鈕，把結(jié)果轉(zhuǎn)換成文本粘回Claude Code繼續(xù)干活。

人→AI→HTML→人操作→導(dǎo)出→AI。閉環(huán)了。

AI生成的不再是「文檔」，而是「工具」。

其他場景速覽

除了這些，案例庫里還有不少好東西。

• 周報

什么上線了、什么延期了，配一張小圖表和彩色時間線，經(jīng)理周一早上掃一眼就夠了。

• 實施計劃

時間線里程碑、數(shù)據(jù)流圖、內(nèi)聯(lián)原型圖、風險表，全塞在一個頁面里。Markdown寫的計劃是說明書，HTML寫的計劃是儀表盤。

• 設(shè)計系統(tǒng)可視化

Claude讀取代碼庫，把顏色變量渲染成色板，組件的所有尺寸、狀態(tài)、變體鋪在一張表上。

• 動畫原型

一個按鈕的點擊動畫，加上緩動曲線的滑塊，調(diào)完參數(shù)一鍵復(fù)制回代碼。動畫這種東西文字說不清楚，必須「感受」。

還有箭頭鍵翻頁的幻燈片，一個HTML文件就是一套演示文稿，不用打開Keynote，不用導(dǎo)出PDF。

Markdown統(tǒng)治了十年

但現(xiàn)在寫文件的是AI

Thariq的判斷建立在兩個變化上。

第一，AI Agent的輸出越來越復(fù)雜，一份超過100行的Markdown文件，他坦言自己讀不下去，也別想讓團隊其他人讀。

第二，人們越來越少親自編輯這些文件了，規(guī)范文檔、參考資料、頭腦風暴的輸出，大多數(shù)時候讓Claude來改。

Markdown最大的優(yōu)勢「易編輯」，被架空了。

不僅如此，在Markdown里顏色用方塊字符估測，圖表用ASCII畫線框，代碼diff只能用+和-標記。

而HTML能裝表格、CSS設(shè)計token、SVG插圖、交互組件、Canvas空間數(shù)據(jù)。

只要是Claude能理解的信息，幾乎沒有什么是HTML表達不了的。

還有一個容易忽略的好處，分享。

Markdown文件大多數(shù)瀏覽器原生渲染效果都不好，只能當附件塞進郵件。

HTML傳到S3上就有鏈接，同事在哪里都能打開。你的規(guī)范用HTML寫的，別人實際去讀它的概率會高得多。

Markdown統(tǒng)治開發(fā)者工具鏈十幾年，靠的是一個核心假設(shè)，人要親手編輯文件。

標題用#，加粗用**，列表用-，所有語法都為人類手指優(yōu)化。

但你回想一下，你上次親手改一份Markdown文件，是什么時候的事了？

現(xiàn)在大多數(shù)情況是，AI寫文件，你看一眼，覺得行，提交。覺得不行，告訴AI哪里改，它再寫一版。文件從頭到尾你沒動過一個字符。

既然人的角色從「寫」變成了「看」，那輸出格式是不是也該跟著反過來？

HTML恰好就是這樣。

人寫起來痛苦，但AI寫起來毫不費力。人看起來舒服，因為有顏色、有布局、有交互。

而且現(xiàn)在Opus 4.7的上下文窗口已經(jīng)到了100萬token，HTML多出來那點標簽開銷根本不算什么。

說白了，當瓶頸從token數(shù)量變成了人的注意力，格式的選擇邏輯就徹底反轉(zhuǎn)了。

當然，HTML也不是沒毛病。

生成時間比Markdown慢2到4倍，版本控制的diff亂得沒法看，而且確實更費token。

但話說回來，你真的會去讀HTML生成的東西。而Markdown的長文檔，大概率劃兩下就關(guān)了。

讀了 vs 沒讀，這個差距可比token效率大多了。

換句話說，一個格式的變化，就決定了你到底是在「使用」AI，還是在「被」AI使用。

Markdown不會消失，就像命令行不會消失一樣。

但它的統(tǒng)治地位，可能真的到頭了。

至少，Anthropic自家人已經(jīng)用腳投了票。

參考資料：

https://x.com/trq212/status/2052809885763747935