用 HTML 替代 Markdown：Claude Code 團隊第一手實踐（英中對照）

*Using Claude Code: The Unreasonable Effectiveness of HTML*

作者：Thariq Shihipar（Anthropic Claude Code 工程負責人）| 英中對照版

Markdown has become the dominant file format used by agents to communicate with humans. It's simple, portable, has some rich text capability and is easy to edit. Claude has even gotten surprisingly good at using ASCII to make diagrams inside of Markdown files.

Markdown 已經成為 AI 智能體與人類溝通時最常用的文件格式。它簡單、便攜，具備一定的富文本能力，而且極易手動編輯。甚至連 Claude 現在都相當擅長在 Markdown 文件裏用 ASCII 字符畫出各種圖表。

But as agents have become more and more powerful, I've found that Markdown has become an increasingly restrictive format. Specifically, I find it difficult to read a Markdown file of more than a hundred lines; I want to use Claude to generate richer visualizations, color and diagrams; and I want to be able to share these outputs more easily.

但隨着 AI 智能體變得越來越強大，我開始覺得 Markdown 是一種日益受限的格式。具體來說：超過百行的 Markdown 文件我基本沒耐心讀完；我想讓 Claude 生成更豐富的可視化內容、色彩和圖表；我也希望能更輕鬆地把這些輸出分享給別人。

I also am increasingly not editing these files myself, but using them as specs and reference files. When I do make edits, I'm usually prompting Claude to edit them, which removes one of Markdown's largest benefits.

另外，我現在越來越少親自編輯這些文件，更多是把它們作為需求文檔 (Spec) 和參考資料使用。即使需要修改，通常也是直接寫提示詞讓 Claude 去改——這樣一來，Markdown 最大的優勢「易於人工編輯」就蕩然無存了。

Instead, I've started preferring HTML as an output format instead of Markdown and increasingly see this pattern being applied by others on the Claude Code team. In this post, I share why and how our team uses HTML to produce richer, more readable Claude Code outputs.

因此，相比 Markdown，我開始更偏愛將 HTML 作為輸出格式，而且我發現 Claude Code 團隊的其他成員也越來越頻繁地使用這種方式。這篇文章就是要和大家分享：為什麼以及如何用 HTML 來生成更豐富、更易讀的 Claude Code 輸出。

如果你剛開始用 Claude Code，CC Switch 工具介紹 可以幫助你快速在多個 Claude 工具之間切換；關於如何把 Claude 能力封裝成可重用 Skill，可以參考 《Skill 專題開篇》。

一、為什麼用 HTML？ / Why Use HTML?

A few things make HTML a better fit than Markdown for the kind of work I'm now doing with Claude Code.

以下幾點讓 HTML 比 Markdown 更適合我現在使用 Claude Code 所做的工作。

1. 信息密度 / Information Density

HTML can convey much richer information compared to Markdown. It can, of course, do simple document structure like headers and formatting, but it can also represent all sorts of other information such as:

HTML 能比 Markdown 傳達豐富得多的信息。它當然能處理標題和簡單排版等基礎文檔結構，但還能完美呈現各種複雜信息，例如：

• Tabular data using tables
• Design data with CSS
• Illustrations with SVG
• Code snippets with script tags
• Interactions using HTML elements with JavaScript + CSS
• Workflows using SVG and HTML
• Spatial data using absolute positions and canvases
• Images using image tags

• 用 <table> 展示表格數據
• 用 CSS 呈現設計細節
• 用 SVG 繪製精美插圖
• 用 <script> 標籤嵌入代碼片段
• 結合 HTML 元素、JavaScript 和 CSS 實現動態交互
• 用 SVG 與 HTML 結合繪製工作流圖表
• 用絕對定位與 Canvas 展示空間分佈數據
• 用 <img> 標籤直接插入圖片

In my opinion, there is almost no set of information that Claude can read that you cannot efficiently represent with HTML. This makes it a highly efficient way for the model to communicate in-depth information to you and for you to review it.

我甚至敢說：只要是 Claude 能讀懂的信息，幾乎沒有什麼是不能用 HTML 高效展現的。這使 HTML 成為了一種極為高效的載體——無論是模型向你深度傳遞信息，還是你進行閱讀審查，都無比順暢。

I've found that in the absence of being able to do this, the model may do more inefficient things in Markdown, like ASCII diagrams or, my favorite, estimating colors with unicode characters.

