ಕಾಂಟ್ರಾಸ್ಟ್ ಚೆಕ್ಕರ್ನ ಕಾರ್ಯನಿರ್ವಹಣೆ
ಕಾಂಟ್ರಾಸ್ಟ್ ಚೆಕ್ಕರ್ (Contrast Checker) ಉಪಕರಣವು WCAG 2.1 / 2.2 ಮಾನದಂಡಗಳ ಪ್ರಕಾರ ಪಠ್ಯದ ಬಣ್ಣ ಮತ್ತು ಹಿನ್ನೆಲೆ ಬಣ್ಣಗಳ ನಡುವಿನ ಕಾಂಟ್ರಾಸ್ಟ್ ಅನುಪಾತವನ್ನು ಲೆಕ್ಕಹಾಕಲು ನಿಮಗೆ ಅನುಮತಿಸುತ್ತದೆ. ನೀವು ನಮೂದಿಸುವ ಬಣ್ಣಗಳ ಸಂಯೋಜನೆಯು ಸಾಮಾನ್ಯ ಪಠ್ಯ, ದೊಡ್ಡ ಪಠ್ಯ ಮತ್ತು UI ಘಟಕಗಳಿಗೆ ಯಾವ ಆಕ್ಸೆಸಿಬಿಲಿಟಿ ಮಟ್ಟಗಳನ್ನು (AA ಮತ್ತು AAA) ಉತ್ತೀರ್ಣಗೊಳಿಸುತ್ತದೆ ಎಂಬುದನ್ನು ಈ ಉಪಕರಣವು ಪ್ರದರ್ಶಿಸುತ್ತದೆ.
ಈ ಉಪಕರಣವು ವೆಬ್ ಆಕ್ಸೆಸಿಬಿಲಿಟಿ ನಿಯಮಗಳನ್ನು ಪಾಲಿಸಲು ಮತ್ತು ವಿನ್ಯಾಸಗಳ ಓದುವಿಕೆಯನ್ನು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಲು ಸಹಾಯ ಮಾಡುತ್ತದೆ. ಆರಂಭಿಕ ಹಂತದಲ್ಲಿ, ಈ ಉಪಕರಣವು ಪಠ್ಯಕ್ಕಾಗಿ #4f46e5 ಮತ್ತು ಹಿನ್ನೆಲೆಗಾಗಿ #ffffff ಬಣ್ಣಗಳನ್ನು ಹೊಂದಿರುತ್ತದೆ, ಇದು 6.29 ಕಾಂಟ್ರಾಸ್ಟ್ ಅನುಪಾತವನ್ನು ನೀಡುತ್ತದೆ.
ಇನ್ಪುಟ್ ಬಣ್ಣದ ಫಾರ್ಮ್ಯಾಟ್ಗಳು
ಈ ಉಪಕರಣದಲ್ಲಿ ಪರೀಕ್ಷಿಸಲು ನೀವು ಪಠ್ಯದ ಬಣ್ಣ (Text color) ಮತ್ತು ಹಿನ್ನೆಲೆ ಬಣ್ಣ (Background color) ಎರಡನ್ನೂ ನಮೂದಿಸಬೇಕು. ಉಪಕರಣವು ಈ ಕೆಳಗಿನ ಬಣ್ಣದ ಫಾರ್ಮ್ಯಾಟ್ಗಳನ್ನು ಸ್ವೀಕರಿಸುತ್ತದೆ:
- ಹೆಕ್ಸ್ (Hex) ಮೌಲ್ಯಗಳು: ಉದಾಹರಣೆಗೆ
#1a1a1a. - rgb() ಮೌಲ್ಯಗಳು: ಉದಾಹರಣೆಗೆ
rgb(26, 26, 26). - hsl() ಮೌಲ್ಯಗಳು.
ಬಣ್ಣಗಳನ್ನು ನಮೂದಿಸಿದ ನಂತರ, ಪಠ್ಯ ಮತ್ತು ಹಿನ್ನೆಲೆ ಬಣ್ಣಗಳನ್ನು ಪರಸ್ಪರ ಬದಲಾಯಿಸಲು ನೀವು ಸ್ವಾಪ್ (swap) ಬಟನ್ ಅನ್ನು ಬಳಸಬಹುದು.
ಒಂದು ವೇಳೆ ನೀವು ಅಮಾನ್ಯವಾದ ಬಣ್ಣದ ಮೌಲ್ಯಗಳನ್ನು ನಮೂದಿಸಿದರೆ, ಉಪಕರಣವು ಈ ಕೆಳಗಿನ ದೋಷ ಸಂದೇಶಗಳನ್ನು ತೋರಿಸುತ್ತದೆ:
- ಅಮಾನ್ಯವಾದ ಪಠ್ಯದ ಬಣ್ಣವನ್ನು ನಮೂದಿಸಿದಾಗ: "#1a1a1a ಅಥವಾ rgb(26, 26, 26) ನಂತಹ ಮಾನ್ಯವಾದ ಪಠ್ಯದ ಬಣ್ಣವನ್ನು ನಮೂದಿಸಿ."
- ಅಮಾನ್ಯವಾದ ಹಿನ್ನೆಲೆ ಬಣ್ಣವನ್ನು ನಮೂದಿಸಿದಾಗ: "#ffffff ಅಥವಾ rgb(255, 255, 255) ನಂತಹ ಮಾನ್ಯವಾದ ಹಿನ್ನೆಲೆ ಬಣ್ಣವನ್ನು ನಮೂದಿಸಿ."
ಔಟ್ಪುಟ್ ಮತ್ತು ಫಲಿತಾಂಶಗಳ ವಿವರಣೆ
ಬಣ್ಣಗಳನ್ನು ವಿಶ್ಲೇಷಿಸಿದ ನಂತರ ಉಪಕರಣವು ಈ ಕೆಳಗಿನ ಫಲಿತಾಂಶಗಳನ್ನು ಪ್ರದರ್ಶಿಸುತ್ತದೆ:
- ಕಾಂಟ್ರಾಸ್ಟ್ ಅನುಪಾತ: ಪಠ್ಯ ಮತ್ತು ಹಿನ್ನೆಲೆ ಬಣ್ಣಗಳ ನಡುವೆ ಲೆಕ್ಕಹಾಕಿದ ಅನುಪಾತವನ್ನು "X:1" ರೂಪದಲ್ಲಿ ತೋರಿಸಲಾಗುತ್ತದೆ. ಈ ಅನುಪಾತವು 1:1 (ಯಾವುದೇ ಕಾಂಟ್ರಾಸ್ಟ್ ಇಲ್ಲ) ಇಂದ 21:1 (ಬಿಳಿ ಬಣ್ಣದ ಮೇಲೆ ಕಪ್ಪು) ವರೆಗೆ ಇರುತ್ತದೆ.
- ಸಾಮಾನ್ಯ ಪಠ್ಯ: ಸಾಮಾನ್ಯ ಪಠ್ಯಕ್ಕೆ AA ಮತ್ತು AAA ಮಟ್ಟಗಳಿಗೆ "ಉತ್ತೀರ್ಣ (Pass)" ಅಥವಾ "ವಿಫಲ (Fail)" ಫಲಿತಾಂಶವನ್ನು ತೋರಿಸುತ್ತದೆ.
- ದೊಡ್ಡ ಪಠ್ಯ: ದೊಡ್ಡ ಪಠ್ಯಕ್ಕೆ AA ಮತ್ತು AAA ಮಟ್ಟಗಳಿಗೆ "ಉತ್ತೀರ್ಣ (Pass)" ಅಥವಾ "ವಿಫಲ (Fail)" ಫಲಿತಾಂಶವನ್ನು ತೋರಿಸುತ್ತದೆ.
- UI ಮತ್ತು ಗ್ರಾಫಿಕ್ಸ್: ಇದು ಕೇವಲ 3:1 ರ ಒಂದೇ ಒಂದು ಮಿತಿಯ ವಿರುದ್ಧ "ಉತ್ತೀರ್ಣ (Pass)" ಅಥವಾ "ವಿಫಲ (Fail)" ಫಲಿತಾಂಶವನ್ನು ತೋರಿಸುತ್ತದೆ. ಈ ಸಾಲಿಗೆ ಯಾವುದೇ AA ಅಥವಾ AAA ಎಂಬ ಪ್ರತ್ಯೇಕ ವಿಭಾಗಗಳಿರುವುದಿಲ್ಲ.
- ಅಂತಿಮ ತೀರ್ಪು (Verdict): ಬಣ್ಣದ ಸಂಯೋಜನೆಯು ಉತ್ತೀರ್ಣವಾಗಿರುವ ಅತ್ಯುನ್ನತ ಮಟ್ಟವನ್ನು ಆಧರಿಸಿ ಈ ಕೆಳಗಿನ ಸಾರಾಂಶ ಸಂದೇಶಗಳಲ್ಲಿ ಒಂದನ್ನು ಪ್ರದರ್ಶಿಸಲಾಗುತ್ತದೆ:
- "ಸಾಮಾನ್ಯ ಪಠ್ಯಕ್ಕಾಗಿ AA ಮತ್ತು AAA ಉತ್ತೀರ್ಣವಾಗಿದೆ."
- "ಸಾಮಾನ್ಯ ಪಠ್ಯಕ್ಕಾಗಿ AA ಉತ್ತೀರ್ಣವಾಗಿದೆ."
- "ದೊಡ್ಡ ಪಠ್ಯಕ್ಕಾಗಿ ಮಾತ್ರ AA ಉತ್ತೀರ್ಣವಾಗಿದೆ."
- "AA ಕನಿಷ್ಠ ಮಿತಿಗಿಂತ ಕಡಿಮೆ ಇದೆ — ಕಾಂಟ್ರಾಸ್ಟ್ ಹೆಚ್ಚಿಸಿ."
ಕಾಂಟ್ರಾಸ್ಟ್ ನಿಯಮಗಳು ಮತ್ತು ಮಾನದಂಡಗಳು
ವಿವಿಧ ಆಕ್ಸೆಸಿಬಿಲಿಟಿ ಮಟ್ಟಗಳನ್ನು ತಲುಪಲು WCAG 2.1 / 2.2 ಸೂತ್ರದ ಪ್ರಕಾರ ಈ ಕೆಳಗಿನ ಕಾಂಟ್ರಾಸ್ಟ್ ಅನುಪಾತದ ನಿಯಮಗಳನ್ನು ಪಾಲಿಸಬೇಕಾಗುತ್ತದೆ:
- ಸಾಮಾನ್ಯ ಪಠ್ಯ: AA ಮಟ್ಟಕ್ಕೆ ಕನಿಷ್ಠ 4.5:1 ಅನುಪಾತದ ಅಗತ್ಯವಿದೆ, ಮತ್ತು AAA ಮಟ್ಟಕ್ಕೆ ಕನಿಷ್ಠ 7:1 ಅನುಪಾತದ ಅಗತ್ಯವಿದೆ.
- ದೊಡ್ಡ ಪಠ್ಯ: AA ಮಟ್ಟಕ್ಕೆ ಕನಿಷ್ಠ 3:1 ಅನುಪಾತದ ಅಗತ್ಯವಿದೆ, ಮತ್ತು AAA ಮಟ್ಟಕ್ಕೆ ಕನಿಷ್ಠ 4.5:1 ಅನುಪಾತದ ಅಗತ್ಯವಿದೆ. ಇಲ್ಲಿ ದೊಡ್ಡ ಪಠ್ಯ ಎಂದರೆ 18pt (ಸುಮಾರು 24px) ಅಥವಾ ಅದಕ್ಕಿಂತ ಹೆಚ್ಚಿನ ಗಾತ್ರದ ಪಠ್ಯ, ಅಥವಾ ಬೋಲ್ಡ್ ಆಗಿದ್ದಾಗ 14pt (ಸುಮಾರು 18.5px) ಗಾತ್ರದ ಪಠ್ಯವಾಗಿದೆ.
- UI ಮತ್ತು ಗ್ರಾಫಿಕ್ಸ್: ಈ ಘಟಕಗಳಿಗೆ ಕನಿಷ್ಠ 3:1 ಅನುಪಾತದ ಅಗತ್ಯವಿರುತ್ತದೆ.
ಈ ಉಪಕರಣದ ಅಗತ್ಯವಿರುವವರು
ವೆಬ್ ವಿನ್ಯಾಸ ಮತ್ತು ಅಭಿವೃದ್ಧಿಯಲ್ಲಿ ತೊಡಗಿರುವ ವಿವಿಧ ವೃತ್ತಿಪರರಿಗೆ ಈ ಉಪಕರಣವು ಉಪಯುಕ್ತವಾಗಿದೆ:
- ಡಿಸೈನರ್ಗಳು: ಪಠ್ಯ ಮತ್ತು ವಿವಿಧ ವಿನ್ಯಾಸ ಘಟಕಗಳ ಓದುವಿಕೆಯನ್ನು ಪರಿಶೀಲಿಸಲು.
- ಡೆವಲಪರ್ಗಳು: ತಮ್ಮ ವೆಬ್ಸೈಟ್ಗಳು ಮತ್ತು ಅಪ್ಲಿಕೇಶನ್ಗಳು ಅಧಿಕೃತ ಆಕ್ಸೆಸಿಬಿಲಿಟಿ ಮಾನದಂಡಗಳನ್ನು ಪೂರೈಸುತ್ತವೆಯೇ ಎಂಬುದನ್ನು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಲು.
- ಕಂಟೆಂಟ್ ತಂಡಗಳು: ತಾವು ಬಳಸುವ ಬಣ್ಣಗಳು ಮತ್ತು ಪ್ರಕಟಿಸುವ ವಿಷಯಗಳ ಬಣ್ಣದ ಕಾಂಟ್ರಾಸ್ಟ್ ಅನ್ನು ಪರಿಶೀಲಿಸಲು.
ಗೌಪ್ಯತೆ ಮತ್ತು ಡೇಟಾ ಸಂಸ್ಕರಣೆ
ಈ ಉಪಕರಣವನ್ನು ಬಳಸುವಾಗ ನಿಮ್ಮ ಗೌಪ್ಯತೆಗೆ ಸಂಪೂರ್ಣ ರಕ್ಷಣೆ ಇರುತ್ತದೆ. ಪ್ರತಿಯೊಂದು ತಪಾಸಣೆಯೂ ನಿಮ್ಮ ಬ್ರೌಸರ್ನಲ್ಲೇ ರನ್ ಆಗುತ್ತದೆ. ನೀವು ಇಲ್ಲಿ ನಮೂದಿಸುವ ಯಾವುದೇ ಮಾಹಿತಿಯನ್ನು BroBroGo ಗೆ ಅಪ್ಲೋಡ್ ಮಾಡಲಾಗುವುದಿಲ್ಲ.
FAQ (ಪದೇ ಪದೇ ಕೇಳಲಾಗುವ ಪ್ರಶ್ನೆಗಳು)
AA ಮತ್ತು AAA ಫಲಿತಾಂಶಗಳ ಅರ್ಥವೇನು?
ಹೆಚ್ಚಿನ ವೆಬ್ಸೈಟ್ಗಳು AA ಮಟ್ಟವನ್ನು ಗುರಿಯಾಗಿಸಿಕೊಂಡಿರುತ್ತವೆ: ಇದಕ್ಕೆ ಸಾಮಾನ್ಯ ಪಠ್ಯಕ್ಕೆ ಕನಿಷ್ಠ 4.5:1 ಮತ್ತು ದೊಡ್ಡ ಪಠ್ಯಕ್ಕೆ 3:1 ಅನುಪಾತದ ಅಗತ್ಯವಿದೆ. AAA ಹೆಚ್ಚು ಕಟ್ಟುನಿಟ್ಟಾಗಿದೆ — ಸಾಮಾನ್ಯ ಪಠ್ಯಕ್ಕೆ 7:1 ಮತ್ತು ದೊಡ್ಡ ಪಠ್ಯಕ್ಕೆ 4.5:1 ರ ಅಗತ್ಯವಿರುತ್ತದೆ. ಅನುಪಾತವು 1:1 (ಯಾವುದೇ ಕಾಂಟ್ರಾಸ್ಟ್ ಇಲ್ಲ) ಇಂದ 21:1 (ಬಿಳಿ ಬಣ್ಣದ ಮೇಲೆ ಕಪ್ಪು) ವರೆಗೆ ಇರುತ್ತದೆ.
ದೊಡ್ಡ ಪಠ್ಯ (large text) ಎಂದು ಯಾವುದನ್ನು ಪರಿಗಣಿಸಲಾಗುತ್ತದೆ?
18pt (ಸುಮಾರು 24px) ನಿಂದ ಪ್ರಾರಂಭವಾಗುವ ಪಠ್ಯ, ಅಥವಾ ಬೋಲ್ಡ್ ಆಗಿದ್ದಾಗ 14pt (ಸುಮಾರು 18.5px) ಇರುವ ಪಠ್ಯವನ್ನು ದೊಡ್ಡ ಪಠ್ಯ ಎನ್ನಲಾಗುತ್ತದೆ. ದೊಡ್ಡ ಪಠ್ಯವು ಕಡಿಮೆ ಕಾಂಟ್ರಾಸ್ಟ್ನಲ್ಲೂ ಸುಲಭವಾಗಿ ಓದಬಲ್ಲದಾಗಿರುತ್ತದೆ, ಆದ್ದರಿಂದ ಇದು ಸಾಮಾನ್ಯ ಪಠ್ಯದ ಕಟ್ಟುನಿಟ್ಟಾದ ಮಿತಿಗಳ ಬದಲಿಗೆ 3:1 ರಲ್ಲಿ AA ಮತ್ತು 4.5:1 ರಲ್ಲಿ AAA ಪಾಸ್ ಆಗುತ್ತದೆ.
ನಾನು ಯಾವ ಬಣ್ಣದ ಫಾರ್ಮ್ಯಾಟ್ಗಳನ್ನು ನಮೂದಿಸಬಹುದು?
ನೀವು #1a1a1a ನಂತಹ ಹೆಕ್ಸ್ ಮೌಲ್ಯ, rgb(26, 26, 26) ನಂತಹ rgb() ಮೌಲ್ಯ ಅಥವಾ hsl() ಮೌಲ್ಯವನ್ನು ಟೈಪ್ ಮಾಡಬಹುದು — ಅಥವಾ ಬಣ್ಣವನ್ನು ಆಯ್ಕೆ ಮಾಡಲು ಯಾವುದೇ ಸ್ವ್ಯಾಚ್ ಮೇಲೆ ಕ್ಲಿಕ್ ಮಾಡಬಹುದು. ಪಠ್ಯ ಮತ್ತು ಹಿನ್ನೆಲೆ ಬಣ್ಣಗಳನ್ನು ಪರಸ್ಪರ ಬದಲಾಯಿಸಲು ಸ್ವಾಪ್ (swap) ಬಟನ್ ಅನ್ನು ಬಳಸಬಹುದು.
ಇದು WCAG 2 ಅಥವಾ ಹೊಸ APCA ವಿಧಾನವೇ?
ಈ ಉಪಕರಣವು WCAG 2.1 / 2.2 ಸೂತ್ರವನ್ನು ಬಳಸುತ್ತದೆ, ಇದನ್ನು ಇಂದಿನ ಆಕ್ಸೆಸಿಬಿಲಿಟಿ ನಿಯಮಗಳು ಮತ್ತು ಆಡಿಟ್ಗಳು ಅಧಿಕೃತವಾಗಿ ಉಲ್ಲೇಖಿಸುತ್ತವೆ. APCA ಎನ್ನುವುದು WCAG 3 ಗಾಗಿ ಇನ್ನೂ ಸಿದ್ಧಪಡಿಸಲಾಗುತ್ತಿರುವ ಹೊಸ ವಿಧಾನವಾಗಿದೆ — ಇದು ಭರವಸೆಯದಾಗಿದ್ದರೂ ಇನ್ನೂ ಅನುಸರಣೆಯ ಮಾನದಂಡವಾಗಿಲ್ಲ, ಆದ್ದರಿಂದ ಇಲ್ಲಿನ ಫಲಿತಾಂಶಗಳು ಅದನ್ನು ಬಳಸುವುದಿಲ್ಲ.