Vì sao chỉ dùng màu sắc là không đủ để truyền đạt thông tin?

WCAG 1.4.1 Use of Color (mức A) nói rằng màu không được là cách duy nhất để hiển thị thông tin, kích hoạt hành động hay phân biệt các phần tử.

Nhiều người dùng không thể dựa vào màu sắc:

• Người bị thiếu hụt thị lực màu, ảnh hưởng khoảng 1 trong 12 nam giới và 1 trong 200 nữ giới.
• Người nhìn kém, hoặc dùng chế độ high contrast hay thang xám.
• Bất kỳ ai dùng màn hình đơn sắc hoặc có ánh nắng chiếu lên màn hình.
• Người dùng screen reader, hoàn toàn không nhận được màu.

Các cách sửa phổ biến:

• Lỗi form: không chỉ viền đỏ. Thêm icon và thông báo lỗi bằng text.
• Trường bắt buộc: viết "(required)" thay vì chỉ dấu sao đỏ.
• Link trong đoạn văn: giữ gạch chân, hoặc dấu hiệu khác ngoài màu sắc.
• Biểu đồ: thêm pattern, hình dạng hoặc nhãn trực tiếp.
• Trạng thái: ghép chấm màu với một từ như "Online" hay "Failed".

<label for="email">Email</label>
<input id="email" aria-invalid="true" aria-describedby="err">
<p id="err"><svg aria-hidden="true">...</svg> Enter a valid email address.</p>

Để kiểm tra, xem trang ở thang xám hoặc giả lập mù màu trong DevTools.

Dùng màu để hỗ trợ ý nghĩa, không bao giờ để nó một mình mang ý nghĩa.