Đăng ký để tiếp tục đọc
Đăng ký để xem các phần kiểm tra chi tiết hơn về nội dung dễ đọc, đa phương tiện, thông báo lỗi và danh sách rà soát trước khi xuất bản.
Đối với người khiếm thị, web là một công cụ quan trọng để tìm thông tin, hoàn thành thủ tục, học tập, làm việc và duy trì cuộc sống hằng ngày. Một trang web khó đọc bằng trình đọc màn hình, chỉ dùng được bằng chuột hoặc thiếu mô tả hình ảnh sẽ tạo ra rào cản ngay cả khi nội dung của trang rất hữu ích.
Vì vậy, khả năng truy cập không chỉ là một hạng mục kỹ thuật ở cuối dự án. Đó là cách thiết kế để người dùng có thể hiểu nội dung, di chuyển qua giao diện và hoàn thành thao tác mà không phụ thuộc hoàn toàn vào thị giác.
| Người dùng cần gì | Điểm cần kiểm tra trên web |
|---|---|
| Hiểu nội dung bằng công cụ hỗ trợ | Cấu trúc HTML, tiêu đề, danh sách, nhãn và thứ tự đọc phải rõ ràng. |
| Không bỏ lỡ thông tin trong hình ảnh | Hình ảnh cần văn bản thay thế phù hợp với vai trò của hình ảnh. |
| Thao tác mà không cần chuột | Nút, liên kết, biểu mẫu và các thành phần tương tác phải dùng được bằng bàn phím. |
| Biết lỗi xảy ra ở đâu và sửa thế nào | Thông báo lỗi cần được trình bày bằng văn bản, cụ thể và dễ tìm. |
1. Hoạt động tốt với trình đọc màn hình
Trình đọc màn hình là phần mềm giúp người dùng nghe hoặc theo dõi nội dung trên màn hình theo thứ tự mà trang web cung cấp. Nếu trang chỉ nhìn có vẻ đúng nhưng cấu trúc HTML lộn xộn, người dùng có thể nghe nội dung theo thứ tự khó hiểu hoặc không biết thành phần nào là nút, liên kết hay trường nhập liệu.
- Dùng HTML có ngữ nghĩa. Tiêu đề nên dùng thẻ tiêu đề, danh sách nên dùng danh sách, liên kết nên là liên kết thật và trường nhập liệu cần nhãn rõ ràng. Cấu trúc đúng giúp công cụ hỗ trợ hiểu vai trò của từng phần.
- Dùng WAI-ARIA khi cần bổ sung ý nghĩa. ARIA có thể giúp mô tả vai trò, trạng thái hoặc tên của một thành phần tương tác. Tuy nhiên, điều quan trọng là người dùng phải nhận được thông tin nhất quán và không bị nhiễu.
- Giữ thứ tự đọc hợp lý. Nội dung nên được đọc theo luồng tự nhiên: giới thiệu, lựa chọn, thao tác, phản hồi. Khi CSS thay đổi vị trí hiển thị, hãy kiểm tra để thứ tự đọc bằng bàn phím và trình đọc màn hình vẫn dễ theo dõi.
2. Cung cấp văn bản thay thế cho hình ảnh
Văn bản thay thế, thường gọi là alt text, là phần mô tả giúp người dùng hiểu ý nghĩa của hình ảnh khi họ không nhìn thấy hình ảnh đó. Alt text tốt không chỉ mô tả hình ảnh có gì, mà còn nói vì sao hình ảnh đó quan trọng trong ngữ cảnh của bài viết hoặc giao diện.
- Hình ảnh mang thông tin cần mô tả ngắn gọn. Ví dụ, nếu hình ảnh minh họa một bước thao tác, alt text nên nêu bước đó thay vì chỉ viết chung chung là ảnh minh họa.
- Hình ảnh trang trí không nên gây nhiễu. Với hình chỉ dùng để trang trí, có thể để alt rỗng để trình đọc màn hình không đọc những thông tin không cần thiết.
- Hình phức tạp cần lời giải thích trong nội dung. Với biểu đồ, sơ đồ hoặc ảnh chứa nhiều thông tin, alt text ngắn có thể chưa đủ. Khi đó, hãy bổ sung mô tả trong đoạn văn, chú thích hoặc phần giải thích gần hình.
3. Hỗ trợ đầy đủ thao tác bằng bàn phím
Nhiều người khiếm thị điều hướng trang web bằng bàn phím. Nếu một nút chỉ hoạt động khi rê chuột, nếu thứ tự phím Tab nhảy lung tung hoặc nếu tiêu điểm không nhìn thấy, người dùng sẽ khó hoàn thành thao tác.
- Mọi thành phần tương tác cần dùng được bằng bàn phím. Liên kết, nút, trường nhập liệu, menu và hộp thoại nên có thể truy cập theo thứ tự hợp lý.
- Tiêu điểm cần dễ nhận biết. Khi người dùng di chuyển bằng phím Tab, trang phải cho biết hiện họ đang đứng ở đâu. Đây là dấu hiệu quan trọng cho cả người dùng thị lực thấp và người dùng bàn phím.
- Không tạo bẫy bàn phím. Người dùng phải có thể vào và thoát khỏi các khu vực như menu, hộp thoại hoặc khối nội dung mở rộng mà không bị kẹt.
Chúng tôi đã phát hành UUU Web Accessibility Widget Tool, một công cụ hỗ trợ triển khai các cải thiện về khả năng truy cập web. Nếu bạn đang xem xét cách làm cho trang web dễ tiếp cận hơn, hãy tham khảo thêm thông tin chi tiết từ công cụ này.