Bản mẫu:Greater color contrast ratio

Tài liệu bản mẫu[xem] [sửa] [lịch sử] [làm mới]

Bản mẫu này xác định cặp màu với tỷ lệ tương phản lớn hơn: color1/color2 hoặc color1/color3. Điều này rất hữu ích để chọn một cặp màu nền trước/nền sau. Để truy cập, WCAG 2.0 AA guidelines yêu cầu tỷ lệ tương phản từ 3 trở lên đối với văn bản lớn và 4,5 hoặc lớn hơn đối với văn bản có kích thước bình thường. Khi được sử dụng ở chế độ mặc định, với color2 và color3 bằng trắng và đen, cặp màu được chọn sẽ luôn có tỷ lệ tương phản lớn hơn 4,58.

Ví dụ

• <span style="background:navy; color:{{Greater color contrast ratio|navy|white|black}}">Navy</span> → Navy
• <span style="{{Greater color contrast ratio|navy|white|black|css=y}}">Navy</span> → Navy
• <span style="{{Greater color contrast ratio|navy|css=y}}">Navy</span> → Navy
• <span style="background:red; color:{{Greater color contrast ratio|red|white|black}}">Red</span> → Red
• <span style="{{Greater color contrast ratio|red|white|black|css=y}}">Red</span> → Red
• <span style="{{Greater color contrast ratio|red|css=y}}">Red</span> → Red
• <span style="background:white; color:{{Greater color contrast ratio|white|white|black}}">White</span> → White
• <span style="{{Greater color contrast ratio|white|white|black|css=y}}">White</span> → White
• <span style="background:black; color:{{Greater color contrast ratio|black|white|black}}">Black</span> → Black
• <span style="{{Greater color contrast ratio|black|white|black|css=y}}">Black</span> → Black
• <span style="background:#005500; color:{{Greater color contrast ratio|#005500|#FFFFFF|#000000}}">#005500</span> → #005500
• <span style="{{Greater color contrast ratio|#005500|#FFFFFF|#000000|css=y}}">#005500</span> → #005500
• <span style="background:#005500; color:#{{Greater color contrast ratio|005500|FFFFFF|000000}}">005500</span> → 005500
• <span style="{{Greater color contrast ratio|005500|FFFFFF|000000}}">005500</span> → 005500
• <span style="background:#CC5500; color:#{{Greater color contrast ratio|CC5500|FFFFFF|000000}}">CC5500</span> → CC5500
• <span style="{{Greater color contrast ratio|CC5500|FFFFFF|000000|css=y}}">CC5500</span> → CC5500
• <span style="background:#CC5500; color:#{{Greater color contrast ratio|CC5500|FFFFFF|000000|bias=1}}">CC5500</span> → CC5500
• <span style="{{Greater color contrast ratio|CC5500|FFFFFF|000000|bias=1|css=y}}">CC5500</span> → CC5500
• <span style="background:Not a color; color:#{{Greater color contrast ratio|Not a color|FFFFFF|000000}}">Not a color</span> → Not a color
• <span style="{{Greater color contrast ratio|Not a color|FFFFFF|000000|css=y}}">Not a color</span> → Not a color

Một số tham số khác

Tham số bias nên thận trọng khi sử dụng hỗ trợ truy cập. Như đã nêu ở trên, khi được sử dụng mà không có sai lệch và với color2 và color3 bằng trắng và đen, cặp màu được chọn sẽ luôn có tỷ lệ tương phản lớn hơn 4,58. Độ lệch 1,25, mức tối thiểu có thể xuống còn 4.0, có thể không đáp ứng các tiêu chuẩn hỗ trợ truy cập.

Xem thêm

• {{Ensure AAA contrast ratio}}
• {{Ensure AA contrast ratio}}
• Template:Color contrast conformance § HTML colors
• Wikipedia:Manual of Style/Accessibility § Color

Tài liệu bên trên được truyền tải từ Bản mẫu:Greater color contrast ratio/doc. (sửa | lịch sử)
Biên tập viên sửa đổi có thể thử nghiệm trong các trang chỗ thử (tạo | sao) và trường hợp kiểm thử (tạo) của bản mẫu này.
Xin hãy bổ sung các thể loại vào trang con /doc. Các trang con của bản mẫu này.