Kiểm tra theo cách thủ công để đảm bảo rằng tất cả các chế độ điều khiển tuỳ chỉnh đều có thể lấy tiêu điểm bằng bàn phím và hiển thị chỉ báo lấy tiêu điểm. Thứ tự các phần tử được làm tâm điểm cần tuân theo thứ tự DOM. Nếu bạn không chắc các phần tử nào sẽ nhận được tiêu điểm, hãy xem phần Giới thiệu về tiêu điểm.
Cách kiểm thử theo cách thủ công
Để kiểm tra xem thành phần điều khiển tuỳ chỉnh có thể làm tâm điểm và hiển thị chỉ báo lấy tiêu điểm hay không, hãy bắt đầu bằng cách di chuyển qua trang web của bạn.
Sử dụng TAB (hoặc SHIFT +
TAB) để di chuyển giữa các chế độ điều khiển, đồng thời sử dụng các phím mũi tên cùng ENTER và SPACE để điều khiển các giá trị của các chế độ đó (xem thêm Kiến thức cơ bản về truy cập bàn phím):
Bạn có thể truy cập tất cả các nút điều khiển tương tác trên trang không? Có chỉ báo lấy tiêu điểm trên từng chế độ điều khiển tương tác không?
Cách khắc phục
Nếu không thể di chuyển qua tất cả các thành phần trên một trang, bạn có thể cần phải sử dụng tabindex để cải thiện khả năng lấy tiêu điểm của các chế độ điều khiển đó.
Để làm cho một thành phần điều khiển tuỳ chỉnh có thể lấy tiêu điểm, hãy chèn phần tử điều khiển tuỳ chỉnh vào thứ tự thẻ tự nhiên bằng cách sử dụng tabindex="0" (xem thêm Kiểm soát tiêu điểm bằng chỉ mục thẻ).
Ví dụ:
<div tabindex="0">Focus me with the TAB key</div>
Bạn cũng có thể cần thêm vai trò ARIA thích hợp vào các phần tử điều khiển tuỳ chỉnh. Xem phần Chế độ điều khiển tuỳ chỉnh có vai trò ARIA.
Nếu bạn không thấy chỉ báo lấy nét, hãy cân nhắc sử dụng :focus để luôn hiển thị chỉ báo lấy nét.
Bất kể bạn sử dụng chuột hay bàn phím để gắn vào nút đó, chỉ báo lấy nét của nút luôn trông giống nhau (xem thêm phần Tiêu điểm kiểu).
Tại sao điều này quan trọng
Đối với những người dùng không thể hoặc không chọn không sử dụng chuột, thao tác bằng bàn phím là phương tiện chính để truy cập vào mọi nội dung trên màn hình. Trải nghiệm bàn phím tốt phụ thuộc vào thứ tự thẻ hợp lý và kiểu tiêu điểm dễ nhận thấy. Nếu người dùng bàn phím không thể nhìn thấy nội dung được đặt tiêu điểm, họ không có cách nào để tương tác với trang.
Tìm hiểu thêm trong bài viết Cách xem xét tính năng hỗ trợ tiếp cận.