Bản mẫu:Greater color contrast ratio/doc
Đây là một trang con tài liệu sử dụng bản mẫu dành cho Bản mẫu:Greater color contrast ratio. Nó gồm có các thông tin hướng dẫn sử dụng, thể loại và các nội dung khác không thuộc về phần trang bản mẫu gốc. |
Bản mẫu này được sử dụng ở khoảng 18.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ụ[sửa mã nguồn]
<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[sửa mã nguồn]
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[sửa mã nguồn]
- {{Ensure AAA contrast ratio}}
- {{Ensure AA contrast ratio}}
- Template:Color contrast conformance § HTML colors
- Wikipedia:Manual of Style/Accessibility § Color