HTML vs Markdown untuk AI Agent: Mengapa Tim Anthropic Claude Code Beralih

Pada 8 Mei 2026, Thariq Shihipar — seorang insinyur di tim Claude Code Anthropic — menerbitkan artikel yang menghentikan scroll komunitas pengembang AI. Judulnya: "Using Claude Code: The Unreasonable Effectiveness of HTML."

Dalam 48 jam, artikel ini meraih lebih dari 750.000 tampilan, 14.000 suka, 30.000 bookmark, dan 1.600 quote post di X. Simon Willison menyebutnya menggugah pikiran. Ekosistem pengembang bergemuruh dengan pertanyaan yang belum pernah ditanyakan serius sebelumnya: Bagaimana jika Markdown — format yang selama ini kita gunakan untuk berkomunikasi dengan AI agent — sebenarnya adalah format yang salah?

Jawabannya, didukung oleh galeri 20 artefak HTML produksi yang Thariq terbitkan bersama artikelnya, sedang membentuk ulang cara pengembang berpikir tentang output agent.

Mengapa Markdown Memenangkan Babak Pertama

Untuk memahami mengapa peralihan ini penting, Anda harus memahami mengapa Markdown menjadi default sejak awal.

Pada tahun 2022, ketika ChatGPT diluncurkan dengan jendela konteks 8.192 token, setiap token sangat berharga. Untuk konten yang sama, HTML membakar sekitar tiga kali lebih banyak token daripada Markdown — sekitar 8.000 token untuk dokumen HTML versus 2.800 untuk setara Markdown-nya. Ketika seluruh anggaran konteks Anda adalah 8K token, dan output Anda memakan input Anda, menghemat 5.000 token berarti menyelamatkan paragraf konteks yang seharusnya hilang.

Markdown memenangkan pertarungan itu dalam hal biaya. Itu adalah pilihan rasional mengingat keterbatasan saat itu.

Simon Willison — salah satu suara paling berpengaruh di komunitas pengembang AI — mengakuinya minggu lalu. Dia telah menulis Markdown untuk LLM sejak zaman GPT-4 persis karena alasan itu. Dan dia tidak salah. Tidak ada yang salah, mengingat perhitungan saat itu.

Tapi perhitungannya berubah.

Claude Opus 4.7 hadir dengan jendela konteks 1.000.000 token. Itu 122 kali lebih besar dari jendela 8K yang menjadikan Markdown sebagai default. Ketika anggaran Anda satu juta token, perbedaan antara 2.800 dan 8.000 hanyalah derau. Kendala yang menciptakan default Markdown larut — tetapi default itu sendiri bertahan, tidak dipertanyakan, selama hampir empat tahun.

8 Hal yang Dapat Dibawa HTML yang Tidak Dapat Dibawa Markdown

Artikel Thariq dibuka dengan katalog sederhana tentang apa yang hilang ketika Anda memaksa output agent ke dalam Markdown. Daftarnya layak dibaca selengkapnya, tetapi inilah delapan kategorinya:

1. Tabel nyata dengan perataan dan penggabungan sel. Tabel Markdown rusak pada apa pun di luar grid sederhana. Tabel HTML mendukung penggabungan kolom, penggabungan baris, perataan, dan dapat ditata untuk menyorot baris penting dalam sekejap.

2. Hirarki visual bergaya CSS. Di Markdown, penekanan terbatas pada tebal, miring, dan blok kode. HTML menambahkan warna, ukuran, spasi, batas, dan tata letak — kosakata visual yang membuat informasi mudah dipindai.

3. Diagram SVG inline. Ini yang terbesar. Di Markdown, Claude terpaksa menggunakan seni ASCII: karakter pipa untuk diagram batang, blok unicode untuk sampel warna, tanda hubung untuk panah. Di HTML, ia menggambar grafik vektor nyata — skalabel, presisi, dan benar-benar dapat dibaca.

4. Interaktivitas JavaScript. Bagian yang dapat dilipat, sampel kode bertab, filter langsung, drag-and-drop. Markdown adalah media statis. HTML adalah runtime.

