TL;DR
Thariq từ Anthropic chia sẻ lý do tại sao HTML là output format tốt hơn Markdown cho Claude Code. HTML cho phép rich visualization, interactive elements, và dễ chia sẻ hơn — trong khi Markdown đang trở thành giới hạn khi agents ngày càng mạnh.
📰 Vấn đề: Markdown đang trở thành giới hạn
Markdown đã trở thành format chính để agents giao tiếp với con người. Nó đơn giản, portable, có khả năng rich text cơ bản và dễ edit. Claude thậm chí còn giỏi dùng ASCII để vẽ diagram trong markdown.
Nhưng khi agents ngày càng mạnh, Thariq cảm thấy Markdown đang trở thành format hạn chế. File markdown >100 dòng rất khó đọc. Anh muốn richer visualizations, màu sắc, diagram — và khả năng chia sẻ dễ dàng.
🚀 Tại sao HTML?
Information Density
HTML có thể truyền tải thông tin phong phú hơn Markdown:
- Tabular data với tables
- Design data với CSS
- Illustrations với SVG
- Code snippets với script tags
- Interactions với JavaScript + CSS
- Workflows với SVG và HTML
- Spatial data với absolute positions và canvases
- Images với image tags
Thariq nói: "Gần như không có tập thông tin nào Claude đọc được mà bạn không thể represent hiệu quả với HTML."
Visual Clarity & Ease of Reading
HTML documents dễ đọc hơn. Claude có thể organize structure visually với tabs, illustrations, links — thậm chí mobile responsive. Khả năng ai đó đọc spec, report hay PR writeup của bạn cao hơn rất nhiều nếu nó ở dạng HTML.
Ease of Sharing
Markdown khó share vì hầu hết browsers không render chúng natively. HTML thì upload lên S3 là có link share ngay — colleagues mở ở bất kỳ đâu.
Two-way Interaction
HTML cho phép tương tác: sliders, knobs để adjust design, tweak options trong algorithm để xem kết quả. Bạn cũng có thể copy changes vào prompt để paste lại Claude Code.
🎯 Use Cases cụ thể
Specs, Planning & Exploration
Thay vì markdown plan đơn giản, Thariq tạo một web của HTML files. Ví dụ prompt:
"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."
Code Review & Understanding
HTML có thể render diffs, annotations, flowcharts, modules. Thariq attach HTML code explainer vào mọi PR.
"Help me review this PR by creating an HTML artifact. 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."
Design & Prototypes
HTML là rich canvas cho Claude để explore visual designs, mockups, và interactive prototypes.
🔧 Cách bắt đầu
Thariq nhấn mạnh: bạn không cần skill phức tạp. Chỉ cần prompt Claude: "make a HTML file" hoặc "make a HTML artifact". Trick là biết bạn muốn artifact làm gì và cách dùng nó.
Chốt một câu
Markdown vẫn có vị trí cho quick notes và simple docs. Nhưng khi bạn cần rich visualization, interactive elements, và khả năng chia sẻ — HTML là lựa chọn tự nhiên. Đặc biệt khi bạn ngày càng ít edit file bằng tay mà dùng chúng như specs, reference, brainstorming outputs. HTML không phải thay thế Markdown, mà là nâng cấp khi cần nhiều hơn text.