html5 ยังน่าใช้ div อยู่

ถึงแม้ว่า html5 จะมี element ใหม่ๆ มาให้เราได้ใช้ ไม่ว่าจะเป็น <article>, <section>, หรือ <aside> แต่นั่นก็ไม่ได้หมายความว่าในเว็บไซต์ที่เขียนด้วย html5 จะไม่มี <div> เลย

ใน html4 นั้น เราจะใช้ <div>จัดโครงสร้างของเว็บเพจ ด้วยการ mark up element ที่มีความหมายคล้ายๆ กัน ให้เป็นกลุ่ม โดยอาจจะใส่ id หรือ class เอาไว้เพื่อบอกว่ากลุ่มของ element นี้คืออะไร เพราะตัว <div> เองนั้น ไม่มีความหมาย

ใน html5 <div> ยังคงเหมือนเดิม ตรงข้ามกับ element ใหม่ๆ ที่มีความหมายในตัวของมันเอง ซึ่งเราจะใช้ element เหล่านี้ แทนที่การใช้ <div> แบบเดิม ดังนี้

<div class="header">
    This is a header.
</div>

จะเห็นว่า การใช้ <div> แบบนี้ ไม่มีความหมาย ซึ่งใน html5 เราจะใช้ element ใหม่ ซึ่งก็คือ <header> แทน <div class=”header”>

<header>
    This is a header.
</header>

แต่ในบางส่วน เรายังคงต้องใช้ <div> อยู่ครับ ซึ่งผมมีหลักง่ายๆ ในการดูว่า element นั้นๆ ควรใช้ <div> หรือไม่ โดยการดูว่ามี element ไหน ใน html5 ที่มีความหมายเหมาะสมกับ element ของเราบ้างครับ

• header
• footer
• aside
• article
• section
• figure
• nav

หาก element ของเรา ไม่มีความหมายตรงกับ element ใดๆ เลย ให้เราใช้ <div> ครับ