我發現，如果無法使用 HTML，模型往往會在 Markdown 裏做些效率低下的替代，比如硬用 ASCII 字符拼圖表，或者——我最哭笑不得的——用 Unicode 字符來生硬模擬顏色色塊。

2. 視覺清晰度與易讀性 / Visual Clarity and Ease of Reading

As Claude is capable of tackling more complex work, it's also able to write larger and larger specs and plans. I've found that I tend to not actually read more than a 100-line Markdown file, and I certainly am not able to get anyone else in my organization to read it.

隨着 Claude 能夠處理越來越複雜的工作，它寫出的需求規格說明和實施計劃也越來越龐大。實際上，我基本不會去讀超過 100 行的 Markdown 文件，更別提指望團隊裏的其他人去讀了。

But HTML documents are much easier to read because Claude can organize the structure visually to be ideal to navigate with tabs, illustrations, and links. It can even be mobile responsive so you can read it differently based on your form factor.

但 HTML 文檔好讀多了。Claude 可以通過選項卡、插圖、鏈接等視覺元素將文檔整理得井井有條，方便導航瀏覽。它甚至能做到移動端自適應，讓你在手機等不同尺寸的設備上都能獲得良好的閱讀體驗。

3. 易於分享 / Ease of Sharing

Markdown files are fairly hard to share since most browsers do not render them natively well. You often have to add them as attachments to emails or messages.

分享 Markdown 文件其實頗為麻煩，因為大多數瀏覽器無法直接良好地渲染它們，通常只能以附件形式硬塞進郵件或即時消息裏。

As long as you upload the HTML file, you can share the link easily. Your colleagues can open it wherever they wish and easily reference it.

但有了 HTML，只要把文件上傳到雲端，就能輕鬆分享鏈接。同事可以隨時隨地用任何設備打開並查閱。

The chance of someone actually reading your spec, report, or PR writeup is much higher if it's in HTML.

如果你的需求文檔、分析報告或代碼審查說明是 HTML 格式，別人真正去耐心閱讀它的概率會大幅提升。

4. 雙向交互 / Two-Way Interactions

HTML can also allow you to interact with the document; for example, you might want to ask it to add sliders or knobs to adjust a design or allow you to tweak different options in the algorithm to see what happens. You can also ask it to let you copy these changes into a prompt to paste back into Claude Code.

HTML 還允許你與文檔進行真實的互動。比如，你可以讓 Claude 在頁面上加幾個滑塊或旋鈕，用來直觀調整設計效果，或者微調算法參數看看結果如何變化。你甚至可以讓它加一個按鈕，把微調後的參數一鍵複製為提示詞，直接粘貼回 Claude Code 繼續下一步。

When useful, this can allow you to create individual editing environments for the specific problem you're working on.

這種雙向交互能讓你為手頭的具體問題，創建專屬的臨時編輯環境。

5. 數據攝取 / Data Ingestion

One of the biggest reasons to use Claude Code to make HTML files instead of Claude.ai or Claude Design is all of the context Claude Code can ingest. For example, when writing this article, I asked Claude Code to read through my code folder and find all the HTML files I've generated, group and categorize them, and then make an HTML file with diagrams representing each type. The diagrams you see in this article are a direct result of that.

使用終端工具 Claude Code 來生成 HTML，而不是直接用網頁版 Claude.ai 或 Claude Design，最大的原因之一在於：Claude Code 能夠攝取極其龐大的上下文信息。就拿寫這篇文章來說，我讓 Claude Code 自動遍歷我的代碼文件夾，找出所有由它生成的 HTML 文件，對它們進行分組歸類，再生成一個新的 HTML 頁面，用圖表展示每一類文件的特徵。文章裏你看到的配圖，正是這個工作流的直接產物。

Besides the file system, Claude Code can find additional context using your MCPs (like Slack, Linear, etc.), your web browser (with Claude in Chrome), and your git history.

除了本地文件系統，Claude Code 還能通過 MCP（模型上下文協議）接入其他豐富的上下文，比如 Slack 聊天記錄、Linear 任務看板等。它還能結合瀏覽器、Git 版本控制歷史記錄等多種來源獲取背景知識。

二、如何開始 / Getting Started

