Các phần tử mốc HTML5 được dùng để cải thiện khả năng điều hướng

Các phần tử HTML5 như main, navaside đóng vai trò là điểm đánh dấu hoặc vùng đặc biệt trên trang mà trình đọc màn hình và các công nghệ hỗ trợ khác có thể chuyển đến. Bằng cách sử dụng các phần tử điểm tham chiếu, bạn có thể cải thiện đáng kể trải nghiệm điều hướng trên trang web của mình cho những người dùng công nghệ hỗ trợ. Tìm hiểu thêm trong bài viết HTML 5 và Điểm đánh dấu ARIA của Deque University.

Cách kiểm tra địa danh theo cách thủ công

Sử dụng danh sách phần tử điểm tham chiếu của W3C để kiểm tra xem mỗi phần chính trên trang của bạn có chứa một phần tử điểm tham chiếu hay không. Ví dụ:

<header>
  <p>Put product name and logo here</p>
</header>
<nav>
  <ul>
    <li>Put navigation here</li>
  </ul>
</nav>
<main>
  <p>Put main content here</p>
</main>
<footer>
  <p>Put copyright info, supplemental links, etc. here</p>
</footer>

Bạn cũng có thể sử dụng các công cụ như tiện ích Thông tin chi tiết về hỗ trợ tiếp cận của Microsoft để trực quan hoá cấu trúc trang và phát hiện các phần không có trong điểm đánh dấu:

Ảnh chụp màn hình web.dev với các địa điểm nổi tiếng được làm nổi bật bằng tiện ích Thông tin chi tiết về hỗ trợ tiếp cận

Cách sử dụng địa điểm nổi bật một cách hiệu quả

  • Sử dụng các phần tử điểm đánh dấu để xác định các phần chính trên trang thay vì dựa vào các phần tử chung như <div> hoặc <span>.
  • Sử dụng điểm đánh dấu để truyền đạt cấu trúc của trang. Ví dụ: phần tử <main> phải bao gồm tất cả nội dung liên quan trực tiếp đến ý chính của trang, vì vậy, mỗi trang chỉ được có một phần tử <main>. Hãy xem tóm tắt của MDN về các phần tử phân đoạn nội dung để tìm hiểu cách sử dụng từng mốc.
  • Sử dụng địa điểm nổi bật một cách thận trọng. Việc có quá nhiều điểm đánh dấu thực sự có thể khiến người dùng công nghệ hỗ trợ khó khăn hơn trong việc điều hướng vì điều này khiến họ không thể dễ dàng chuyển đến nội dung mong muốn.

Hãy xem bài đăng Tiêu đề và điểm đánh dấu để biết thêm thông tin.

Tài nguyên