HTML ต้นฉบับ
ตัวเลือก
HTML ที่จัดรูปแบบแล้ว
เกี่ยวกับเครื่องมือนี้
เครื่องมือนี้จัดรูปแบบหรือบีบอัดโค้ด HTML ตามที่ต้องการ โหมด Beautify เพิ่มการเยื้องและขึ้นบรรทัดใหม่ที่เหมาะสมเพื่อให้อ่านองค์ประกอบที่ซ้อนกันได้ชัดเจน โหมด Minify ลบช่องว่างและอักขระที่ไม่จำเป็นเพื่อลดขนาดไฟล์ ตัวตรวจสอบจับปัญหาทั่วไปเช่นแท็กที่ไม่ปิดหรือองค์ประกอบที่ไม่ตรงกัน CSS และ JavaScript แบบ inline จะถูกบีบอัดด้วย ทุกอย่างทำงานในเบราว์เซอร์—ไม่มีอะไรถูกส่งไปยังเซิร์ฟเวอร์
วิธีใช้งาน
- วาง HTML หรืออัปโหลดไฟล์
- เลือก Beautify เพื่อจัดรูปแบบพร้อมการเยื้อง หรือ Minify เพื่อบีบอัด
- ปรับการตั้งค่า: ขนาดการเยื้อง (2/4 ช่องว่างหรือแท็บ) ลบคอมเมนต์ บีบอัด CSS/JS แบบ inline
- ผลลัพธ์อัปเดตอัตโนมัติเมื่อพิมพ์หรือเปลี่ยนการตั้งค่า
- คัดลอกผลลัพธ์หรือดาวน์โหลดเป็นไฟล์
กรณีการใช้งานทั่วไป
- Debug HTML จากผู้ให้บริการ: ได้โค้ดบรรทัดเดียวจาก CMS หรือ build tool? จัดรูปแบบเพื่อดูเนื้อหา
- ปรับให้เหมาะสมสำหรับ production: ลด HTML 15-30% ก่อน deploy
- Code review: จัดรูปแบบ HTML ให้สม่ำเสมอเพื่อให้ diff แสดงเฉพาะการเปลี่ยนแปลงจริง
- เรียนรู้ HTML: วาง markup ที่ซับซ้อนและจัดรูปแบบเพื่อเข้าใจโครงสร้าง
- เทมเพลตอีเมล: บีบอัด HTML อีเมลเพื่อให้อยู่ในขีดจำกัดขนาด
ข้อจำกัด
- นี่คือ formatter ตามไวยากรณ์ ไม่ใช่ parser HTML เต็มรูปแบบ—กรณีพิเศษเช่น CDATA sections หรือ server-side includes อาจไม่จัดรูปแบบได้สมบูรณ์
- ตัวตรวจสอบจับปัญหาโครงสร้าง (แท็กที่ไม่ปิด) แต่ไม่ตรวจสอบความสอดคล้องกับ spec HTML5
- ไฟล์ขนาดใหญ่มาก (5MB+) อาจทำให้เบราว์เซอร์ช้าลง
- ช่องว่างใน pre/code/textarea จะถูกรักษาในโหมด beautify แต่อาจยุบในโหมด minify—ตรวจสอบด้วยตนเอง
- ไวยากรณ์ template (Jinja, Handlebars, Blade) อาจทำให้เกิดคำเตือนการตรวจสอบ