5. Gambar tertanam dalam satu file. Gambar berenkode Base64 ikut dalam HTML. Tidak ada tautan referensi rusak, tidak ada percakapan file-tidak-ditemukan.

6. Tata letak kanvas spasial. Perbandingan berdampingan, tata letak grid, anotasi margin, kotak callout. Markdown mengalir dari atas ke bawah. HTML mengalir ke mana pun Anda mengarahkannya.

7. Diagram alur kerja dengan node yang dapat diklik. Pipeline deploy digambar sebagai kotak dan panah, di mana mengklik satu langkah mengungkapkan apa yang berjalan, waktunya, dan jalur kegagalannya. Markdown memberi Anda daftar bernomor.

8. Artefak mandiri yang dapat dibagikan. Satu file .html. Klik dua kali. Terbuka di browser apa pun, dengan semua diagram, gaya, dan interaktivitas tetap utuh. Tanpa dependensi, tanpa langkah build, tanpa kejutan konfigurasi.

Benang merahnya: Markdown dibangun untuk manusia yang mengetik prosa. HTML dibangun untuk merender informasi kaya. Ketika outputnya adalah rencana, laporan, review, atau prototipe — bukan README — format yang dibangun untuk informasi kaya yang menang.

Pajak Diagram ASCII

Satu contoh dari galeri Thariq menjelaskan maksudnya lebih baik daripada argumen apa pun.

Minta Claude Code untuk menganalisis dataset dan mengeluarkan hasilnya dalam Markdown, dan ia akan menghasilkan sesuatu seperti ini:

Q1 Sales by Region
| Region  | Revenue  |
|---------|----------|
| North   | ████████ | $2.4M
| South   | ██████   | $1.8M
| East    | ████████ | $2.6M
| West    | ████     | $1.2M

Inilah yang dilakukan Claude ketika dipaksa melalui format README tahun 1990-an. Ia berimprovisasi. Ia memalsukan diagram batang dengan karakter blok unicode. Ia menghabiskan token untuk aproksimasi kosmetik alih-alih data.

Tanyakan pertanyaan yang sama dan beri tahu Claude untuk mengeluarkan HTML, dan ia menggambar diagram batang SVG nyata dengan sumbu yang tepat, batang proporsional, label, dan legenda. Data yang sama. Agent yang sama. Tetapi output kedua adalah sesuatu yang benar-benar dibuka, dibaca, dan ditindaklanjuti oleh kolega Anda.

Kami mengujinya sendiri: dataset yang sama, sesi Claude Code yang sama, dua instruksi format yang berbeda. Versi HTML dirender di browser tanpa editan. Versi Markdown membutuhkan tiga putaran klarifikasi — dan akhirnya masih menggunakan karakter blok unicode yang mendekati batang. Ketika format membatasi agent, kualitas output mengikuti.

Tesis Thariq, diringkas: Ketika Anda memberi agent media dengan jangkauan ekspresif, ia menggunakannya. Ketika Anda membatasinya ke ASCII, ia mengkompensasi — dengan buruk.

Debat Biaya Token (Dan Mengapa Tidak Lagi Penting)

Keberatan paling umum terhadap output HTML agent dapat diprediksi: biaya tokennya lebih mahal.

Memang begitu. Thariq transparan tentang ini: output HTML menggunakan sekitar 2 hingga 4 kali token Markdown yang setara. Dokumen Markdown 2.800 token menjadi dokumen HTML 8.000 hingga 11.000 token.

Tetapi keberatan ini, seperti yang ditunjukkan Thariq dan yang lainnya, bersandar pada asumsi yang benar pada tahun 2022 dan sekarang sudah usang. Ketika jendela konteks Anda 8.192 token, overhead 5.000 token sangat menghancurkan. Ketika jendela konteks Anda 1.000.000 token, itu 0,5% dari anggaran Anda.

Claude Opus 4.7, Gemini 3, GPT-5.5 — model frontier pertengahan 2026 semuanya beroperasi dalam rentang ratusan ribu hingga jutaan token. Ekonomi token yang membuat Markdown diperlukan telah digantikan oleh ekonomi kelimpahan yang membuat HTML memungkinkan.

