Đăng ký để truy cập
Đọc thêm nội dung này khi bạn đăng ký ngay hôm nay.
Trình đọc màn hình là một dạng công nghệ hỗ trợ giúp người dùng tiếp cận nội dung web mà không cần nhìn trực tiếp vào màn hình. Công cụ này đọc nội dung thành giọng nói hoặc gửi nội dung sang màn hình chữ nổi, nhờ đó người khiếm thị, người có khó khăn về thị giác và một số người gặp khó khăn khi đọc có thể sử dụng trang web độc lập hơn.
Với nhà phát triển web, điều cần nhớ là trình đọc màn hình không chỉ “đọc chữ”. Nó dựa vào cấu trúc HTML, nhãn của nút và liên kết, văn bản thay thế của hình ảnh, cùng những thuộc tính hỗ trợ như ARIA để hiểu trang đang được tổ chức như thế nào. Một trang nhìn đẹp nhưng thiếu cấu trúc rõ ràng vẫn có thể gây khó khăn cho người dùng trình đọc màn hình.
Trình đọc màn hình hoạt động như thế nào?
Trình đọc màn hình là phần mềm đọc nội dung văn bản trên trang web, thông báo vai trò của các thành phần giao diện và hỗ trợ người dùng di chuyển bằng bàn phím hoặc cử chỉ chạm. Trong môi trường Windows, các công cụ thường được nhắc đến gồm NVDA và JAWS. Trên macOS và các thiết bị iOS, VoiceOver là trình đọc màn hình tích hợp sẵn. Trên thiết bị di động, người dùng cũng có thể dùng trình đọc màn hình được tích hợp trong hệ điều hành.
Khi một trang web được xây dựng tốt, trình đọc màn hình có thể thông báo cho người dùng rằng một đoạn là tiêu đề, một mục là liên kết, một thành phần là nút hoặc một trường đang chờ nhập dữ liệu. Những thông tin này giúp người dùng hiểu “bản đồ” của trang trước khi đọc từng dòng nội dung.
| Thành phần | Vai trò với người dùng trình đọc màn hình |
|---|---|
| Tiêu đề như h2, h3 | Giúp người dùng nhảy nhanh giữa các phần và hiểu thứ tự nội dung. |
| Liên kết có văn bản rõ nghĩa | Cho biết liên kết sẽ dẫn tới đâu hoặc hành động nào sẽ xảy ra. |
| Nhãn của nút và biểu mẫu | Giúp người dùng biết cần nhập gì hoặc nút sẽ thực hiện thao tác nào. |
| Văn bản thay thế cho hình ảnh | Truyền đạt nội dung hoặc chức năng của hình ảnh khi hình ảnh có ý nghĩa. |
| ARIA khi cần thiết | Bổ sung vai trò, trạng thái hoặc tên gọi cho các thành phần giao diện mà HTML thông thường chưa mô tả đủ. |
Các tính năng chính của trình đọc màn hình
Người dùng trình đọc màn hình thường không đọc trang theo cách giống người dùng nhìn bằng mắt. Họ có thể nghe toàn bộ trang, chuyển nhanh qua các tiêu đề, liệt kê liên kết, đi tới biểu mẫu hoặc thay đổi tốc độ đọc để xử lý thông tin nhanh hơn.
- Đọc văn bản: Công cụ đọc nội dung chữ trên trang để người dùng không phải phụ thuộc vào hình ảnh hiển thị.
- Điều hướng theo cấu trúc: Người dùng có thể di chuyển giữa tiêu đề, liên kết, nút và trường biểu mẫu thay vì phải nghe từ đầu đến cuối.
- Tóm tắt các thành phần chính: Một số trình đọc màn hình cho phép xem danh sách tiêu đề hoặc liên kết, giúp người dùng quyết định phần nào cần đọc trước.
- Xuất ra chữ nổi: Khi kết hợp với màn hình chữ nổi, nội dung có thể được đọc bằng chữ nổi thay vì chỉ nghe bằng âm thanh.
- Tùy chỉnh cách đọc: Người dùng có thể thay đổi tốc độ đọc, giọng nói hoặc cách công cụ thông báo dấu câu và ký tự.
Vì vậy, một trang dễ tiếp cận không chỉ cần có nội dung đúng. Trang còn cần có cấu trúc đủ rõ để người dùng chọn được con đường đọc phù hợp với mục tiêu của họ.
Lợi ích đối với người dùng
Trình đọc màn hình giúp người dùng tiếp cận thông tin, dịch vụ và công việc trực tuyến trong nhiều tình huống khác nhau. Lợi ích rõ nhất là với người khiếm thị hoặc người có khó khăn về thị giác, nhưng các nguyên tắc hỗ trợ trình đọc màn hình cũng làm trang dễ hiểu hơn cho nhiều nhóm người dùng khác.
- Tiếp cận thông tin bình đẳng hơn: Khi văn bản, liên kết, nút và biểu mẫu được mô tả rõ, người dùng có thể hiểu nội dung và thao tác trên trang mà không cần dựa vào hình ảnh.
- Sử dụng dịch vụ trực tuyến dễ hơn: Người dùng có thể đọc email, dùng mạng xã hội, mua sắm trực tuyến hoặc thực hiện những tác vụ như đặt lịch và điền biểu mẫu.
- Hỗ trợ tính tự lập: Khi trang web được thiết kế tốt, người dùng có thể tự tìm thông tin và hoàn thành tác vụ mà không phải nhờ người khác đọc hoặc thao tác thay.
- Giảm gánh nặng khi đọc: Người gặp khó khăn khi đọc viết, có rối loạn học tập hoặc tạm thời không tiện nhìn màn hình cũng có thể hưởng lợi từ nội dung có cấu trúc rõ.
Nhà phát triển web cần chú ý điều gì?
Để hỗ trợ trình đọc màn hình, nhà phát triển nên bắt đầu từ HTML rõ nghĩa trước khi thêm các kỹ thuật bổ sung. Những thẻ như <header>, <nav>, <main> và <footer> giúp mô tả vùng nội dung của trang. Chủ đề này được giải thích sâu hơn trong bài viết về HTML ngữ nghĩa.
ARIA cũng hữu ích trong một số giao diện, đặc biệt khi cần truyền đạt vai trò hoặc trạng thái mà HTML gốc chưa thể hiện đủ. Tuy nhiên, ARIA nên được dùng như phần bổ sung, không phải cách thay thế cho cấu trúc HTML sai. Khi cần tìm hiểu thêm, có thể đọc bài viết về WAI-ARIA.
Hình ảnh cũng cần được xử lý cẩn thận. Nếu hình ảnh truyền tải thông tin hoặc là một nút thao tác, văn bản thay thế phải mô tả nội dung hoặc chức năng của hình ảnh. Nếu hình ảnh chỉ để trang trí, cách xử lý nên giúp trình đọc màn hình bỏ qua nó để người dùng không phải nghe thông tin thừa. Bài viết về cách viết alt text dễ hiểu giải thích kỹ hơn điểm này.
Chúng tôi đã phát hành UUU Web Accessibility Widget Tool, công cụ giúp triển khai các hỗ trợ tiếp cận web dễ dàng hơn. Nếu bạn đang tìm cách cải thiện khả năng tiếp cận của trang web, hãy xem thêm thông tin chi tiết.