เค้าโครงของเอกสาร HTML5 (Document Outlines)

เค้าโครงของเอกสาร HTML5 (Document Outlines) นั้นแตกต่างจาก HTML4 อย่างสิ้นเชิง ซึ่งเราจำเป็นต้องเรียนรู้เพื่อก่อให้เกิดการใช้งาน HTML5 อย่างถูกต้อง ไม่ใช่แค่การเปลี่ยน Tag เท่านั้น

การจัดโครงสร้างภายในเอกสารที่ถูกต้องจะทำให้การเข้าตีความหมายของเอกสารด้วยอุปกรณ์อื่นๆ เช่น Search Engine ตลอดจน อุปกรณ์อ่านเอกสารสำหรับผู้ที่บกพร่องทางสายตา (ตามมาตรฐาน WCAG) ให้สามารถทำความเข้าใจกับเอกสารได้โดยง่าย โดยเปลี่ยบเทียบกับรูปแบบของ HTML4?ที่เราคุ้นเคยกันดีก่อนเพื่อให้เห็นถึงความแตกต่าง ผมจะเปรียบเทียบให้เห็นระหว่าง HTML4, XHTML และ ?HTML5

HTML4 XHTML HTML5
<HTML>

 

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

<html xmlns=”http://www.w3.org/1999/xhtml”>

<!DOCTYPE html>

<html>

<HEAD>

<TITLE></TITLE>

</HEAD>

 

<head>

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />

<title>Untitled Document</title>

</head>

 

<head>

<title>ชื่อของหน้าเพจนี้</title>

</head>

<BODY>

<h1>เอกสารของฉัน</h1>

<h2>เกี่ยวกับฉัน</h2>

<p>แสดงข้แมูลเกี่ยวกับผู้แต่งที่นี่ เช่น ชื่อ นามสกุล อายุ เพศ</p>

<h3>ฉันทำอะไร</h3>

<p>เกี่ยวกับสิ่งที่ทำ งานที่กำลังทำ.</p>

<h2>ติดต่อฉัน</h2>

<p>ข้อมูลต่างๆเกี่ยวกับผู้แต่ง เช่น ชื่อ ที่อยู่</p>

<BODY>

</HTML>

<body>

<h1>เอกสารของฉัน</h1>

<h2>เกี่ยวกับฉัน</h2>

<p>แสดงข้แมูลเกี่ยวกับผู้แต่งที่นี่ เช่น ชื่อ นามสกุล อายุ เพศ</p>

<h3>ฉันทำอะไร</h3>

<p>เกี่ยวกับสิ่งที่ทำ งานที่กำลังทำ.</p>

<h2>ติดต่อฉัน</h2>

<p>ข้อมูลต่างๆเกี่ยวกับผู้แต่ง เช่น ชื่อ ที่อยู่</p>

<BODY>

</HTML>

<body>

<h1>เอกสารของฉัน</h1>

<h2>เกี่ยวกับฉัน</h2>

<p>แสดงข้แมูลเกี่ยวกับผู้แต่งที่นี่ เช่น ชื่อ นามสกุล อายุ เพศ</p>

<h3>ฉันทำอะไร</h3>

<p>เกี่ยวกับสิ่งที่ทำ งานที่กำลังทำ.</p>

<h2>ติดต่อฉัน</h2>

<p>ข้อมูลต่างๆเกี่ยวกับผู้แต่ง เช่น ชื่อ ที่อยู่</p>

</body>

</html>

จะเห็นได้ว่า เอกสารแบบ HTML นั้น เป็นโครงสร้างแบบพื้นฐานไม่ได้มีการประกาศ?!DOCTYPE ซึ่ง เป็นแทคที่ช่วยบอกถึงมาตรฐานของเอกสาร เพื่อให้เว็บบราวเซอร์ สามารถอ่านข้อมูลได้อย่างถูกต้อง แต่เราจะเห็นว่า โครงสร้างของเอกสาร แบบ XHTML นั้นเยิ่นเย้อ เกินไป ส่วนในเวอร์ชั่นของ HTML5 นั้นเป็นการเขียนแบบง่ายๆกระชับกว่า และจะมีการกำหนดโครงสร้างเอกสารที่ชัดเจนกว่า ดังจะอธิบายต่อไป

1 thought on “เค้าโครงของเอกสาร HTML5 (Document Outlines)

Comments are closed.