Lebih penting lagi, Thariq berpendapat bahwa biaya token adalah metrik yang salah. Metrik yang tepat adalah apakah outputnya digunakan. Rencana Markdown 2.800 token yang tidak dibaca siapa pun menghabiskan segalanya dan tidak memberikan apa-apa. Rencana HTML 8.000 token yang dibuka, dipahami, dan ditindaklanjuti menghabiskan lebih banyak token dan memberikan nilai.

5 Kasus Penggunaan Produksi Di Mana HTML Mengalahkan Markdown

Galeri 20 artefak HTML Thariq mencakup sembilan kategori. Lima ini adalah yang dapat digeneralisasi melampaui Claude Code ke alur kerja AI agent mana pun:

1. Spesifikasi dan Rencana Implementasi

Perbedaan antara spesifikasi Markdown dan spesifikasi HTML adalah perbedaan antara dinding teks dan dokumen dengan timeline, diagram aliran data, mockup inline, dan tabel risiko dengan tingkat keparahan berkode warna. Pengimplementasi Anda membuka yang kedua. Mereka membaca sekilas yang pertama.

2. Review Kode AI

Diff yang dirender dengan anotasi margin, tag tingkat keparahan, dan tautan lompat secara fundamental lebih mudah dipindai daripada menggulir melalui terminal. Versi HTML juga mendukung rendering berdampingan sebelum/sesudah — tata letak spasial yang menyampaikan perubahan lebih efisien daripada format sekuensial mana pun.

3. Desain dan Prototipe

HTML adalah media tempat sistem desain Anda dikirimkan. Token menjadi sampel warna. Komponen menjadi lembar kontak. Sandbox animasi dengan slider untuk durasi dan easing memberi tahu Anda dalam lima detik apa yang tidak pernah bisa disampaikan oleh satu paragraf prosa. Empat layar yang terhubung dengan perilaku klik nyata adalah prototipe yang dapat Anda rasakan, bukan hanya dibaca.

4. Riset dan Laporan

Penjelasan dengan bagian yang dapat dilipat, sampel kode bertab, dan glosarium di margin dibaca secara berbeda dari kata-kata yang sama yang dibuang secara linear. Laporan status mingguan dengan grafik kecil dan timeline berwarna mengubah sesuatu yang dibaca sekilas menjadi sesuatu yang benar-benar dibaca orang. Post-mortem dengan timeline menit demi menit dan kutipan log adalah dokumen yang dirujuk tim Anda, bukan diabaikan.

5. Antarmuka Pengeditan Kustom

Ini adalah kategori paling radikal. Thariq mendemonstrasikan editor HTML sekali pakai — papan triase tiket tempat Anda menyeret 30 tiket melintasi Now, Next, Later, dan Cut, dan mengekspor hasilnya sebagai Markdown; editor feature flag dengan peringatan dependensi dan tombol salin diff; penyetel prompt dengan rendering ulang langsung.

Ini bukan produk. Ini adalah alat sekali pakai yang dibuat sesuai permintaan, digunakan sekali, dan dibuang. Kategori artefak itu tidak ada di Markdown. Itu hanya ada ketika agent memiliki akses ke HTML, CSS, dan JavaScript sebagai primitif output.

Alasan Sebenarnya: Saya Berhenti Membaca Rencana Markdown

Tersembunyi di dekat akhir analisis video oleh DIY Smart Code adalah kalimat yang menjelaskan seluruh peralihan:

Saya berhenti membaca rencana markdown dan membiarkan Claude membuat setiap pilihan.

Ini adalah alasan sebenarnya Thariq untuk beralih — dan ini lebih penting daripada jumlah token, fidelitas SVG, atau perbandingan fitur apa pun.

