Kiểm tra tương phản WCAG cho văn bản chuẩn AA và AAA
Công cụ kiểm tra độ tương phản WCAG này tính tỉ số tương phản giữa màu chữ và màu nền, rồi đối chiếu với yêu cầu AA hoặc AAA cho văn bản thường hoặc văn bản lớn. Bản xem trước trực tiếp hiển thị chữ trên nền của nó để giúp bạn đánh giá khả năng đọc. Các ngưỡng là 4.5:1 và 3:1 cho AA, và 7:1 và 4.5:1 cho AAA.
Công cụ kiểm tra độ tương phản WCAG này tính tỉ số tương phản giữa màu chữ (foreground) và màu nền (background). Công cụ chấm kết quả theo ngưỡng WCAG AA và AAA cho văn bản thường và văn bản lớn, đồng thời cung cấp bản xem trước trực tiếp để bạn thấy chữ trên nền của nó. Hãy dùng nó để kiểm tra độ tương phản màu và nhận kết quả rõ ràng khi đánh giá khả năng đọc.
Hãy chọn đánh giá màu theo tiêu chí AA hay AAA, và văn bản là thường hay lớn. Với AA, tỉ số tương phản yêu cầu là 4.5:1 cho văn bản thường và 3:1 cho văn bản lớn. Với AAA, các ngưỡng là 7:1 cho văn bản thường và 4.5:1 cho văn bản lớn. Công cụ báo cáo tỉ số so với yêu cầu đã chọn như thế nào.
Màu chữ và màu nền có vai trò khác nhau trong bản xem trước: màu chữ là màu của văn bản, còn màu nền là màu phía sau nó. Kiểm tra cặp màu giúp bạn đánh giá độ tương phản của chúng cùng nhau, thay vì đánh giá từng màu riêng lẻ. Bản xem trước trực tiếp cho phép kiểm tra nhanh bằng mắt bên cạnh tỉ số và điểm đánh giá.
Công cụ kiểm tra chạy hoàn toàn trong trình duyệt của bạn, và dữ liệu bạn nhập được xử lý trên chính thiết bị của bạn; không có dữ liệu nào bị gửi tới máy chủ. Công cụ hoạt động ngoại tuyến sau khi trang đã tải xong và hoàn toàn miễn phí. Lập trình viên, nhà thiết kế và kỹ sư DevOps có thể dùng nó để kiểm tra tổ hợp màu theo tiêu chí WCAG và phát hiện vấn đề tương phản trước khi chia sẻ hoặc phát hành giao diện.
Bước 1: Nhập màu chữ và màu nền bạn muốn kiểm tra. Đây là hai màu mà công cụ so sánh.
Bước 2: Chọn tiêu chí để đánh giá. Công cụ chấm độ tương phản theo ngưỡng AA hoặc AAA cho văn bản thường hoặc văn bản lớn.
Bước 3: Xem lại tỉ số tương phản và điểm đánh giá. Kết quả cho biết các màu đã chọn có đạt tiêu chí đã chọn không.
Bước 4: Kiểm tra bản xem trước trực tiếp. Việc thấy chữ trên nền của nó giúp bạn đánh giá khả năng đọc trong nháy mắt.
Trường hợp sử dụng: Kiểm tra xem tổ hợp màu chữ và màu nền có đạt ngưỡng tương phản WCAG yêu cầu không trước khi dùng trong giao diện.
Trường hợp sử dụng: Phát hiện tổ hợp màu không đạt trước khi nó tới tay người review hoặc người dùng, để bạn đánh giá sớm hơn.
Trường hợp sử dụng: Nhận kết quả đạt/không đạt kèm lý do, thay vì chỉ dựa vào tỉ số tương phản.
Trường hợp sử dụng: Dùng bản xem trước trực tiếp để đánh giá chữ trông ra sao trên nền của nó trong khi kiểm tra độ tương phản.
Trường hợp sử dụng: Kiểm tra văn bản thường và văn bản lớn theo tiêu chí AA hoặc AAA khi bạn cần đánh giá các yêu cầu văn bản khác nhau.
Trường hợp sử dụng: Xác minh tổ hợp màu đề xuất theo các ngưỡng mà dự án của bạn cần tuân thủ.