HTML5 <section> element – การใช้ section ใน HTML5

section อาจจะเป็น Element ที่คนทำเว็บนำมาใช้แบบผิดๆ ได้อย่างง่าย ถ้าหากทำความเข้าใจแค่ผิวเผินหรือ ดูจากชื่อของ Element เท่านั้น

หลายคนนำ section มาใช้แบ่ง แยก ส่วนของหน้าเว็บออกจากกัน ซึ่งเป็นสิ่งที่ไม่ถูกต้อง แล้วการใช้งานที่ถูกต้องหละ คืออะไร

<section></section> มีไว้เพื่อ แยก ส่วนที่แตกต่างกันของเนื้อหาที่อยู่ใน บทความ ออกจากกัน ไม่ได้มีไว้เพื่อแบ่งหน้า เช่น

<article> 
<hgroup> <h1>ความเชื่อผิดๆ ที่เป็นเหตุให้ได้รับบาดเจ็บจากอุบัติเหตุทางรถจักรยานยนต์</h1>
 <h2>หลากหลายความเชื่อกับการขับขี่โดยไม่สวมหมวกนิรภัย <u>
(หมวกกันน็อค)</u> เป็นเหตุให้ได้รับบาดเจ็บจากอุบัติเหตุ มากกว่าที่ควร</h2> </hgroup> 
<section> 
<h3>ขี่ไปใกล้ๆ ไม่ต้องใส่ก็ได้</h3> <p>จริงๆ แล้ว อุบัติเหตุเกิดขึ้นในรัศมี 1000 เมตร ใกล้บ้านมากที่สุด 
เมื่อเกิดโดยไม่มีหมวก เราก็เจ็บกว่ามีหมวก</p> </section> <section> 
<h3>ไม่ได้ออกถนนใหญ่ ไม่ต้องใส่ก็ได้</h3> 
<p>ตามกฎหมายแล้ว มื่อขับขี่ ไม่ว่าจะไปไหน ใกล้ ไกล ก็ต้องใส่หมวก ถนนใหญ่ ถนนเล็ก 
ไปไร่ ไปนา ไม่ใช่ประเด็น</p> 
<p>เช่นเดียวกัน ผู้ขับขี่ มักสมองไหลในซอยมากกว่าถนนใหญ่</p> 
<p>ผลสำรวจออกมาแนวนี้ น่าจะกลัวพี่จ่า ตามแยก ใต้ต้นไม้ ข้างตู้โทรศัพท์ มากกว่า</p> </section>
<section> <h3>เร่งรีบ ใส่หมวกไม่ทัน</h3> <p>ไม่ว่าจะรีบแค่ไหน 
คนเรายังใส่กางเกงออกจากบ้านทันเหมือนเดิม อันนี้ไม่น่าจะใช่ประเด็น น่าจะเป็นข้ออ้างมากกว่า</p>
 </section> </article>

หมายเหตุ: ข้อมูลด้านบน บางส่วนอ้างอิงจากบทความ 10 ความเชื่อผิดๆ ไม่สวมหมวกกันน็อค โดย นายแพทย์วิทยา ชาติบัญชาชัย

จะเห็นได้ว่า การใช้ section ของ HTML5 นั้น ใช้เฉพาะใน article โดย section มีหน้าที่ แยกเนื้อหาออกเป็นส่วนๆ

คำแนะนำสำหรับการแบ่งหน้าทางด้าน visual media นั้นให้เราใช้ div เพื่อแบ่งหน้า หรือทำเลย์เอ้าท์หน้าเว็บแทน เพราะตามกฎของภาษาแล้ว User agents ประภท Robot ต่างๆ จะไม่ตีความว่า div หมายถึงอะไร เพราะ W3C ได้กำหนดมาตรฐานเอาไว้ย่างนั้นแล้ว

บทความสั้นๆ ขัดตาทัพ อีกแล้วครับพี่น้อง เพราะช่วงนี้ นักปั่นของเรากำลังเมาชีวิตส่วนตัวกันอยู่

มีความสุขกับการใช้ชีวิตครับ