Các phần tử tương tác, chẳng hạn như các đường liên kết và nút, phải cho biết trạng thái và dễ phân biệt với các phần tử không tương tác. Để kiểm tra xem các phần tử tương tác có cho biết mục đích và trạng thái của chúng hay không, hãy sử dụng cả quy trình kiểm thử hình ảnh và trình đọc màn hình.
Cách kiểm thử thủ công
Bạn nên kiểm thử các thành phần tương tác bằng hình ảnh và trình đọc màn hình.
Kiểm tra quyền xem hình ảnh
Để kiểm thử tiêu điểm hình ảnh theo cách thủ công, hãy nhấn phím TAB trên trang của bạn.
- Bạn có thể TAB đến từng phần tử tương tác không?
- Khi bạn chuyển đến một phần tử tương tác, có gợi ý trực quan nào cho người dùng biết họ có thể tương tác với phần tử đó không?
- Mỗi phần tử tương tác có thay đổi về giao diện khi bạn chọn không?
Có nhiều cách để tạo kiểu cho chỉ báo tiêu điểm cho từng phần tử tương tác.
Có một cách là tạo kiểu cho lớp giả :focus.
Kiểu đó được áp dụng bất cứ khi nào phần tử được lấy làm tâm điểm, bất kể thiết bị đầu vào hay phương thức nào được dùng để lấy tiêu điểm phần tử đó.
Tìm hiểu thêm về cách lấy nét kiểu.
Kiểm thử bằng trình đọc màn hình
Sử dụng trình đọc màn hình để điều hướng trang và kiểm tra để đảm bảo trình đọc màn hình thông báo tên của từng thành phần điều khiển tương tác, vai trò của thành phần điều khiển đó và trạng thái tương tác hiện tại. Nếu vai trò của một phần tử không rõ ràng và trạng thái của phần tử đó không rõ ràng, thì bạn có thể cần thêm các vai trò ARIA thích hợp.
Tìm hiểu thêm trong bài viết Chế độ kiểm soát tuỳ chỉnh có vai trò ARIA.
Bạn cũng cần đặc biệt chú ý đến cách gắn nhãn cho các phần tử tương tác. Người dùng trình đọc màn hình và các công nghệ hỗ trợ khác dựa vào nhãn để hiểu ngữ cảnh của phần tử đó. Nhãn mơ hồ là một lỗi thường gặp và không hữu ích cho việc điều hướng nội dung. Tìm hiểu cách cải thiện Nhãn và văn bản thay thế.
Tại sao điều này quan trọng
Việc đưa ra gợi ý trực quan về chức năng của một chế độ kiểm soát có thể giúp mọi người vận hành và thao tác trên trang web của bạn. Những gợi ý này được gọi là affordances. Các công cụ giúp mọi người có thể sử dụng trang web của bạn trên nhiều loại thiết bị.
Tài nguyên
Kiểm tra mã nguồn cho Các phần tử tương tác cho biết mục đích và trạng thái của các phần tử đó