7 HTML tag bạn nên dùng thay cho DIV

Mỗi khi tạo một thành phần của trang web, chúng ta thường nghĩ đến việc dùng thẻ div để bao cái phần html đó. Tuy vâỵ thẻ div bản chất của nó không có ý nghĩa cụ thể

 Theo phát biểu của W3C:

“The div element has no special meaning at all…Authors are strongly encouraged to view the div element as an element of last resort, for when no other element is suitable. Use of more appropriate elements instead of the div element leads to better accessibility for readers and easier maintainability for authors.”

nghĩa là chúng ta chỉ dùng thẻ DIV khi không còn lựa chọn nào khác, vì sử dụng các thẻ mang ý nghĩa cụ thể sẽ giúp chúng ta rất nhiều trong việc quản lý code và debug, cũng như giúp ích trong việc SEO trang web.

Vậy cần dùng những thẻ gì thay vì DIV? dưới đây là danh sách 7 thẻ có thể thay thế:

  1. main
  • Chỉ đến phần nội dung chính của trang web
  • Giúp cho việc zoom trang ở mobile, truy cập đến phím tắt
  • Dùng chỉ một lần trong một trang web

2. section

  • Nhóm một số thành phần lại theo chủ đề
  • Mỗi section có thể có header và footer riêng
  • Có thể có nhiều section trong một trang web

3. aside

  • Nhóm các thành phần liên quan với nhau
  • Thường dùng cho sidebar

4. article

  • Chỉ một phần nội dung trang web có thể đứng độc lập
  • Thường dùng cho: blog post, bài báo, comment người dùng…

5. blockquote

  • Chỉ phần nội dung được trích dẫn từ nguồn bên ngoài
  • Thường đi kèm với cite để ghi chú nguồn trích dẫn

6. nav

  • Dùng cho phần điều hướng (navigation) của trang web
  • Chứa các liên kết cho các trang

7. footer

  • Dùng cho phần nội dung ở phía dưới cùng của trang
  • Thường dùng để hiển thị contact, copyright, giới thiệu, hay các liên kết khác.

Như vậy ta đã biết có 7 thẻ nên dùng trong một số trường hợp thay vì thẻ div, vậy làm sao để biết lúc nào thì dùng từng thẻ trong số đó? Thật may là chúng ta có một công cụ cho việc nàynày, đó là HTML5 Doctor

dammecode via medium

Leave a comment