One thing worth noting: you don't need to do much to get Claude to generate HTML like this. You can simply prompt it to "make an HTML file" or "make an HTML artifact." The main thing is knowing what you want the artifact to do and how you might use it. Over time, it may make sense to build a skill around recurring patterns, but starting by prompting from scratch is a good way to get a feel for how it works across different use cases.

有一點值得特別說明：你完全不需要任何繁瑣的設置，就能讓 Claude 為你生成 HTML。只需像平時聊天一樣告訴它「給我做一個 HTML 文件」或「生成一個 HTML Artifact」就行。真正的關鍵在於：你要清楚自己希望這個製品能做什麼，以及你會如何使用它。也許隨着時間推移，你會總結出一套可重用的技能模板，但就目前而言，我強烈建議從最簡單的提示詞開始，慢慢摸索它在不同場景下的用法。

三、使用場景 / Use Cases

To make this approach more concrete, below are some example use cases where I think using HTML files make more sense than Markdown.

為了讓這套方法更加具體，以下是我認為使用 HTML 比 Markdown 更合適的幾類核心場景。

1. 需求、計劃與探索 / Specs, Planning, and Exploration

HTML is a rich canvas for Claude to dive into a problem. When I start working on a problem instead of a simple Markdown plan I expect to make a web of HTML files. For example, I might start with asking Claude Code to brainstorm and create some explorations of different options. I would then ask it to expand more into one, maybe make mockups or examples of the type interfaces. Finally, when I feel good I'll ask it to write an implementation plan. When I'm happy with the plan I'll create a new session and pass in all of these files for it to implement.

HTML 是讓 Claude 深入探討問題的廣闊畫布。當接手一個新問題時，我不再期望只得到一個單薄的 Markdown 計劃，而是希望生成一張由多個 HTML 文件交織而成的思考網絡。比如，我會先讓 Claude Code 進行頭腦風暴，探索幾種不同的實現方案；接着，深入展開其中一個，畫些介面草圖或寫幾段核心代碼片段；最後，當方向清晰了，才讓它寫出詳細的實施計劃。等我對計劃滿意後，開啟一個新會話，把這些 HTML 文件全部餵給它，正式開始敲代碼。

When verifying I'll also ask the verification agent to read in the files and it will have much broader context on what is needed.

在驗證環節，我也會讓負責檢查的 AI 智能體讀取這些 HTML 文件，使它擁有更宏觀的全局視角，清楚我們究竟想實現什麼。

提示詞示例 / Example prompts:

I'm not sure what direction to take the onboarding screen. Generate 6 distinctly different approaches—vary layout, tone, and density—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.

我還沒想好新手引導頁面要走什麼風格。請生成 6 種截然不同的方案——在佈局、語氣和信息密度上做出差異——並把它們放在同一個 HTML 文件的網格佈局裏，方便我並排對比。請在每個方案旁清晰標註它所做的取捨權衡。

Create a thorough implementation plan in an HTML file, be sure to make some mockups, show data flow and add important code snippets I might want to review. Make it easy to read and digest.

請在一個 HTML 文件裏創建一份詳盡的實施計劃，記得畫一些視覺草圖，展示數據流向，並補充上我可能需要重點審查的代碼片段。排版要清晰，讓人容易消化理解。

適用場景 / Use this for:

• Exploring other ways to implement something in code / 探索一段代碼的其他實現方式
• Experimenting with multiple visual designs at once / 並行探索多種視覺設計方案

2. 代碼審查與理解 / Code Review and Understanding

Code can be difficult to read in a Markdown file, but with HTML, we can render diffs, annotations, flowcharts, and modules. Use HTML to understand code that the agent has written, to review code, or to explain a PR to someone reviewing your code.

在 Markdown 文件裏生啃代碼是一件痛苦的事。但有了 HTML，我們就能優雅地渲染出代碼差異對比 (Diff)、詳細的頁邊註釋 (Annotation)、流程圖及模塊結構圖。你可以用它來理解 AI 智能體寫出的複雜代碼、進行代碼審查，或者在提交 PR 時向評審人解釋你的思路。

提示詞示例 / Example 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.

幫我審查這個 PR，生成一個 HTML 製品來向我解釋它的邏輯。我對數據流和背壓 (Backpressure，即接收方處理不過來時向發送方發出減速反饋的機制) 不太熟悉，請重點剖析這部分。請渲染出真實的代碼差異，並在旁邊加上行內註釋，根據嚴重程度對問題進行顏色編碼，還可以加上任何有助於傳達概念的視覺圖表。

