แท็ก <footer> เป็น Semantic Element ใน HTML5 ใช้สำหรับกำหนดส่วนท้าย (footer) ของเอกสารหรือส่วน (section) มักประกอบด้วยข้อมูลลิขสิทธิ์, ลิงก์นโยบายความเป็นส่วนตัว, ข้อมูลติดต่อ, Sitemap, หรือลิงก์โซเชียลมีเดีย
ตัวอย่างการใช้งาน
<!DOCTYPE html>
<html>
<head>
<title>ตัวอย่าง HTML Footer Tag</title>
</head>
<body>
<header>
<h1>การเรียนรู้อย่างง่ายดาย</h1>
<p>คุณกำลังเยี่ยมชม tutorialspoint.com - ศูนย์รวมบทเรียนง่ายๆ</p>
</header>
<main>
<p>เนื้อหาหลักของหน้าเว็บ...</p>
</main>
<footer>
<p>© 2024 สงวนลิขสิทธิ์ | <a href="/privacy">นโยบายความเป็นส่วนตัว</a> | <a href="/contact">ติดต่อเรา</a></p>
</footer>
</body>
</html>
จุดสำคัญ
- สามารถมี
<footer>หลายอันในหน้าเดียวได้ (หนึ่งต่อ section/article) - ไม่ต้องอยู่ท้ายหน้าเว็บเสมอไป วางได้ที่ท้าย article/section ด้วย
- ไม่ควรวาง
<header>หรือ<footer>ซ้อนกัน - ช่วย SEO และ Accessibility (Screen readers จะบอก landmark)
โครงสร้างหน้าเว็บมาตรฐาน HTML5
<body>
<header>...</header>
<nav>...</nav>
<main>
<article>
<header>...</header>
<section>...</section>
<footer>...</footer> <!-- Footer ของ Article -->
</article>
</main>
<footer>...</footer> <!-- Footer ของหน้าเว็บ -->
</body>