Khả năng tiếp cận: làm website dùng được cho mọi người

Một phần đáng kể người truy cập internet gặp khó khăn ở mức nào đó — về thị giác, thính giác, vận động, hoặc nhận thức. Con số này tăng theo độ tuổi dân số.

Phần lớn rào cản mà họ gặp không đến từ công nghệ phức tạp mà từ những lựa chọn thiết kế nhỏ mà người làm website không nghĩ tới.

Không chỉ là chuyện của người khuyết tật

Điều đáng nói: các cải thiện về khả năng tiếp cận giúp tất cả mọi người trong các tình huống cụ thể:

• Người xem trên điện thoại ngoài nắng — cần tương phản màu tốt.
• Người nghe video ở nơi ồn hoặc nơi cần yên lặng — cần phụ đề.
• Người lớn tuổi — cần chữ đủ lớn và nút đủ to.
• Người dùng một tay vì đang bế con — cần thao tác đơn giản.
• Người có kết nối chậm — cần trang nhẹ.
• Người đang vội — cần cấu trúc rõ.

Vì vậy đây không phải việc làm thêm cho một nhóm nhỏ mà là cải thiện chất lượng cho toàn bộ người dùng.

Các rào cản thường gặp và cách sửa

Tương phản màu không đủ.

Chữ xám nhạt trên nền trắng trông tinh tế với người thiết kế nhưng khó đọc với nhiều người. Đây là lỗi phổ biến nhất.

• Dùng công cụ kiểm tra tỉ lệ tương phản trực tuyến.
• Chú ý cả chữ trên ảnh nền — thường là chỗ tệ nhất.
• Đừng chỉ dùng màu để truyền tải thông tin — người không phân biệt được màu sẽ mất thông tin đó. Thêm ký hiệu hoặc chữ.

Ảnh không có mô tả thay thế.

Người dùng phần mềm đọc màn hình sẽ không biết ảnh đó là gì.

• Viết mô tả ngắn gọn về nội dung ảnh, không phải tên tệp.
• Với ảnh chỉ mang tính trang trí, để trống mô tả — như vậy phần mềm đọc bỏ qua thay vì đọc tên tệp vô nghĩa.
• Với ảnh chứa thông tin quan trọng, mô tả phải truyền tải được thông tin đó.
• Với biểu đồ, cân nhắc trình bày dữ liệu bằng bảng kèm theo.

Cấu trúc tiêu đề lộn xộn.

Nhiều người dùng phần mềm đọc màn hình di chuyển bằng cách nhảy giữa các tiêu đề — giống như đọc mục lục.

• Dùng đúng cấp bậc, không nhảy cóc.
• Đừng dùng thẻ tiêu đề chỉ để làm chữ to — dùng định dạng thay vào đó.
• Mỗi trang có một tiêu đề chính duy nhất.

Liên kết không rõ nghĩa.

Chữ liên kết ghi xem thêm hoặc nhấn vào đây không nói được gì khi đọc tách khỏi ngữ cảnh.

• Viết chữ liên kết mô tả đích đến.
• Nêu rõ nếu liên kết mở tab mới hoặc tải tệp về.

Không dùng được bằng bàn phím.

Nhiều người không dùng chuột — vì lý do vận động, hoặc vì họ dùng phần mềm hỗ trợ.

• Thử duyệt toàn bộ website chỉ bằng phím chuyển tiêu điểm và phím xác nhận.
• Kiểm tra xem có nhìn thấy tiêu điểm đang ở đâu không — nhiều giao diện xoá viền tiêu điểm vì lý do thẩm mỹ, làm người dùng bàn phím lạc hướng hoàn toàn.
• Kiểm tra menu nhiều cấp và cửa sổ bật lên — đây là chỗ hay hỏng nhất.
• Bảo đảm đóng được cửa sổ bật lên bằng bàn phím.

Biểu mẫu thiếu nhãn.