適用場景 / Use this for:

• Creating a PR / 創建 PR 的說明文檔
• Reviewing a PR / 審查同事或 AI 提交的 PR
• Understanding a topic in code / 快速理解代碼庫中的某個複雜主題

3. 設計與原型製作 / Design and Prototypes

Claude Design is based on HTML because HTML is incredibly expressive at design, even if your end surface is not HTML. Claude can sketch out a design in HTML and then write it in your language of choice, be it React, Swift, etc.

Claude Design 的底層就是 HTML，因為即使你最終產品的渲染終端不是網頁，HTML 在表達設計理念方面依然具有無可匹敵的優勢。Claude 可以先用 HTML 快速勾勒出設計草圖，然後再將其轉換為你需要的任何編程語言，無論是 React、Swift 還是其他。

You can also prototype interactions, such as animations, actions, etc. Consider asking Claude to make sliders, knobs, etc. to tune in exactly what you're looking for.

你還可以用它來製作交互原型，比如動畫效果或用戶操作鏈路。不妨讓 Claude 加上滑塊和旋鈕，這樣你就能親自動手，把細節微調到你心目中的完美狀態。

提示詞示例 / Example prompt:

I want to prototype a new checkout button, when clicked it does a play animation and then turns purple quickly. Create an HTML file with several sliders and options for me to try different options on this animation, give me a copy button to copy the parameters that worked well.

我想為一個新的結賬按鈕做個交互原型：點擊它時，它會播放一段動畫，然後迅速變成紫色。請生成一個帶有幾個滑塊和選項的 HTML 文件，讓我能反覆測試這套動畫的不同參數配置。記得給我提供一個「複製」按鈕，方便我把試出來覺得完美的參數一鍵複製下來。

適用場景 / Use this for:

• Creating design system artifacts / 創建設計系統的相關組件資產
• Adjusting components / 直觀地微調 UI 組件細節
• Visualizing component libraries / 將枯燥的組件庫可視化展現
• Prototyping animations / 製作動畫交互原型

4. 報告、研究與學習 / Reports, Research, and Learning

Claude Code is very effective at synthesizing information across multiple data sources and converting it into a report for readability. You can prompt Claude to search your Slack, your codebase, git history, or the internet and use it to generate easy to read reports.

Claude Code 極其擅長整合海量的多源數據，並將它們提煉成可讀性極強的報告。你可以讓 Claude 搜索你的 Slack 聊天記錄、代碼庫、Git 提交歷史甚至整個互聯網，然後生成一份精美易讀的報告。

You could assemble this in the form of a long HTML document, an interactive explainer or even a slideshow/deck. Ask Claude to use SVG for diagrams to help visualize it.

你可以把它排版成一篇長篇 HTML 文檔、一個帶交互的解說頁面，甚至是一個幻燈片演示文稿。別忘了讓 Claude 多用 SVG 格式來繪製圖表，這會讓報告的視覺表現力瞬間提升。

提示詞示例 / Example prompt:

I don't understand how our rate limiter actually works. Read the relevant code and produce a single HTML explainer page: a diagram of the token-bucket flow, the 3–4 key code snippets annotated, and a "gotchas" section at the bottom. Optimize it for someone reading it once.

我一直搞不懂我們的限流器 (Rate Limiter) 到底是怎麼工作的。請閱讀相關代碼，併為我生成一個單頁的 HTML 講解文檔：包含一個令牌桶機制 (Token-Bucket) 的數據流向圖、3 到 4 段帶有詳細註釋的核心代碼片段，並在頁面底部單列一個「常見陷阱 (Gotchas)」部分。請優化排版佈局，確保別人只讀一遍就能徹底弄懂。

適用場景 / Use this for:

• Writing feature summaries / 總結某個複雜功能的工作原理
• Generating explainers / 向他人通俗解釋一個晦澀的概念
• Drafting weekly status reports / 快速生成本週工作彙報
• Creating incident reports / 出具直觀的故障覆盤報告
• Producing SVG illustrations, flowcharts, and technical diagrams / 自動繪製 SVG 插圖、流程圖和技術架構圖

5. 自定義編輯介面 / Custom Editing Interfaces

Sometimes it's hard to describe what you want purely in a text box. For this use case, I'll often ask Claude to build me a throwaway editor for the exact thing I'm working on: not a product, or a reusable tool, but a single HTML file, purpose-built for this one piece of data.

