วงการ AI สั่นสะเทือน! วิศวกรของ Anthropic กล่าวว่า HTML เหมาะกับผลลัพธ์ของ AI มากกว่า Markdown, Karpathy กดไลก์

เมื่อเร็วๆ นี้ วิศวกรของ Anthropic คนหนึ่งได้เขียนบทความ主张ให้ AI ส่งออก HTML ดีกว่าใช้ Markdown ซึ่งมุมมองนี้ได้รับ Like จาก Karpathy อย่างรวดเร็ว เชื่อว่าหลายคนคงคุ้นเคยกับคำกล่าวที่ว่า “HTML ดีกว่า Markdown” กันแล้ว บน GitHub มีโปรเจกต์โอเพนซอร์สชื่อ html-effectiveness ที่น่าสนใจและควรค่าแก่การศึกษาอย่างยิ่ง แม้จำนวนดาวจะไม่มาก แต่ช่วยให้เราเข้าใจอย่างชัดเจนว่าทำไม HTML ถึงมีข้อได้เปรียบ

ด้านล่างนี้คือบทสรุปมุมมองของ Thariq และ Karpathy ซึ่งผมเห็นด้วยเป็นการส่วนตัว ในระยะยาว นี่อาจเป็นแนวโน้มจริงๆ

แต่ในขณะนี้ Markdown ยังคงไม่สามารถถูกแทนที่ได้ ทั้งสองต่างมีข้อดีข้อเสีย

ท้ายที่สุดแล้ว ต้องตัดสินใจตามสถานการณ์เฉพาะ

HTML ก็มีปัญหาบางอย่างเช่นกัน มันมีข้อมูลแท็ก ซึ่งอาจทำให้เกิดต้นทุนเพิ่มเติมและส่งผลต่อประสิทธิภาพ

ปัจจุบัน ไม่ใช่ทุกคนที่ใช้โมเดลระดับท็อปอย่าง Opus 4.7 ที่มีหน้าต่างบริบท 1 ล้าน

แม้อีกไม่นาน หน้าต่างบริบท 1 ล้านจะกลายเป็นมาตรฐานของผู้ผลิตโมเดลต่างๆ

ยิ่งไปกว่านั้น ระบบนิเวศของ Markdown นั้นลึกซึ้งกว่าที่เราคิด ตัวอย่างเช่น ไฟล์ Readme ต่างๆ และผลิตภัณฑ์เอกสารจำนวนมากรองรับรูปแบบนี้

นอกจากนี้ HTML ยังมีหลุมพรางที่ Markdown ไม่มี เช่น ค่าใช้จ่ายในการบำรุงรักษา: การแก้ไข HTML ด้วยตนเองยากกว่า Markdown ถึง 10 เท่า

เมื่อ HTML ที่ AI สร้างขึ้นไม่ถูกต้องนัก เกณฑ์ในการปรับแต่งด้วยตนเองของคุณจะสูงมาก

อีกประการคือปัญหาการขาดตอนของห่วงโซ่เครื่องมือ การดูการเปลี่ยนแปลง HTML ใน Git diff แทบจะอ่านไม่ได้ เมื่อทำ Code Review ความสามารถในการอ่านของ HTML กลับแย่กว่า Markdown

หากเป็นผลผลิตระหว่างทางของ Agent อาจยังต้องใช้ Markdown หากเป็นผลิตภัณฑ์สุดท้ายหรือการเปรียบเทียบแผน HTML เหมาะสมกว่าจริงๆ

ข้อได้เปรียบที่แท้จริงของ Markdown ไม่ใช่ว่ามนุษย์อ่านง่าย แต่เป็นว่า AI สามารถประมวลผลได้อย่างมีประสิทธิภาพ

01

การอภิปรายล่าสุด

Thariq Shihipar วิศวกรทีม Claude Code เขียนบทความยาว พร้อมหัวข้อที่สะเทือนอารมณ์: The Unreasonable Effectiveness of HTML

แก่นหลักมีเพียงข้อเดียว: ในยุค AI Agent HTML กำลังแทนที่ Markdown กลายเป็นรูปแบบการสื่อสารที่มีประสิทธิภาพสูงสุดระหว่างมนุษย์กับ AI

Andrej Karpathy แชร์และแสดงความคิดเห็นต่อทวีตนี้ เขาบอกว่าเขาก็ทำแบบนี้มาโดยตลอด และแบ่งปันมุมมองที่กว้างขึ้น:

สมองมนุษย์ประมาณหนึ่งในสามของพลังการประมวลผลถูกใช้เพื่อประมวลผลข้อมูลภาพ การมองเห็นคือทางหลวงสิบเลนที่ข้อมูลเข้าสู่สมองของมนุษย์

ดังนั้น ผลลัพธ์ของ AI ไม่ควรเป็นเพียงกองข้อความ แต่ควรเป็นเนื้อหาที่มีสีสัน เค้าโครง และการโต้ตอบ

02

ทำไม Markdown ถึงไม่เพียงพอ

Thariq คิดว่า Markdown ได้รับความนิยมด้วยเหตุผล: ง่าย ทั่วไป น้ำหนักเบา

Claude ถึงขนาดสามารถวาดรูปด้วยรหัส ASCII ใน Markdown ได้

แต่ปัญหาคือ เมื่อ AI Agent มีความสามารถมากขึ้น spec, plan, report ที่มันส่งออกก็ยาวขึ้นเรื่อยๆ

สำหรับไฟล์ Markdown ที่เกิน 100 บรรทัด เขาแทบจะไม่อ่านจนจบ และไม่มีใครในทีมของเขาอยากอ่าน

ยิ่งไปกว่านั้น ไฟล์ยาวๆ เหล่านี้ปัจจุบันแทบจะไม่ได้ถูกแก้ไขโดยมนุษย์อีกต่อไป แต่ให้ Claude เป็นคนแก้ไข

Thariq คิดว่าข้อได้เปรียบที่ใหญ่ที่สุดของ Markdown คือความสะดวกในการแก้ไขด้วยตนเอง ซึ่งหายไปโดยสิ้นเชิง

ในยุค Agent Markdown กลายเป็นข้อจำกัด

03

HTML ทำอะไรที่ Markdown ทำไม่ได้

Thariq ยกตัวอย่างความสามารถที่เหนือชั้นของ HTML เมื่อเทียบกับ Markdown:

การนำเสนอข้อมูลด้วยตาราง การควบคุมการออกแบบด้วย CSS การวาดภาพด้วย SVG การฝังโค้ดด้วยแท็ก script การทำอินเทอร์แอคทีฟด้วยองค์ประกอบ HTML การจัดวางพื้นที่ด้วย absolute positioning การวาดภาพด้วย canvas การใส่รูปภาพด้วยแท็ก img

คำพูดของเขาคือ: แทบไม่มีข้อมูลประเภทใดที่ HTML ไม่สามารถแสดงออกได้

เขายกตัวอย่างสถานการณ์การใช้งานจริง:

การสำรวจและวางแผน เมื่อไม่แน่ใจในทิศทาง ให้ Claude สร้างแผนที่แตกต่างกัน 6 แบบในคราวเดียว วางในหน้า HTML เดียวกันเพื่อเปรียบเทียบเคียงข้างกัน แทนที่จะอ่านกำแพงข้อความสามแห่งแล้วเปรียบเทียบในหัว

การตรวจสอบโค้ด HTML สามารถเรนเดอร์ diff, คำอธิบายประกอบ, ผังงาน, ผังโมดูล Thariq บอกว่าตอนนี้ทุก PR ของเขาจะมีไฟล์ HTML สำหรับอธิบายโค้ดแนบไปด้วย ซึ่งใช้งานได้ดีกว่ามุมมอง diff เริ่มต้นของ GitHub มาก

ต้นแบบการออกแบบ 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 เลือกใช้ในการส่งออกข้อมูลให้มนุษย์

สมองมนุษย์ประมาณหนึ่งในสามของพลังการประมวลผลถูกใช้เพื่อประมวลผลข้อมูลภาพ การมองเห็นคือทางหลวงสิบเลนที่ข้อมูลเข้าสู่สมอง

เขาวาดเส้นทางวิวัฒนาการ:

① ข้อความล้วน อ่านยาก
② Markdown มีตัวหนา ตัวเอียง หัวข้อ ตาราง อ่านง่ายขึ้นเล็กน้อย นี่คือรูปแบบเริ่มต้นในปัจจุบัน
③ HTML แม้เบื้องหลังจะเป็นโค้ด แต่มีอิสระด้านกราฟิก เค้าโครง และแม้แต่การโต้ตอบมากขึ้น กำลังกลายเป็นตัวเลือกเริ่มต้นใหม่
④ อนาคตที่ไกลออกไป วิดีโอประสาทแบบโต้ตอบ การจำลอง เทคโนโลยียังไม่สมบูรณ์ แต่ทิศทางชัดเจน