• Mỗi trường phải có nhãn gắn với nó, không chỉ chữ gợi ý mờ bên trong — chữ gợi ý biến mất khi bắt đầu gõ.
• Thông báo lỗi phải nêu rõ trường nào sai và sai gì.
• Đừng chỉ tô đỏ để báo lỗi.

Video và âm thanh không có bản chữ.

• Thêm phụ đề cho video.
• Cung cấp bản chép lời cho nội dung âm thanh.
• Đừng để video tự phát có tiếng.

Nội dung chuyển động không dừng được.

• Băng chuyền ảnh tự chạy gây khó cho người đọc chậm — cho phép dừng.
• Tránh nội dung nhấp nháy nhanh — điều này có thể gây co giật ở người nhạy cảm.
• Tôn trọng thiết lập giảm chuyển động của hệ điều hành.

Cách kiểm tra website của bạn

Kiểm tra tự động:

• Dùng công cụ kiểm tra khả năng tiếp cận có sẵn trong trình duyệt hoặc các công cụ trực tuyến.
• Nhiều lỗi cơ bản được phát hiện tự động — đây là bước đầu hiệu quả.
• Nhưng công cụ tự động chỉ bắt được một phần — chúng không đánh giá được mô tả ảnh có đúng nội dung không, hay cấu trúc có hợp lý không.

Kiểm tra thủ công — quan trọng hơn:

• Duyệt toàn bộ bằng bàn phím.
• Phóng to trang lên nhiều lần và xem bố cục có vỡ không.
• Thử tắt ảnh và xem còn hiểu nội dung không.
• Đọc to nội dung và xem có mạch lạc không.
• Nếu có điều kiện, thử với phần mềm đọc màn hình.

Trên WordPress cụ thể

• Chọn giao diện chú trọng khả năng tiếp cận — một số giao diện ghi rõ điều này.
• Cẩn thận với công cụ dựng trang kéo thả — chúng thường tạo cấu trúc mã phức tạp gây khó cho phần mềm hỗ trợ.
• Điền mô tả ảnh ngay khi tải lên — thành thói quen thì không tốn thời gian.
• Kiểm tra tiện ích trước khi cài — nhiều tiện ích thêm nội dung không tiếp cận được.
• Cẩn thận với các tiện ích hứa tự động sửa mọi thứ — chúng thường không giải quyết được vấn đề gốc và đôi khi làm phức tạp thêm.

Lợi ích đi kèm

• Tốt cho tìm kiếm — cấu trúc tiêu đề rõ, mô tả ảnh, chữ liên kết có nghĩa đều là những thứ công cụ tìm kiếm dùng để hiểu trang.
• Trang nhẹ hơn và nhanh hơn khi bỏ bớt hiệu ứng không cần.
• Nội dung dễ đọc hơn cho tất cả.
• Mở rộng tệp khách hàng.
• Một số lĩnh vực có yêu cầu pháp lý về khả năng tiếp cận — nên tìm hiểu quy định áp dụng cho lĩnh vực của bạn.

Bắt đầu từ đâu

Nếu website đã chạy và bạn không biết bắt đầu từ đâu, làm theo thứ tự này:

1. Sửa tương phản màu — nhanh và ảnh hưởng rộng.
2. Thêm mô tả cho ảnh quan trọng.
3. Sửa cấu trúc tiêu đề của các trang chính.
4. Kiểm tra và sửa việc dùng bàn phím.
5. Sửa nhãn biểu mẫu.
6. Thêm phụ đề cho video.

Sáu việc này giải quyết phần lớn rào cản thực tế, và không việc nào đòi hỏi làm lại website.

Một điều đáng nhớ

Khả năng tiếp cận thường bị nhìn như một danh sách yêu cầu kỹ thuật phải tuân thủ.

Cách nhìn hữu ích hơn: đây là câu hỏi về việc ai được phép dùng thứ bạn làm ra. Mỗi rào cản bạn để lại là một nhóm người bạn đã quyết định không phục vụ — thường là không cố ý, và thường là sửa được bằng vài thay đổi nhỏ.

Câu hỏi thường gặp