การใช้ <!DOCTYPE html> ใน HTML
<!DOCTYPE html> คือคำสั่งประกาศชนิดของเอกสาร (Document Type Declaration) ที่ต้องอยู่บรรทัดแรกสุดของไฟล์ HTML
หน้าที่คือ บอกเว็บเบราว์เซอร์ว่าเอกสารนี้ใช้มาตรฐาน HTML5 เพื่อให้แสดงผลเว็บเพจได้อย่างถูกต้อง
ตัวอย่าง
<!DOCTYPE html>
<html>
<head>
<title>My Website</title>
</head>
<body>
<h1>Hello World</h1>
</body>
</html>
ทำไมต้องใช้
- บอกเบราว์เซอร์ให้ใช้มาตรฐาน HTML5
- ป้องกันการแสดงผลผิดพลาด
- ทำให้เว็บไซต์รองรับเบราว์เซอร์สมัยใหม่
- เป็นโครงสร้างพื้นฐานของทุกหน้าเว็บ
หากไม่ใส่จะเกิดอะไรขึ้น
เบราว์เซอร์อาจเข้าสู่ Quirks Mode (โหมดเข้ากันได้กับเว็บเก่า) ทำให้
- CSS แสดงผลผิด
- Layout เพี้ยน
- ขนาดองค์ประกอบไม่ตรง
- พฤติกรรม JavaScript บางส่วนอาจต่างกัน
สรุป
<!DOCTYPE html>
- ต้องอยู่บรรทัดแรกสุดของไฟล์
- ใช้กับ HTML5
- ไม่ใช่แท็ก HTML
- ช่วยให้เว็บแสดงผลตามมาตรฐาน
Workshop ทดลอง
<!DOCTYPE html>
<html>
<head>
<title>DOCTYPE Example</title>
</head>
<body>
<h1>เรียน HTML</h1>
<p>นี่คือการใช้งาน DOCTYPE</p>
</body>
</html>
คำจำง่ายๆ:
<!DOCTYPE html> = "ประกาศให้เบราว์เซอร์รู้ว่าไฟล์นี้เป็น HTML5" 🚀
