ARIA: vai trò landmark
Landmark là một phân đoạn quan trọng của trang. Vai trò landmark là một lớp cha trừu tượng cho các giá trị vai trò aria dành cho các phần nội dung đủ quan trọng để người dùng có thể muốn điều hướng trực tiếp tới chúng.
Note:
Vai trò landmark là một vai trò trừu tượng. Nó được đưa vào đây để tài liệu đầy đủ. Tác giả web không nên dùng nó.
Mô tả
landmark là một vai trò trừu tượng cho một phần nội dung đủ quan trọng để người dùng có thể muốn điều hướng dễ dàng tới phần đó và có nó được đưa vào một bản tóm tắt được tạo động của trang. Các landmark cho phép công nghệ hỗ trợ điều hướng và tìm nội dung nhanh chóng.
Để tạo một vai trò landmark, hãy xác định mục đích của nội dung bằng cách dùng phần tử ngữ nghĩa như <section>, <nav> hoặc <main>, hoặc thêm một vai trò ARIA là lớp con của vai trò landmark như role="banner", role="complementary", hoặc role="region". Đừng dùng role="landmark".
Mỗi vai trò landmark cụ thể đều có phần tử HTML ngữ nghĩa tương ứng:
| Vai trò ARIA | Phần tử HTML |
|---|---|
banner |
<header> |
complementary |
<aside> |
contentinfo |
<footer> |
form |
<form> |
main |
<main> |
navigation |
<nav> |
region |
<section> |
search |
<search> |
Nên cung cấp một nhãn hiển thị, được tham chiếu bằng aria-labelledby. Nếu cần, một nhãn ngắn gọn, mô tả có thể được cung cấp bằng aria-label.
Đối với người dùng trình đọc màn hình, việc thêm các vai trò landmark về thực chất tạo ra 'liên kết bỏ qua' cho người dùng trình đọc màn hình, nhưng đừng thay thế điều hướng trong trang vì các landmark không được bộc lộ theo cách khác.
Thực hành tốt nhất
Đừng dùng role="landmark"; thay vào đó, hãy dùng các vai trò landmark con phù hợp, hoặc HTML ngữ nghĩa nếu có thể. Mặc dù không còn cần thiết nữa, vẫn được xem là thực hành tốt khi lặp lại các vai trò landmark con cùng với phần tử ngữ nghĩa tương ứng cho các trình duyệt cũ. Điều này tốt hơn là dùng các vai trò landmark trên các phần tử không mang ngữ nghĩa, như <div>, nhưng hãy dùng ít nhất một trong hai: role hoặc phần tử ngữ nghĩa để tạo landmark. Nếu không, nội dung của bạn sẽ khó điều hướng hơn với người dùng trình đọc màn hình.
Đặc tả
| Specification |
|---|
| Accessible Rich Internet Applications (WAI-ARIA) # landmark |