Bản mẫu:Greater color contrast ratio
 | Bản mẫu này được sử dụng ở khoảng 22.000 trang, vì thế những thay đổi đến nó sẽ hiện ra rõ ràng. Vui lòng thử nghiệm các thay đổi ở trang con /sandbox, /testcases của bản mẫu, hoặc ở không gian người dùng của bạn. Cân nhắc thảo luận các thay đổi tại trang thảo luận trước khi áp dụng sửa đổi. |
 | Bản mẫu này sử dụng Lua: |
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
- Color conversion templates