有時候，單純靠文字輸入框很難準確描述你的複雜需求。遇到這種情況，我會讓 Claude 專門為我手頭上的工作，快速搭建一個「用完即走」的臨時編輯器——不是一個成熟的產品，也不是可以反覆利用的通用工具，僅僅是一個專為這批特定數據量身定製的單一 HTML 文件。

The trick is always to end with an export: a "copy as JSON" or "copy as prompt" button that turns whatever I did in the UI back into something I can paste into Claude Code or commit to a file. You stay in the loop, but the loop gets much tighter.

這裏的核心竅門在於：一定要在介面上設計一個導出功能——比如「複製為 JSON」或「複製為提示詞」的按鈕，這樣你就能把你在這個 UI 裏一頓操作後的成果，直接粘貼回 Claude Code 裏繼續下一步工作。你始終保持在循環之中，只不過這個循環變得更加緊密高效了。

提示詞示例 / Example prompts:

I need to reprioritize these 30 Linear tickets. Make me an HTML file with each ticket as a draggable card across Now / Next / Later / Cut columns. Pre-sort them by your best guess. Add a "copy as Markdown" button that exports the final ordering with a one-line rationale per bucket.

我需要重新梳理這 30 個 Linear 任務單的優先級。請給我做一個 HTML 文件，把每個任務做成一張可拖拽的卡片，橫跨「現在 (Now) / 接下來 (Next) / 以後再說 (Later) / 砍掉 (Cut)」四個欄目。你可以根據你的理解先幫我預先排序好。最後加一個「複製為 Markdown」的按鈕，一鍵導出最終的分類排序結果，併為每個分類補充一句簡短的判斷理由。

Here's our feature flag config. Build a form-based editor for it, group flags by area, show dependencies between them, warn me if I enable a flag whose prerequisite is off. Add a "copy diff" button that gives me just the changed keys.

這裏是我們的功能開關 (Feature Flag) 配置文件。請為它生成一個基於表單的編輯器，按功能模塊對開關進行合理分組，展示它們之間的依賴關係；如果我打開了一個開關但它的前置依賴還處於關閉狀態，請彈窗警告我。最後加一個「複製差異」的按鈕，只導出我修改過的鍵值對。

I'm tuning this system prompt. Make a side-by-side editor: editable prompt on the left with the variable slots highlighted, three sample inputs on the right that re-render the filled template live. Add a character/token counter and a copy button.

我正在調優這個系統提示詞 (System Prompt)。請做一個左右對照的編輯器：左邊是可編輯的提示詞模板，變量槽要高亮顯示；右邊放 3 個示例輸入源，當我修改左邊的模板時，右邊要能實時渲染出填入變量後的最終效果。介面上還要有字符和 Token 的計數器，以及一個一鍵複製按鈕。

適用場景 / Use this for:

• Reordering, triaging, or bucketing anything / 對任何事物進行重新排序、分類或分組（任務單、測試用例、用戶反饋）
• Editing structured config / 編輯結構化配置（功能開關、環境變量、帶有約束條件的 JSON/YAML）
• Tuning prompts and templates with live preview / 藉助實時預覽功能調優提示詞、模板或文案
• Curating datasets / 整理數據集、批准或拒絕特定數據行、給示例打標籤並導出選中結果
• Annotating documents, transcripts, or diffs / 為長文檔、錄音文稿或代碼差異添加詳細批註並導出
• Picking values painful to express in text / 挑選那些用純文字極難描述的參數：顏色代碼、動畫緩動曲線 (Easing Curve)、Cron 定時表達式、正則表達式等

常見問題

These are the questions I get asked most often about using HTML with Claude Code, paired with the practical, day-to-day habits I've landed on.

以下是我在安利這套做法時被問得最多的幾個問題，以及我日常摸索出來的實踐答案。

這樣不會浪費更多 Token 嗎？

Q: Isn't it less efficient?

While Markdown often uses fewer tokens, I've found that the added expressiveness of HTML and the much higher likelihood of me reading it means I get overall better output. With the 1MM context window in Opus 4.7, the increased token usage is not really noticeable in the context window.

確實，Markdown 通常消耗的 Token 更少。但我發現，HTML 極強的表現力以及它更高的人工閱讀率，讓我整體上獲得了更好的輸出結果。在 Opus 4.7 高達 100 萬 Token 的上下文窗口裏，多花的這點 Token 幾乎可以忽略不計。

