Thẻ footer trong HTML

• Trần Thị Vân
• 1358
• 10/07/2025

Chức năng của Thẻ footer trong HTML

Thẻ footer trong HTML, cụ thể là HTML5, nó dùng để chứa phần thông tin dưới cùng của website, giúp các công cụ tìm kiếm dễ dàng tìm các thông tin ở dưới cùng trên giao diện website.

Cú pháp của Thẻ footer trong HTML

<footer>cacthehtml</footer>

cacthehtml: Các thẻ HTML nằm trong thẻ footer

Ví dụ thực tế về Thẻ footer trong HTML

<footer>
<p><b>Công Ty Tnhh Thương Mại Dịch Vụ Web Mới</b></p>
<p>Trụ sở chính: E20/22E6 Hẻm C1, Đường Vĩnh Lộc, Ấp 5, Xã Vĩnh Lộc B, Huyện Bình Chánh, Thành phố Hồ Chí Minh</p> 
<p>Email: info@webmoi.vn - tanlucit09@gmail.com</p> 
<p>Hotline + Zalo: 0398259259</p>
<p>Giờ làm việc: 08:00 - 20:00
<p>Website chính: https://webmoi.vn/</p>
</footer>

Ở dưới chân trang thường có các thông tin về công ty, chính sách, bộ công thương, dmca,....

Chạy Thử

Các lưu ý quan trọng khi sử dụng thẻ footer trong HTML

Thẻ footer giúp xác định phần thông tin cuối của một trang hoặc một khu vực nội dung. Tuy nhiên, để đảm bảo cấu trúc HTML rõ ràng, tối ưu SEO và dễ bảo trì, bạn nên tuân thủ một số nguyên tắc quan trọng khi sử dụng. Việc đặt footer đúng vị trí và đúng mục đích sẽ giúp website chuyên nghiệp hơn, đồng thời hỗ trợ trình duyệt và các công cụ tìm kiếm hiểu chính xác cấu trúc của trang.

Không nên đặt nhiều thẻ footer cho toàn bộ trang

Một trang web thông thường chỉ nên có một footer đại diện cho toàn bộ tài liệu. Đây là nơi chứa các thông tin chung như bản quyền, thông tin liên hệ, liên kết chính sách, điều khoản sử dụng hoặc mạng xã hội.

Nếu xuất hiện nhiều footer với cùng mục đích trên toàn bộ trang, cấu trúc tài liệu sẽ trở nên khó hiểu và làm giảm tính nhất quán. Trong trường hợp cần nhiều khu vực thông tin cuối, hãy xác định rõ phạm vi của từng phần thay vì lặp lại footer của toàn bộ website.

Phân biệt footer của trang web và footer của article, section

Footer không chỉ sử dụng ở cuối toàn bộ trang mà còn có thể xuất hiện bên trong các khu vực nội dung độc lập như bài viết hoặc một section riêng.

• Footer của trang: chứa thông tin áp dụng cho toàn bộ website.
• Footer của article: có thể hiển thị tên tác giả, ngày cập nhật, danh mục hoặc liên kết đến bài viết liên quan.
• Footer của section: bổ sung thông tin dành riêng cho section đó nếu cần thiết.

Việc phân biệt đúng phạm vi sử dụng giúp mã HTML có ý nghĩa rõ ràng và thuận tiện cho quá trình phát triển cũng như bảo trì website.

Ưu tiên sử dụng thẻ footer thay cho div để tăng tính ngữ nghĩa

Thay vì sử dụng div cho phần chân trang, nên ưu tiên footer khi nội dung thực sự đóng vai trò là phần kết thúc của một trang hoặc một khu vực nội dung.

Footer mang ý nghĩa ngữ nghĩa rõ ràng hơn, giúp:

• Trình duyệt hiểu đúng cấu trúc tài liệu.
• Công cụ tìm kiếm phân tích nội dung chính xác hơn.
• Các công nghệ hỗ trợ người dùng dễ xác định khu vực chân trang.
• Mã nguồn trực quan và dễ bảo trì trong thời gian dài.

Những nội dung nên và không nên đặt trong footer

Footer nên chứa những thông tin bổ trợ thay vì lặp lại nội dung chính của trang.

Nên đặt:

• Thông tin bản quyền.
• Thông tin doanh nghiệp hoặc chủ sở hữu website.
• Liên kết chính sách bảo mật, điều khoản sử dụng.
• Thông tin liên hệ.
• Liên kết đến các mạng xã hội.
• Liên kết điều hướng bổ sung khi cần.

Không nên đặt:

• Toàn bộ nội dung chính của bài viết.
• Danh sách từ khóa chỉ nhằm mục đích SEO.
• Nội dung trùng lặp nhiều lần trên cùng một trang.
• Quá nhiều liên kết không liên quan đến người dùng.

Một footer gọn gàng sẽ giúp người dùng nhanh chóng tìm được thông tin cần thiết mà không làm giảm trải nghiệm sử dụng website.

Các lỗi thường gặp khi thiết kế footer và cách khắc phục

Khi xây dựng footer, nhiều website thường mắc những lỗi làm giảm chất lượng giao diện và cấu trúc HTML.

Một footer được xây dựng đúng chuẩn không chỉ nâng cao tính chuyên nghiệp của website mà còn góp phần cải thiện khả năng sử dụng, hỗ trợ SEO và giúp việc quản lý mã nguồn trở nên thuận tiện hơn.

Lời kết

Cảm ơn các bạn đã tham khảo bài viết Thẻ footer trong HTML.