Thời điểm sử dụng Phần tử SECTION HTML5

Và khi nào sử dụng ARTICLE, ASIDE và DIV

Phần tử SECTION HTML5 mới có thể hơi khó hiểu. Nếu bạn đã xây dựng các tài liệu HTML trước HTML5, rất có thể là bạn đã sử dụng phần tử để tạo các bộ phận cấu trúc trong các trang của bạn và sau đó tạo kiểu cho các trang với chúng. Vì vậy, nó có vẻ giống như một điều tự nhiên để thay thế các phần tử DIV hiện tại của bạn bằng các phần tử SECTION. Nhưng điều này là không chính xác về mặt kỹ thuật. Vì vậy, nếu bạn không chỉ thay thế các phần tử DIV bằng phần tử SECTION, bạn sử dụng chúng như thế nào một cách chính xác?

PHẦN PHẦN là phần tử ngữ nghĩa

Điều đầu tiên cần hiểu là phần tử SECTION là một phần tử ngữ nghĩa . Điều này có nghĩa là nó cung cấp ý nghĩa cho cả tác nhân người dùng và con người về nội dung đính kèm - cụ thể là một phần của tài liệu.

Điều này có vẻ giống như một mô tả ngữ nghĩa rất chung chung, và đó là bởi vì nó là. Có các yếu tố HTML5 khác cung cấp nhiều khác biệt ngữ nghĩa cho nội dung của bạn mà bạn nên sử dụng trước tiên trước khi bạn sử dụng phần tử SECTION:

Khi nào nên sử dụng PHẦN PHẦN

Sử dụng yếu tố ARTICLE khi nội dung là một phần độc lập của trang web có thể đứng một mình và được cung cấp như bài viết hoặc bài đăng trên blog. Sử dụng phần tử ASIDE khi nội dung liên quan đến nội dung của trang hoặc chính trang web, chẳng hạn như thanh bên, chú thích, chú thích hoặc thông tin trang web được liên kết. Sử dụng phần tử NAV cho nội dung đang điều hướng.

Phần tử SECTION là một phần tử ngữ nghĩa chung. Bạn sử dụng nó khi không có phần tử chứa ngữ nghĩa nào khác thích hợp. Bạn sử dụng nó để kết hợp các phần của tài liệu của bạn với nhau thành các đơn vị rời rạc mà bạn có thể mô tả là có liên quan theo một cách nào đó. Nếu bạn không thể mô tả các phần tử trong phần trong một hoặc hai câu thì có thể bạn không nên sử dụng phần tử đó.

Thay vào đó, bạn nên sử dụng phần tử DIV. Phần tử DIV trong HTML5 là phần tử vùng chứa không phải ngữ nghĩa. Nếu nội dung bạn đang cố gắng kết hợp không có ý nghĩa ngữ nghĩa, nhưng bạn vẫn cần phải kết hợp nó để tạo kiểu, thì phần tử DIV là phần tử thích hợp để sử dụng.

Cách hoạt động của phần tử PHẦN

Một phần của tài liệu của bạn có thể xuất hiện dưới dạng vùng chứa bên ngoài cho các bài viết và các phần tử ASIDE. Nó cũng có thể chứa nội dung không phải là một phần của ARTICLE hoặc ASIDE. Phần tử SECTION cũng có thể được tìm thấy bên trong một ARTICLE, NAV hoặc ASIDE. Bạn thậm chí có thể lồng các phần để chỉ ra rằng một nhóm nội dung là một phần của một nhóm nội dung khác là một phần của bài viết hoặc toàn bộ trang.

Phần tử SECTION tạo các mục bên trong một đường viền của tài liệu. Và như vậy, bạn nên luôn có phần tử header (H1 đến H6) như một phần của phần. Nếu bạn không thể đưa ra một tiêu đề cho phần này, thì một lần nữa phần tử DIV có lẽ phù hợp hơn. Hãy nhớ rằng, nếu bạn không muốn tiêu đề phần xuất hiện trên trang, bạn luôn có thể che dấu nó bằng CSS.

Khi không sử dụng PHẦN PHẦN

Ngoài những lời khuyên ở trên để sử dụng các phần tử ngữ nghĩa cụ thể hơn trước tiên, có một khu vực nhất định mà bạn không nên sử dụng phần tử SECTION: chỉ dành cho kiểu dáng.

Nói cách khác, nếu lý do duy nhất bạn đặt một phần tử ở vị trí đó là đính kèm các thuộc tính kiểu CSS, bạn không nên sử dụng phần tử SECTION. Tìm phần tử ngữ nghĩa hoặc sử dụng phần tử DIV thay thế.

Cuối cùng nó có thể không quan trọng

Khó khăn trong việc viết HTML ngữ nghĩa là ngữ nghĩa với tôi có thể hoàn toàn vô nghĩa đối với bạn. Nếu bạn cảm thấy rằng bạn có thể biện minh bằng cách sử dụng phần tử SECTION trong tài liệu của bạn, thì bạn nên sử dụng nó. Hầu hết các tác nhân người dùng không quan tâm và sẽ hiển thị trang như bạn có thể mong đợi liệu bạn có tạo kiểu DIV hay PHẦN hay không.

Đối với các nhà thiết kế thích ngữ nghĩa chính xác, sử dụng phần tử SECTION theo cách ngữ nghĩa hợp lệ là quan trọng. Đối với những nhà thiết kế chỉ muốn trang của họ hoạt động, điều đó không quan trọng. Tôi tin rằng viết HTML hợp lệ ngữ nghĩa là thực hành tốt và giữ cho các trang được kiểm chứng trong tương lai. Nhưng cuối cùng thì tùy thuộc vào bạn.