什麼時候還會用 Markdown？

Q: When do you use Markdown now?

I have honestly stopped using Markdown altogether for almost everything, but I'm probably far on the HTML maximalist side of things.

說實話，我現在幾乎幹什麼都不用 Markdown 了，不過我承認自己可能已經在「HTML 極端主義者」的道路上走得太遠了。

怎麼查看生成的 HTML 文件？

Q: How do I view the generated HTML file?

I usually open it locally in a browser (you can even ask Claude to open it for you). If I want to share a link, I just upload it to S3.

我通常直接在本地用瀏覽器打開它（你也可以直接讓 Claude 幫你打開）。如果想把鏈接發給別人，直接傳到雲存儲（比如 S3）上就行。

生成 HTML 不是比 Markdown 慢嗎？

Q: Doesn't it take longer to generate?

Yes! HTML can take 2-4x longer to generate than Markdown, but in my testing, the output is consistently worth the wait.

確實更慢！生成 HTML 的時間可能是生成 Markdown 的 2 到 4 倍。但親身測試下來，生成的結果絕對值得等待。

版本控制怎麼辦？

Q: What about version control?

Honestly, this is one of HTML's biggest pain points. HTML diffs are very messy in version control tools compared to clean Markdown, making code review harder.

老實說，這確實是 HTML 最大的痛點之一。相比清爽的 Markdown，HTML 文件在版本控制工具裏的差異對比 (Diff) 非常雜亂，代碼審查起來比較頭疼。

如何用 HTML 替代計劃文檔？

Q: Is this how you've replaced planning?

I've found that instead of having a single plan, I tend to have a few different HTML files for different parts/stages of the plan. For example, I may make an implementation plan in HTML and then do another file for exploration of UIs, and then finally make an HTML component that lists every design. I tend to keep these files around as references for the future, as well for use in verification.

我發現，相比於維護一個單一的計劃文檔，我更傾向於為計劃的不同部分和階段分別生成幾個 HTML 文件。比如，我可能先做一個實施計劃的 HTML，再做一個 UI 探索的 HTML，最後再做一個列出所有設計方案的 HTML 組件。這些文件我會長期保留，作為未來的參考，也用於驗證環節。

怎麼讓 Claude 生成的頁面符合審美要求？

Q: How do I get Claude to generate pages that look good?

Claude's built-in frontend design capabilities already allow it to generate fairly nice HTML pages. But if you want pages to match your company's brand, you can ask Claude to scan your codebase and generate a design system HTML file. Then you can pass that file as reference whenever you need Claude to generate other HTML pages, and it will maintain a consistent style.

Claude 內置的前端設計能力已經能幫它生成相當不錯的 HTML 頁面了。但如果你想讓頁面完全契合公司的品牌風格，可以讓 Claude 掃描你的代碼庫，生成一個專屬的「設計系統 HTML 文件」。之後，把這個文件作為參考資料丟給 Claude，它在生成其他 HTML 頁面時就能保持高度一致的風格。

五、保持人機協同 / Staying in the Loop with Claude

All of the above is to say that the real reason I use HTML instead of Markdown is that it helps me feel much more in the loop with Claude. As Claude takes on more, I'd noticed I was reading plans less closely, and I wanted a way to stay engaged with its choices rather than just hand them off. HTML turned out to be exactly that. I feel more in the loop now than I ever did before.

說到底，我如此鍾愛 HTML 的根本原因在於：它讓我真切地感覺到，自己依然深度參與在與 Claude 協作的循環之中。隨着 Claude 承擔越來越多的工作，我曾發現自己越來越不認真讀那些計劃文檔了——我想找到一種方式，讓自己能真正參與到它的決策過程中，而不只是把任務交出去了事。HTML 正是這個答案。現在，我感覺自己比以往任何時候都更緊密地參與其中。

*本文原作者為 Thariq Shihipar（Anthropic Claude Code 工程負責人），文章代表其個人觀點與使用偏好。*

*This article was written by Thariq Shihipar, engineering lead for Claude Code at Anthropic, and expresses his personal opinions and affinity for using HTML files with Claude Code.*

參考來源

• Using Claude Code: The Unreasonable Effectiveness of HTML（原文）
• 示例 HTML 文件庫
• Thariq Shihipar X（Twitter）原帖
• Simon Willison 解讀與摘要