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

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

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

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

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

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

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

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

(Visited 2,698 times, 4 visits today)

Leave a Reply