HTML5 figure และ figcaption

<figure> เป็น tag ใหม่ที่มากับ HTML5 อีกเช่นกัน โดยทั่วๆไปเรามักนึกว่า figure จะใช้กับรูปภาพเท่านั้น แต่โดยความหมายของ figure ที่แท้จริงแล้วจะใช้กับ "ส่วนที่ต้องการให้มองเห็นเป็นภาพ" ซึ่งไม่ได้หมายถึงแต่รูปภาพเท่านั้น เช่น ใช้กับรูปภาพประกอบบทความ ส่วนแสดงโค้ด ตัวอย่าง บทกวี และมันยังใช้ร่วมกับ tag <figcaption> เพื่อระบุความหมายเพิ่มเติม หรือ คำอธิบายภาพได้ด้วย เช่น

<figure>

  <img src="พระอภัยมณี.jpg" alt="คำทดแทนรูปภาพหากมองไม่เห็นรูปภาพ">

  <figcaption>คำอธิบายภาพที่ผู้ใช้มองเห็นได้</figcaption>

</figure>

หรือ

<figure>

  แล้วสอนว่าอย่าไว้ใจมนุษย์  มันแสนสุดลึกล้ำเหลือกำหนด<br>ถึงเถาวัลย์พันเกี่ยวที่เลี้ยวลด   ก็ไม่คดเหมือนหนึ่งในน้ำใจคน

  <figcaption>จากบทประพันธ์ พระอภัยมณี</figcaption>

</figure>

หมายเหตุ figure จะไม่ใช้กับรูปภาพสำหรับตกแต่งเว็บไซต์นะครับ เพราะตัว figure เองจะใช้สำหรับอธิบายเพิ่มเติมจากเนื้อหาหลักเท่านั้น