Mỗi liên kết nên giúp người dùng đoán đúng kết quả trước khi kích hoạt: liên kết sẽ mở trang nào, tải tệp gì hoặc thực hiện hành động nào. Những nhãn chung chung như “Bấm vào đây” hay “Xem thêm” làm mất thông tin đó, nhất là khi chúng xuất hiện nhiều lần trên cùng một trang.
Mục đích liên kết là kết quả mà người dùng nhận được khi kích hoạt liên kết. Văn bản liên kết càng cụ thể, người dùng càng dễ quyết định có nên đi tiếp hay không mà không phải mở thử rồi quay lại.
Vì sao văn bản liên kết mơ hồ gây khó sử dụng?
Nhiều trình đọc màn hình cho phép người dùng mở danh sách các liên kết trên trang hoặc di chuyển nhanh từ liên kết này sang liên kết khác. Trong những cách duyệt đó, hàng loạt nhãn giống nhau như “Chi tiết” không cho biết mỗi liên kết dẫn đến nội dung nào. Nếu chưa quen với công cụ này, bạn có thể đọc thêm hướng dẫn về cách trình đọc màn hình hoạt động.
Vấn đề không chỉ ảnh hưởng đến người khiếm thị. Văn bản rõ nghĩa cũng giúp người dùng có khó khăn về nhận thức phân biệt các lựa chọn, đồng thời giúp người chỉ dùng bàn phím quyết định nhanh hơn khi chuyển tiêu điểm qua nhiều liên kết.
Cách viết văn bản liên kết dễ hiểu
Mô tả hành động và đối tượng
Một nhãn hữu ích thường cho biết người dùng sẽ làm gì và nội dung đích là gì. Không cần biến liên kết thành một câu dài; chỉ cần đủ thông tin để phân biệt nó với các liên kết xung quanh.
| Tình huống | Nhãn mơ hồ | Nhãn rõ hơn |
|---|---|---|
| Dẫn đến bài hướng dẫn | Xem thêm | Đọc hướng dẫn kiểm tra khả năng truy cập web |
| Tải một tệp | Tải xuống | Tải thực đơn nhà hàng (PDF) |
| Dẫn đến trang sản phẩm | Chi tiết | Xem thông tin về [tên sản phẩm] |
Chỉ ghi định dạng tệp, tên sản phẩm hoặc loại tài liệu khi thông tin đó đúng với đích đến. Mẫu văn bản không thay thế việc kiểm tra nội dung thật của từng liên kết.
Dùng ngữ cảnh có cấu trúc khi cần giữ nhãn ngắn
Văn bản liên kết tự nó có nghĩa vẫn là lựa chọn dễ kiểm tra nhất. Tuy nhiên, tiêu chí WCAG 2.4.4 cũng cho phép xác định mục đích từ văn bản liên kết kết hợp với ngữ cảnh được xác định bằng chương trình, chẳng hạn câu, đoạn văn, mục danh sách hoặc ô bảng chứa liên kết.
Điều này không có nghĩa là bất kỳ chữ nào nằm gần liên kết cũng đủ làm ngữ cảnh. Trình duyệt và công nghệ hỗ trợ phải có thể xác định mối quan hệ đó từ cấu trúc nội dung. Nếu phải dùng nhãn ngắn như “Đọc thêm”, phần mô tả nội dung nên đứng trước liên kết và nằm trong cùng một đơn vị có quan hệ rõ ràng.
Không dùng thuộc tính title để bù cho nhãn thiếu nghĩa
Thuộc tính title có thể bổ sung thông tin, nhưng không nên là nơi duy nhất mô tả mục đích của liên kết. Thông tin cần thiết phải có trong văn bản hiển thị hoặc được liên kết với liên kết bằng cấu trúc mà công nghệ hỗ trợ có thể nhận biết.
Giữ tên nhất quán theo đích đến và mục đích
Các liên kết có cùng đích đến và cùng mục đích nên dùng cách gọi nhất quán. Ngược lại, những liên kết dẫn đến nội dung khác nhau không nên cùng mang một nhãn chung chung. Quy tắc này giúp người dùng hiểu rằng các tên giống nhau thực hiện tác vụ tương đương, còn các tên khác nhau đại diện cho lựa chọn khác nhau.
Đặt tên cho liên kết chỉ có biểu tượng
Nếu biểu tượng là nội dung duy nhất bên trong liên kết, liên kết vẫn cần một tên có thể truy cập để mô tả mục đích. Ví dụ, một biểu tượng kính lúp dẫn đến trang tìm kiếm có thể dùng aria-label='Mở trang tìm kiếm'. Tên này phải phản ánh đúng hành động thực tế, không chỉ mô tả hình dạng của biểu tượng.
Phân biệt WCAG 2.4.4 và 2.4.9
WCAG (Web Content Accessibility Guidelines) là bộ hướng dẫn về khả năng truy cập nội dung web. Trong WCAG 2.2, hai tiêu chí sau cùng đề cập đến mục đích của liên kết nhưng có phạm vi khác nhau.
| Tiêu chí | Mức | Điều cần đạt |
|---|---|---|
| 2.4.4 Mục đích liên kết trong ngữ cảnh | A | Mục đích có thể được xác định từ văn bản liên kết hoặc từ văn bản liên kết kết hợp với ngữ cảnh được xác định bằng chương trình. |
| 2.4.9 Mục đích liên kết chỉ từ liên kết | AAA | Có cơ chế để xác định mục đích của từng liên kết từ chính văn bản liên kết, trừ trường hợp mục đích vốn mơ hồ với mọi người dùng. |
Vì vậy, “mọi liên kết luôn phải tự giải thích hoàn toàn” không phải là cách diễn đạt chính xác cho tiêu chí 2.4.4. Dù vậy, viết nhãn có nghĩa khi đứng riêng vẫn là cách làm thuận tiện cho người dùng duyệt danh sách liên kết và đưa trang đến gần yêu cầu khắt khe hơn của tiêu chí 2.4.9.
Cách kiểm tra mục đích của liên kết
- Đọc riêng từng nhãn: tạm bỏ phần văn bản xung quanh và kiểm tra xem nhãn có cho biết đích đến hoặc hành động hay không.
- Kiểm tra ngữ cảnh: nếu nhãn cần thông tin bổ sung, xác nhận thông tin đó nằm trong câu, đoạn văn, mục danh sách, ô bảng hoặc quan hệ được xác định bằng chương trình.
- So sánh các nhãn lặp lại: tìm “Xem thêm”, “Chi tiết” và “Bấm vào đây”; thay chúng bằng tên phân biệt được từng đích đến.
- Duyệt bằng bàn phím: dùng phím Tab để đi qua các liên kết, kiểm tra thứ tự, trạng thái tiêu điểm và khả năng hiểu nhãn khi chỉ tập trung vào liên kết.
- Thử với trình đọc màn hình: mở danh sách liên kết và nghe từng tên; kiểm tra thêm liên kết chỉ có biểu tượng và liên kết hình ảnh.
- Xác nhận đích thật: kích hoạt liên kết để bảo đảm tên mô tả đúng trang, tệp hoặc hành động nhận được.
Nếu cần mở rộng kiểm tra ra ngoài văn bản liên kết, hãy tham khảo quy trình kiểm tra khả năng truy cập web.
Danh sách rà soát nhanh
- Văn bản cho biết đích đến hoặc hành động.
- Các liên kết khác đích không dùng chung một nhãn mơ hồ.
- Các liên kết cùng đích và cùng mục đích được gọi nhất quán.
- Ngữ cảnh bổ sung có quan hệ rõ ràng với liên kết trong cấu trúc nội dung.
- Thuộc tính
titlekhông phải nguồn thông tin duy nhất. - Liên kết chỉ có biểu tượng hoặc hình ảnh có tên truy cập phù hợp.
- Tên liên kết vẫn đúng sau khi nội dung đích thay đổi.
Kết luận
Hãy bắt đầu bằng việc tìm các nhãn chung chung và thay chúng bằng mô tả gắn với đích đến thật. Khi phải giữ nhãn ngắn, hãy cung cấp ngữ cảnh có cấu trúc và kiểm tra bằng bàn phím cùng trình đọc màn hình. Cách làm này giảm thao tác đoán thử và giúp người dùng chọn đúng liên kết ngay từ lần đầu.
Chúng tôi đã phát hành UUU Web Accessibility Widget Tool, công cụ hỗ trợ triển khai khả năng truy cập web. Nếu bạn đang rà soát khả năng truy cập cho trang của mình, hãy xem thông tin chi tiết về công cụ.