Ketika output agent adalah dinding Markdown yang tidak dapat dibaca, manusia keluar dari loop. Anda tidak meninjau rencananya. Anda tidak menangkap kesalahannya. Anda tidak menerapkan penilaian Anda. Anda hanya mengatakan sepertinya bagus dan langsung deploy — atau lebih buruk, Anda bahkan tidak membuka filenya. Agent bekerja dengan baik. Formatnya membuat pekerjaannya tidak terlihat. Ini adalah dinamika yang sama di balik kesenjangan kemampuan yang membatasi apa yang dapat diberikan AI agent saat ini: outputnya secara teknis benar tetapi secara praktis tidak dapat digunakan karena formatnya tidak mencapai manusia yang membutuhkannya.

Output HTML membalikkan dinamika ini. Ketika outputnya visual, terstruktur, dan dapat dipindai, manusia masuk kembali ke loop. Anda melihat diagram dan berpikir aliran itu salah. Anda membuka bagian yang dapat dilipat dan menangkap asumsi yang salah. Anda menyeret tiket di papan triase dan menyesuaikan prioritas. Format menentukan apakah manusia tetap dalam proses keputusan atau mendelegasikan sepenuhnya.

Ini adalah argumen yang seharusnya paling penting bagi siapa pun yang membangun alur kerja berbantuan AI. Tujuannya bukan untuk meminimalkan biaya token. Tujuannya adalah untuk memaksimalkan kualitas kolaborasi manusia-agent. Dan format yang membuat kolaborasi lebih mudah adalah format yang menghasilkan hasil yang lebih baik — terlepas dari jumlah token.

Cara Mempublikasikan HTML yang Dihasilkan AI

Setelah agent Anda menghasilkan file HTML mandiri — laporan riset dengan grafik SVG, review kode dengan diff beranotasi, prototipe dengan layar yang dapat diklik — Anda menghadapi pertanyaan kedua: di mana ia tinggal?

File .html di sistem file lokal Anda hanya berguna untuk Anda. Nilai output agent berlipat ganda ketika memiliki URL — ketika Anda dapat membagikannya dengan tim, menyematkannya di thread Slack, atau mengirimkannya ke pemangku kepentingan. AI agent yang dapat menulis HTML tetapi tidak dapat mempublikasikannya seperti penulis yang dapat membuat draf tetapi tidak dapat mencetak. Outputnya ada, tetapi tidak mencapai siapa pun.

Berikut adalah tiga pendekatan yang digunakan pengembang saat ini, dari yang paling manual hingga yang paling otomatis:

GitHub Pages

Push ke repo, tunggu build CI, dapatkan URL. Bekerja baik untuk halaman dokumentasi permanen dan situs proyek. Berlebihan untuk laporan sekali pakai yang dihasilkan agent Anda pagi ini. Membutuhkan commit Git untuk setiap publikasi — yang berarti agent memerlukan akses repo, dan setiap artefak sekali pakai menciptakan riwayat permanen.

Upload Cloud Manual (S3, R2)

Unggah file HTML ke bucket, konfigurasikan akses publik, kelola CORS, tangani invalidasi cache. Ini berfungsi, tetapi ini adalah pekerjaan infrastruktur — hal yang Anda inginkan ditangani oleh agent agar Anda tidak perlu melakukannya. Jika Anda mengonfigurasi kebijakan bucket untuk mempublikasikan laporan agent, otomatisasinya sudah rusak.

Platform Publikasi Native Agent

Kategori ketiga dibangun khusus untuk alur kerja yang dijelaskan Thariq: agent menghasilkan output, dan lapisan publikasi menangani segalanya tanpa campur tangan manusia.

Platform ini dirancang untuk akses terprogram — tanpa dasbor web, tanpa konfigurasi manual, tanpa login CMS. Mereka menerima konten melalui CLI atau API, merendernya, dan mengembalikan URL publik. Agent tetap mengendalikan seluruh pipeline.

Misalnya, platform seperti AnyCap memberi agent serangkaian kemampuan yang membentuk pipeline publikasi lengkap — pola yang sama yang dibahas dalam panduan penerbitan web instan dengan AI kami:

• Penyimpanan cloud (Drive) — agent mengunggah gambar yang dihasilkan, ekspor CSV, dan aset lainnya ke penyimpanan cloud persisten. Tidak ada jalur file rusak. Tidak ada langkah unggah manual.
• Deployment halaman — satu perintah mengubah file HTML atau Markdown menjadi halaman web publik yang aktif. anycap page deploy report.html --title "Analisis Q2" adalah seluruh langkah publikasi.
• Dukungan multi-format — platform merender Markdown dan HTML secara native. Agent dapat memulai dengan Markdown untuk kecepatan dan beralih ke HTML saat membutuhkan diagram SVG, tabel bergaya, atau elemen interaktif — semuanya di-deploy melalui perintah yang sama.
• CLI terpadu — alat yang sama yang mempublikasikan halaman juga menangani pencarian web, pembuatan gambar, dan web crawling. Agent tidak berganti-ganti antara lima layanan untuk menyelesaikan satu tugas. Ia meneliti, membuat grafik, dan mempublikasikan dari satu runtime.

Berikut adalah tampilan pipeline lengkap dalam praktik:

# 1. Agent meneliti topik
anycap search --prompt "Data kinerja Q2 terbaru" --json > research.json

# 2. Agent menghasilkan grafik utama sebagai SVG
anycap image generate --prompt "Diagram batang pendapatan Q2, gaya korporat bersih" \
  --model nano-banana-2 -o chart.png

# 3. Agent mengunggah aset ke penyimpanan cloud
anycap drive upload chart.png

# 4. Agent menulis laporan sebagai HTML mandiri
# (Claude Code mengeluarkan file HTML dengan grafik tertanam)

# 5. Agent mempublikasikan halaman — satu perintah, URL aktif
anycap page deploy q2-report.html \
  --title "Laporan Kinerja Q2 2026" \
  --description "Analisis kuartalan yang dihasilkan AI dengan grafik interaktif"

Tidak ada manusia yang menyentuh CMS. Tidak ada hosting yang dikonfigurasi. Agent meneliti, membuat visual, dan mempublikasikan — semuanya melalui satu CLI.

Pendekatan Mana yang Harus Anda Gunakan?

Pilihan yang tepat tergantung pada alur kerja Anda. Jika agent Anda menghasilkan 10 laporan per minggu yang perlu dibagikan dengan tim, lapisan publikasi native agent langsung terbayar. Jika Anda mempublikasikan satu halaman per bulan, GitHub Pages sudah cukup.

Peralihan format — Markdown ke HTML — dan peralihan distribusi — file lokal ke URL aktif — adalah dua sisi dari koin yang sama. Satu membuat output layak dibaca. Yang lain membuatnya layak dibagikan.

Kapan Menggunakan HTML vs Markdown untuk Output Agent

Peralihan ke HTML bukanlah hal yang dogmatis. Beberapa output lebih baik sebagai Markdown. Kerangka keputusannya sederhana:

Aturan praktis yang diusulkan Thariq secara implisit: jika Anda mengharapkan manusia membacanya, pertimbangkan HTML. Jika murni mesin-ke-mesin, Markdown sudah cukup.

Intinya

Markdown menjadi format default untuk output AI agent bukan karena itu format terbaik, tetapi karena itu format termurah di era keterbatasan token yang parah. Era itu sudah berakhir.

Peralihan yang diadvokasi Thariq Shihipar — dan didemonstrasikan dengan 20 artefak produksi — sebenarnya bukan tentang HTML versus Markdown. Ini tentang apakah kita memperlakukan output AI agent sebagai sesuatu yang diurai oleh mesin atau sesuatu yang dikonsumsi oleh manusia. Selama empat tahun, kita mengoptimalkan untuk yang pertama karena ekonomi memaksa kita. Ekonomi tidak lagi memaksa kita.

Agent semakin baik. Jendela konteks semakin besar. Output semakin kompleks. Sudah waktunya format mengejar.

Ditulis oleh tim AnyCap. Kami menganalisis alat, format, dan alur kerja yang membentuk cara pengembang membangun dengan AI agent.

Bacaan lebih lanjut:

• Galeri artikel asli Thariq Shihipar: 20 contoh efektivitas HTML
• Thread X Thariq mengumumkan artikelnya
• Analisis video DIY Smart Code: Markdown Killed My AI Workflow (HTML Fixed It)