Karpathy ยังให้คำแนะนำการใช้งานที่ใช้ได้จริง: เพิ่มประโยค structure your response as HTML ต่อท้าย prompt จากนั้นเปิดไฟล์ที่สร้างขึ้นในเบราว์เซอร์

ผลลัพธ์จะดีขึ้นมาก เขายังลองให้ LLM สร้างผลลัพธ์เป็นสไลด์

Simon Willison ก็ยืนยันวิธีนี้เช่นกัน

เขาใช้ GPT-5.5 ใส่สคริปต์ยกระดับสิทธิ์ Python ที่ถูกทำให้สับสนจากเว็บไซต์ copy.fail ให้ AI สร้างคำอธิบายโดยละเอียดในรูปแบบ HTML ผลลัพธ์คือเอกสารเทคนิคที่สวยงามพร้อมแถบด้านข้าง คำอธิบายประกอบโค้ด การทำเครื่องหมายสี และการแยกขั้นตอน

05

วิธีเริ่มต้น

Thariq เน้นย้ำเป็นพิเศษ: ไม่ต้องตั้งค่าหรือทักษะที่ซับซ้อน

คุณแค่พูดใน prompt ว่า make a HTML file หรือ make a HTML artifact ก็พอ

ประเด็นสำคัญไม่ได้อยู่ที่วิธีสร้าง แต่อยู่ที่คุณต้องการใช้ HTML นี้ทำอะไร

Prompt ที่ใช้ได้ทันที:

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 สร้างแกลเลอรีตัวอย่าง ซึ่งรวบรวมไฟล์ HTML 20 ไฟล์ ครอบคลุมสถานการณ์การใช้งาน 9 ประเภท ได้แก่ การสำรวจวางแผน การตรวจสอบโค้ด การออกแบบ ต้นแบบ แผนภูมิ สไลด์ การวิจัยเรียนรู้ รายงาน และโปรแกรมแก้ไขแบบกำหนดเอง

นี่คือโปรเจกต์โอเพนซอร์สที่กล่าวถึงข้างต้น

ที่อยู่ GitHub: https://github.com/ThariqS/html-effectiveness
ที่อยู่แกลเลอรีตัวอย่าง: https://thariqs.github.io/html-effectiveness/

06

สรุปสั้นๆ

ผมคิดว่าคำพูดของ Thariq ที่เป็นแก่นแท้ที่สุดของทั้งบทความคือ:

ก่อนหน้านี้ฉันกังวลว่าตัวเองจะค่อยๆ ถอยห่างจากการตัดสินใจเพราะไม่อ่านแผน แต่ตั้งแต่ใช้ HTML ฉันรู้สึกว่าตัวเองมีส่วนร่วมในการทำงานร่วมกับ AI อย่างลึกซึ้งยิ่งกว่าที่เคย

ไม่ใช่เพื่อความสวยงามหรืออวดฝีมือ

แต่เป็นเพราะ HTML ทำให้มนุษย์เห็นจริงๆ ว่า AI กำลังทำอะไรอยู่ จึงสามารถควบคุมการตัดสินใจได้

แม้เวลาสร้างจะนานกว่า — HTML ช้ากว่า Markdown 2 ถึง 4 เท่า — แต่เมื่อพิจารณาว่าโอกาสที่คุณจะอ่านมันจริงๆ เพิ่มขึ้นหลายเท่า การคำนวณนี้ก็คุ้มค่าไม่ว่าจะมองมุมไหน

การใช้หน้าต่างบริบท 1 ล้านของ Opus 4.7 ค่าใช้จ่าย token ที่เพิ่มขึ้นแทบจะไม่ต้องนับ

07

คลิกการ์ดด้านล่าง ติดตาม逛逛 GitHub

บัญชี公众号นี้เคยเผยแพร่โปรเจกต์โอเพนซอร์สที่น่าสนใจมากมาย หากคุณขี้เกียจเลื่อนหาบทความทีละบทความ สามารถติดตาม公众号: 逛逛 GitHub โดยตรง แล้วสนทนาที่后台: