ಸುಲಭವಾಗಿ ಪ್ರವೇಶಿಸಬಹುದಾದ ಟೋಸ್ಟ್ ನೋಟಿಫಿಕೇಶನ್‌ಗಳನ್ನು ರಚಿಸುವ ಬಗ್ಗೆ ಆಳವಾದ ವಿಶ್ಲೇಷಣೆ. ಜಾಗತಿಕ ಪ್ರೇಕ್ಷಕರಿಗಾಗಿ ಎಲ್ಲರನ್ನೂ ಒಳಗೊಂಡ ತಾತ್ಕಾಲಿಕ ಸಂದೇಶಗಳನ್ನು ನಿರ್ಮಿಸಲು WCAG ತತ್ವಗಳು, ARIA ಪಾತ್ರಗಳು ಮತ್ತು UX ಉತ್ತಮ ಅಭ್ಯಾಸಗಳನ್ನು ಕಲಿಯಿರಿ.
ಟೋಸ್ಟ್ ನೋಟಿಫಿಕೇಶನ್‌ಗಳು: ಸುಲಭವಾಗಿ ಪ್ರವೇಶಿಸಬಹುದಾದ, ಬಳಕೆದಾರ-ಸ್ನೇಹಿ ತಾತ್ಕಾಲಿಕ ಸಂದೇಶಗಳನ್ನು ರಚಿಸುವುದು
ಡಿಜಿಟಲ್ ಇಂಟರ್ಫೇಸ್‌ಗಳ ವೇಗದ ಜಗತ್ತಿನಲ್ಲಿ, ಒಂದು ಸಿಸ್ಟಮ್ ಮತ್ತು ಅದರ ಬಳಕೆದಾರರ ನಡುವಿನ ಸಂವಹನವು ಅತ್ಯಂತ ಮುಖ್ಯವಾಗಿದೆ. ನಮ್ಮ ಕ್ರಿಯೆಗಳ ಫಲಿತಾಂಶಗಳನ್ನು ಅರ್ಥಮಾಡಿಕೊಳ್ಳಲು ನಾವು ದೃಶ್ಯ ಸೂಚನೆಗಳನ್ನು ಅವಲಂಬಿಸಿದ್ದೇವೆ. ಈ ಪ್ರತಿಕ್ರಿಯೆಗಾಗಿ ಅತ್ಯಂತ ಸಾಮಾನ್ಯವಾದ UI ಮಾದರಿಗಳಲ್ಲಿ ಒಂದು 'ಟೋಸ್ಟ್' ನೋಟಿಫಿಕೇಶನ್‌ ಆಗಿದೆ—ಇದು ತಾತ್ಕಾಲಿಕ ಮಾಹಿತಿಯನ್ನು ಒದಗಿಸುವ ಒಂದು ಸಣ್ಣ, ನಾನ್-ಮೋಡಲ್ ಪಾಪ್-ಅಪ್. ಅದು "ಸಂದೇಶ ಕಳುಹಿಸಲಾಗಿದೆ" ಎಂದು ಖಚಿತಪಡಿಸುವುದಾಗಿರಲಿ, "ಫೈಲ್ ಅಪ್‌ಲೋಡ್ ಆಗಿದೆ" ಎಂದು ತಿಳಿಸುವುದಾಗಿರಲಿ, ಅಥವಾ "ನೀವು ಸಂಪರ್ಕವನ್ನು ಕಳೆದುಕೊಂಡಿದ್ದೀರಿ" ಎಂದು ಎಚ್ಚರಿಸುವುದಾಗಿರಲಿ, ಟೋಸ್ಟ್‌ಗಳು ಬಳಕೆದಾರರ ಪ್ರತಿಕ್ರಿಯೆಯ ಸೂಕ್ಷ್ಮ ಕೆಲಸಗಾರರಾಗಿವೆ.
ಆದಾಗ್ಯೂ, ಅವುಗಳ ತಾತ್ಕಾಲಿಕ ಮತ್ತು ಸೂಕ್ಷ್ಮ ಸ್ವಭಾವವು ಎರಡು ಬದಿಯ ಕತ್ತಿಯಾಗಿದೆ. ಕೆಲವು ಬಳಕೆದಾರರಿಗೆ ಕನಿಷ್ಠ ಅಡಚಣೆಯಾಗಿದ್ದರೂ, ಇದೇ ಗುಣಲಕ್ಷಣವು ಇತರರಿಗೆ, ವಿಶೇಷವಾಗಿ ಸ್ಕ್ರೀನ್ ರೀಡರ್‌ಗಳಂತಹ ಸಹಾಯಕ ತಂತ್ರಜ್ಞಾನಗಳನ್ನು ಅವಲಂಬಿಸಿರುವವರಿಗೆ, ಅವುಗಳನ್ನು ಸಂಪೂರ್ಣವಾಗಿ ಪ್ರವೇಶಿಸಲಾಗದಂತೆ ಮಾಡುತ್ತದೆ. ಪ್ರವೇಶಿಸಲಾಗದ ಟೋಸ್ಟ್ ನೋಟಿಫಿಕೇಶನ್‌ ಕೇವಲ ಸಣ್ಣ ಅನಾನುಕೂಲತೆಯಲ್ಲ; ಅದೊಂದು ಮೌನ ವೈಫಲ್ಯ, ಬಳಕೆದಾರರನ್ನು ಅನಿಶ್ಚಿತತೆ ಮತ್ತು ಹತಾಶೆಯಲ್ಲಿ ಬಿಡುತ್ತದೆ. "ಸೆಟ್ಟಿಂಗ್ಸ್ ಉಳಿಸಲಾಗಿದೆ" ಎಂಬ ಸಂದೇಶವನ್ನು ಗ್ರಹಿಸಲು ಸಾಧ್ಯವಾಗದ ಬಳಕೆದಾರರು ಅದನ್ನು ಮತ್ತೆ ಉಳಿಸಲು ಪ್ರಯತ್ನಿಸಬಹುದು ಅಥವಾ ತಮ್ಮ ಬದಲಾವಣೆಗಳು ಯಶಸ್ವಿಯಾಯಿತೇ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳದೆ ಅಪ್ಲಿಕೇಶನ್‌ನಿಂದ ಹೊರನಡೆಯಬಹುದು.
ಈ ಸಮಗ್ರ ಮಾರ್ಗದರ್ಶಿಯು ನಿಜವಾಗಿಯೂ ಒಳಗೊಳ್ಳುವ ಡಿಜಿಟಲ್ ಉತ್ಪನ್ನಗಳನ್ನು ನಿರ್ಮಿಸಲು ಬಯಸುವ ಡೆವಲಪರ್‌ಗಳು, UX/UI ವಿನ್ಯಾಸಕರು ಮತ್ತು ಉತ್ಪನ್ನ ವ್ಯವಸ್ಥಾಪಕರಿಗಾಗಿ ಆಗಿದೆ. ನಾವು ಟೋಸ್ಟ್ ನೋಟಿಫಿಕೇಶನ್‌ಗಳ ಅಂತರ್ಗತ ಪ್ರವೇಶಿಸುವಿಕೆ ಸವಾಲುಗಳನ್ನು ಅನ್ವೇಷಿಸುತ್ತೇವೆ, ARIA (Accessible Rich Internet Applications) ಬಳಸಿ ತಾಂತ್ರಿಕ ಪರಿಹಾರಗಳ ಬಗ್ಗೆ ಆಳವಾಗಿ ಚರ್ಚಿಸುತ್ತೇವೆ, ಮತ್ತು ಎಲ್ಲರಿಗೂ ಪ್ರಯೋಜನವಾಗುವ ವಿನ್ಯಾಸದ ಉತ್ತಮ ಅಭ್ಯಾಸಗಳನ್ನು ವಿವರಿಸುತ್ತೇವೆ. ಈ ತಾತ್ಕಾಲಿಕ ಸಂದೇಶಗಳನ್ನು ಪ್ರವೇಶಿಸಬಹುದಾದ ಬಳಕೆದಾರ ಅನುಭವದ ಶಾಶ್ವತ ಭಾಗವನ್ನಾಗಿ ಮಾಡುವುದು ಹೇಗೆಂದು ಕಲಿಯೋಣ.
ಟೋಸ್ಟ್ ನೋಟಿಫಿಕೇಶನ್‌ಗಳೊಂದಿಗೆ ಪ್ರವೇಶಿಸುವಿಕೆಯ ಸವಾಲು
ಪರಿಹಾರವನ್ನು ಅರ್ಥಮಾಡಿಕೊಳ್ಳಲು, ನಾವು ಮೊದಲು ಸಮಸ್ಯೆಯನ್ನು ಆಳವಾಗಿ ಅರ್ಥಮಾಡಿಕೊಳ್ಳಬೇಕು. ಸಾಂಪ್ರದಾಯಿಕ ಟೋಸ್ಟ್ ನೋಟಿಫಿಕೇಶನ್‌ಗಳು ತಮ್ಮ ಮೂಲ ವಿನ್ಯಾಸ ತತ್ವಗಳಿಂದಾಗಿ ಅನೇಕ ಪ್ರವೇಶಿಸುವಿಕೆ ರಂಗಗಳಲ್ಲಿ ವಿಫಲವಾಗುತ್ತವೆ.
1. ಅವು ಅಲ್ಪಕಾಲಿಕ ಮತ್ತು ಸಮಯ-ಆಧಾರಿತವಾಗಿವೆ
ಟೋಸ್ಟ್‌ನ ನಿರ್ಣಾಯಕ ಲಕ್ಷಣವೆಂದರೆ ಅದರ ಕ್ಷಣಿಕ ಅಸ್ತಿತ್ವ. ಇದು ಕೆಲವು ಸೆಕೆಂಡುಗಳ ಕಾಲ ಕಾಣಿಸಿಕೊಳ್ಳುತ್ತದೆ ಮತ್ತು ನಂತರ ನಿಧಾನವಾಗಿ ಮಾಯವಾಗುತ್ತದೆ. ದೃಷ್ಟಿ ಇರುವ ಬಳಕೆದಾರರಿಗೆ, ಸಂದೇಶವನ್ನು ಓದಲು ಇದು ಸಾಮಾನ್ಯವಾಗಿ ಸಾಕಷ್ಟು ಸಮಯ. ಆದಾಗ್ಯೂ, ಸ್ಕ್ರೀನ್ ರೀಡರ್ ಬಳಕೆದಾರರಿಗೆ, ಇದೊಂದು ಗಮನಾರ್ಹ ಅಡಚಣೆಯಾಗಿದೆ. ಸ್ಕ್ರೀನ್ ರೀಡರ್ ವಿಷಯವನ್ನು ರೇಖೀಯವಾಗಿ ಪ್ರಕಟಿಸುತ್ತದೆ. ಬಳಕೆದಾರರು ಫಾರ್ಮ್ ಫೀಲ್ಡ್ ಮೇಲೆ ಕೇಂದ್ರೀಕರಿಸಿದ್ದರೆ ಅಥವಾ ಬೇರೆ ವಿಷಯವನ್ನು ಓದುವುದನ್ನು ಕೇಳುತ್ತಿದ್ದರೆ, ಸ್ಕ್ರೀನ್ ರೀಡರ್ ಅದಕ್ಕೆ ತಲುಪುವ ಮೊದಲೇ ಟೋಸ್ಟ್ ಕಾಣಿಸಿಕೊಂಡು ಮಾಯವಾಗಬಹುದು. ಇದು ಮಾಹಿತಿ ಅಂತರವನ್ನು ಸೃಷ್ಟಿಸುತ್ತದೆ, ಪ್ರವೇಶಿಸುವಿಕೆಯ ಮೂಲಭೂತ ತತ್ವವನ್ನು ಉಲ್ಲಂಘಿಸುತ್ತದೆ: ಮಾಹಿತಿಯು ಗ್ರಹಿಸಬಲ್ಲದಾಗಿರಬೇಕು.
2. ಅವು ಫೋಕಸ್ ಪಡೆಯುವುದಿಲ್ಲ
ಟೋಸ್ಟ್‌ಗಳನ್ನು ಅಡಚಣೆಯಾಗದಂತೆ ವಿನ್ಯಾಸಗೊಳಿಸಲಾಗಿದೆ. ಅವು ಉದ್ದೇಶಪೂರ್ವಕವಾಗಿ ಬಳಕೆದಾರರ ಪ್ರಸ್ತುತ ಕಾರ್ಯದಿಂದ ಫೋಕಸ್ ಅನ್ನು ಕದಿಯುವುದಿಲ್ಲ. ದೃಷ್ಟಿ ಇರುವ ಬಳಕೆದಾರರು ಟೆಕ್ಸ್ಟ್ ಫೀಲ್ಡ್‌ನಲ್ಲಿ ಟೈಪ್ ಮಾಡುವುದನ್ನು ಮುಂದುವರಿಸಬಹುದು, ಅದೇ ಸಮಯದಲ್ಲಿ "ಕರಡು ಉಳಿಸಲಾಗಿದೆ" ಎಂಬ ಸಂದೇಶವು ಕಾಣಿಸಿಕೊಳ್ಳುತ್ತದೆ. ಆದರೆ ಕೀಬೋರ್ಡ್-ಮಾತ್ರ ಬಳಕೆದಾರರು ಮತ್ತು ಸ್ಕ್ರೀನ್ ರೀಡರ್ ಬಳಕೆದಾರರಿಗೆ, ಫೋಕಸ್ ಅವರ ಸಂಚರಣೆ ಮತ್ತು ಸಂವಹನದ ಪ್ರಾಥಮಿಕ ವಿಧಾನವಾಗಿದೆ. ಟೋಸ್ಟ್ ಫೋಕಸ್ ಕ್ರಮದಲ್ಲಿ ಇಲ್ಲದಿರುವುದರಿಂದ, ಅದು ರೇಖೀಯ ಸಂಚರಣಾ ಮಾರ್ಗಕ್ಕೆ ಅದೃಶ್ಯವಾಗಿರುತ್ತದೆ. ಬಳಕೆದಾರರು ತಮಗೆ ಅಸ್ತಿತ್ವದಲ್ಲಿದೆಯೆಂದು ತಿಳಿಯದ ಸಂದೇಶಕ್ಕಾಗಿ ಇಡೀ ಪುಟವನ್ನು ಹಸ್ತಚಾಲಿತವಾಗಿ ಹುಡುಕಬೇಕಾಗುತ್ತದೆ.
3. ಅವು ಸಂದರ್ಭದ ಹೊರಗೆ ಕಾಣಿಸಿಕೊಳ್ಳುತ್ತವೆ
ಟೋಸ್ಟ್‌ಗಳು ಸಾಮಾನ್ಯವಾಗಿ ಪರದೆಯ ಪ್ರತ್ಯೇಕ ಪ್ರದೇಶದಲ್ಲಿ, ಉದಾಹರಣೆಗೆ ಮೇಲಿನ-ಬಲ ಅಥವಾ ಕೆಳಗಿನ-ಎಡ ಮೂಲೆಯಲ್ಲಿ ಕಾಣಿಸಿಕೊಳ್ಳುತ್ತವೆ, ಅವುಗಳನ್ನು ಪ್ರಚೋದಿಸಿದ ಅಂಶದಿಂದ (ಉದಾ. ಫಾರ್ಮ್‌ನ ಮಧ್ಯದಲ್ಲಿರುವ 'ಉಳಿಸು' ಬಟನ್) ದೂರದಲ್ಲಿರುತ್ತವೆ. ಈ ಪ್ರಾದೇಶಿಕ ಅಸಂಪರ್ಕವನ್ನು ದೃಷ್ಟಿಯಿಂದ ಸುಲಭವಾಗಿ ನಿವಾರಿಸಬಹುದು ಆದರೆ ಸ್ಕ್ರೀನ್ ರೀಡರ್‌ಗಳಿಗೆ ತಾರ್ಕಿಕ ಹರಿವನ್ನು ಮುರಿಯುತ್ತದೆ. ಪ್ರಕಟಣೆ, ಒಂದು ವೇಳೆ ಸಂಭವಿಸಿದರೂ, ಬಳಕೆದಾರರ ಕೊನೆಯ ಕ್ರಿಯೆಯಿಂದ ಯಾದೃಚ್ಛಿಕ ಮತ್ತು ಸಂಪರ್ಕವಿಲ್ಲದಂತೆ ಅನಿಸಬಹುದು, ಇದು ಗೊಂದಲವನ್ನು ಉಂಟುಮಾಡುತ್ತದೆ.
WCAG ಗೆ ಸಂಪರ್ಕ: ಪ್ರವೇಶಿಸುವಿಕೆಯ ನಾಲ್ಕು ಆಧಾರಸ್ತಂಭಗಳು
ವೆಬ್ ಕಂಟೆಂಟ್ ಅಕ್ಸೆಸಿಬಿಲಿಟಿ ಗೈಡ್‌ಲೈನ್ಸ್ (WCAG) ನಾಲ್ಕು ತತ್ವಗಳ ಮೇಲೆ ನಿರ್ಮಿಸಲಾಗಿದೆ. ಪ್ರವೇಶಿಸಲಾಗದ ಟೋಸ್ಟ್‌ಗಳು ಅವುಗಳಲ್ಲಿ ಹಲವಾರು ತತ್ವಗಳನ್ನು ಉಲ್ಲಂಘಿಸುತ್ತವೆ.
- ಗ್ರಹಿಸಬಲ್ಲದು (Perceivable): ದೃಷ್ಟಿ ದೋಷವಿರುವ ಬಳಕೆದಾರರು ತಮ್ಮ ಸ್ಕ್ರೀನ್ ರೀಡರ್ ಅದನ್ನು ಪ್ರಕಟಿಸದ ಕಾರಣ ನೋಟಿಫಿಕೇಶನ್‌ ಅನ್ನು ಗ್ರಹಿಸಲು ಸಾಧ್ಯವಾಗದಿದ್ದರೆ, ಅಥವಾ ಅರಿವಿನ ಅಸಾಮರ್ಥ್ಯವಿರುವ ಬಳಕೆದಾರರಿಗೆ ಅದನ್ನು ಓದಲು ಸಾಕಷ್ಟು ಸಮಯವಿಲ್ಲದಿದ್ದರೆ, ಮಾಹಿತಿಯು ಗ್ರಹಿಸಬಲ್ಲದಲ್ಲ. ಇದು WCAG ಸಕ್ಸಸ್ ಕ್ರೈಟೀರಿಯನ್ 2.2.1 ಸಮಯ ಹೊಂದಾಣಿಕೆಗೆ ಸಂಬಂಧಿಸಿದೆ, ಇದು ಬಳಕೆದಾರರಿಗೆ ವಿಷಯವನ್ನು ಓದಲು ಮತ್ತು ಬಳಸಲು ಸಾಕಷ್ಟು ಸಮಯವನ್ನು ನೀಡಬೇಕೆಂದು ಬಯಸುತ್ತದೆ.
- ಕಾರ್ಯಸಾಧ್ಯ (Operable): ಟೋಸ್ಟ್ 'ಮುಚ್ಚು' ಬಟನ್‌ನಂತಹ ಕ್ರಿಯೆಯನ್ನು ಒಳಗೊಂಡಿದ್ದರೆ, ಅದು ಫೋಕಸ್ ಮಾಡಬಹುದಾದ ಮತ್ತು ಕೀಬೋರ್ಡ್ ಮೂಲಕ ಕಾರ್ಯನಿರ್ವಹಿಸಬಲ್ಲದಾಗಿರಬೇಕು. ಅದು ಕೇವಲ ಮಾಹಿತಿಪೂರ್ಣವಾಗಿದ್ದರೂ, ಬಳಕೆದಾರರು ಅದರ ಮೇಲೆ ನಿಯಂತ್ರಣವನ್ನು ಹೊಂದಿರಬೇಕು, ಉದಾಹರಣೆಗೆ ಅದನ್ನು ಹಸ್ತಚಾಲಿತವಾಗಿ ವಜಾಗೊಳಿಸುವ ಸಾಮರ್ಥ್ಯ.
- ಅರ್ಥವಾಗುವಂತಹದ್ದು (Understandable): ಟೋಸ್ಟ್‌ನ ವಿಷಯವು ಸ್ಪಷ್ಟ ಮತ್ತು ಸಂಕ್ಷಿಪ್ತವಾಗಿರಬೇಕು. ಸ್ಕ್ರೀನ್ ರೀಡರ್ ಸಂದರ್ಭದ ಹೊರಗೆ ಸಂದೇಶವನ್ನು ಪ್ರಕಟಿಸಿದರೆ, ಅದರ ಅರ್ಥವು ಅರ್ಥವಾಗದಿರಬಹುದು. ಇದು WCAG 4.1.2 ಹೆಸರು, ಪಾತ್ರ, ಮೌಲ್ಯಕ್ಕೂ ಸಂಬಂಧಿಸಿದೆ, ಇದು UI ಘಟಕದ ಉದ್ದೇಶವನ್ನು ಪ್ರೋಗ್ರಾಮಿಕ್ ಆಗಿ ನಿರ್ಧರಿಸಬಹುದೆಂದು ಬಯಸುತ್ತದೆ.
- ದೃಢವಾದದ್ದು (Robust): ನೋಟಿಫಿಕೇಶನ್‌ ಅನ್ನು ಸಹಾಯಕ ತಂತ್ರಜ್ಞಾನಗಳನ್ನು ಒಳಗೊಂಡಂತೆ ಪ್ರಸ್ತುತ ಮತ್ತು ಭವಿಷ್ಯದ ಬಳಕೆದಾರ ಏಜೆಂಟ್‌ಗಳೊಂದಿಗೆ ಹೊಂದಿಕೊಳ್ಳುವ ರೀತಿಯಲ್ಲಿ ಪ್ರಮಾಣಿತ ವೆಬ್ ತಂತ್ರಜ್ಞಾನಗಳನ್ನು ಬಳಸಿ ಕಾರ್ಯಗತಗೊಳಿಸಬೇಕು. ARIA ಮಾನದಂಡಗಳನ್ನು ನಿರ್ಲಕ್ಷಿಸುವ ಕಸ್ಟಮ್-ನಿರ್ಮಿತ ಟೋಸ್ಟ್ ದೃಢವಾಗಿರುವುದಿಲ್ಲ.
ತಾಂತ್ರಿಕ ಪರಿಹಾರ: ARIA ಲೈವ್ ರೀಜನ್‌ಗಳ ಸಹಾಯ
ಟೋಸ್ಟ್ ನೋಟಿಫಿಕೇಶನ್‌ಗಳನ್ನು ಪ್ರವೇಶಿಸಬಹುದಾದಂತೆ ಮಾಡುವ ಕೀಲಿಯು ARIA ಸ್ಪೆಸಿಫಿಕೇಶನ್‌ನ ಪ್ರಬಲ ಭಾಗದಲ್ಲಿದೆ: ಲೈವ್ ರೀಜನ್‌ಗಳು. ARIA ಲೈವ್ ರೀಜನ್ ಎನ್ನುವುದು ಪುಟದಲ್ಲಿ ನೀವು 'ಲೈವ್' ಎಂದು ಗೊತ್ತುಪಡಿಸುವ ಒಂದು ಅಂಶವಾಗಿದೆ. ಇದು ಸಹಾಯಕ ತಂತ್ರಜ್ಞಾನಗಳಿಗೆ ಆ ಅಂಶದ ವಿಷಯದಲ್ಲಿ ಯಾವುದೇ ಬದಲಾವಣೆಗಳಿಗಾಗಿ ಮೇಲ್ವಿಚಾರಣೆ ಮಾಡಲು ಮತ್ತು ಬಳಕೆದಾರರ ಫೋಕಸ್ ಅನ್ನು ಸರಿಸದೆಯೇ ಆ ಬದಲಾವಣೆಗಳನ್ನು ಅವರಿಗೆ ಪ್ರಕಟಿಸಲು ಹೇಳುತ್ತದೆ.
ನಮ್ಮ ಟೋಸ್ಟ್ ನೋಟಿಫಿಕೇಶನ್‌ಗಳನ್ನು ಲೈವ್ ರೀಜನ್‌ನಲ್ಲಿ ಸುತ್ತುವ ಮೂಲಕ, ಬಳಕೆದಾರರ ಫೋಕಸ್ ಎಲ್ಲಿದ್ದರೂ, ಅವು ಕಾಣಿಸಿಕೊಂಡ ತಕ್ಷಣ ಅವುಗಳ ವಿಷಯವನ್ನು ಸ್ಕ್ರೀನ್ ರೀಡರ್‌ಗಳು ಪ್ರಕಟಿಸುತ್ತವೆ ಎಂದು ನಾವು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಬಹುದು.
ಟೋಸ್ಟ್‌ಗಳಿಗಾಗಿ ಪ್ರಮುಖ ARIA ಅಟ್ರಿಬ್ಯೂಟ್‌ಗಳು
ಟೋಸ್ಟ್‌ಗಳಿಗಾಗಿ ಪರಿಣಾಮಕಾರಿ ಲೈವ್ ರೀಜನ್ ಅನ್ನು ರಚಿಸಲು ಮೂರು ಮುಖ್ಯ ಅಟ್ರಿಬ್ಯೂಟ್‌ಗಳು ಒಟ್ಟಿಗೆ ಕೆಲಸ ಮಾಡುತ್ತವೆ:
1. role ಅಟ್ರಿಬ್ಯೂಟ್
role ಅಟ್ರಿಬ್ಯೂಟ್ ಅಂಶದ ಲಾಕ್ಷಣಿಕ ಉದ್ದೇಶವನ್ನು ವ್ಯಾಖ್ಯಾನಿಸುತ್ತದೆ. ಲೈವ್ ರೀಜನ್‌ಗಳಿಗಾಗಿ, ಪರಿಗಣಿಸಲು ಮೂರು ಪ್ರಾಥಮಿಕ ಪಾತ್ರಗಳಿವೆ:
role="status": ಇದು ಟೋಸ್ಟ್ ನೋಟಿಫಿಕೇಶನ್‌ಗಳಿಗೆ ಅತ್ಯಂತ ಸಾಮಾನ್ಯ ಮತ್ತು ಸೂಕ್ತವಾದ ಪಾತ್ರವಾಗಿದೆ. ಇದನ್ನು ಮುಖ್ಯವಾದ ಆದರೆ ತುರ್ತಾಗಿಲ್ಲದ ಮಾಹಿತಿಪೂರ್ಣ ಸಂದೇಶಗಳಿಗಾಗಿ ಬಳಸಲಾಗುತ್ತದೆ. ಇದುaria-live="polite"ಗೆ ಮ್ಯಾಪ್ ಆಗುತ್ತದೆ, ಅಂದರೆ ಸ್ಕ್ರೀನ್ ರೀಡರ್ ಪ್ರಕಟಣೆ ಮಾಡುವ ಮೊದಲು ಒಂದು ಕ್ಷಣದ ನಿಷ್ಕ್ರಿಯತೆಗಾಗಿ (ವಾಕ್ಯದ ಅಂತ್ಯದಂತೆ) ಕಾಯುತ್ತದೆ, ಬಳಕೆದಾರರಿಗೆ ಅವರ ಕೆಲಸದ ಮಧ್ಯೆ ಅಡ್ಡಿಯಾಗದಂತೆ ಖಚಿತಪಡಿಸುತ್ತದೆ. ಇದನ್ನು "ಪ್ರೊಫೈಲ್ ಅಪ್‌ಡೇಟ್ ಮಾಡಲಾಗಿದೆ," "ಕಾರ್ಟ್‌ಗೆ ಐಟಂ ಸೇರಿಸಲಾಗಿದೆ," ಅಥವಾ "ಸಂದೇಶ ಕಳುಹಿಸಲಾಗಿದೆ" ನಂತಹ ದೃಢೀಕರಣಗಳಿಗಾಗಿ ಬಳಸಿ.role="alert": ಈ ಪಾತ್ರವನ್ನು ಬಳಕೆದಾರರ ತಕ್ಷಣದ ಗಮನ ಅಗತ್ಯವಿರುವ ತುರ್ತು, ಸಮಯ-ಸೂಕ್ಷ್ಮ ಮಾಹಿತಿಗಾಗಿ ಕಾಯ್ದಿರಿಸಲಾಗಿದೆ. ಇದುaria-live="assertive"ಗೆ ಮ್ಯಾಪ್ ಆಗುತ್ತದೆ, ಇದು ಸಂದೇಶವನ್ನು ತಲುಪಿಸಲು ಸ್ಕ್ರೀನ್ ರೀಡರ್ ಅನ್ನು ತಕ್ಷಣವೇ ಅಡ್ಡಿಪಡಿಸುತ್ತದೆ. ಇದನ್ನು ಅತ್ಯಂತ ಎಚ್ಚರಿಕೆಯಿಂದ ಬಳಸಿ, ಏಕೆಂದರೆ ಇದು ತುಂಬಾ ಅಡ್ಡಿಪಡಿಸಬಹುದು. "ನಿಮ್ಮ ಸೆಷನ್ ಅವಧಿ ಮುಗಿಯಲಿದೆ" ಅಥವಾ "ಸಂಪರ್ಕ ಕಳೆದುಹೋಗಿದೆ" ನಂತಹ ನಿರ್ಣಾಯಕ ಎಚ್ಚರಿಕೆಗಳಂತಹ ದೋಷ ಸಂದೇಶಗಳಿಗೆ ಇದು ಸೂಕ್ತವಾಗಿದೆ.role="alert"ಅನ್ನು ಅತಿಯಾಗಿ ಬಳಸುವುದು ನಿಮ್ಮ ಬಳಕೆದಾರರ ಮೇಲೆ ಕೂಗಿದಂತೆ.role="log": ಇದೊಂದು ಕಡಿಮೆ ಸಾಮಾನ್ಯ ಪಾತ್ರ, ಚಾಟ್ ಲಾಗ್‌ಗಳು ಅಥವಾ ದೋಷ ಕನ್ಸೋಲ್‌ಗಳಂತಹ ಹೊಸ ಸಂದೇಶಗಳನ್ನು ಕೊನೆಯಲ್ಲಿ ಸೇರಿಸಲಾಗುವ ಮಾಹಿತಿಯ ಲಾಗ್ ರಚಿಸಲು ಬಳಸಲಾಗುತ್ತದೆ. ಇದು ಸಾಮಾನ್ಯವಾಗಿ ಸಾಮಾನ್ಯ ಟೋಸ್ಟ್ ನೋಟಿಫಿಕೇಶನ್‌ಗಳಿಗೆ ಉತ್ತಮವಾಗಿ ಹೊಂದಿಕೆಯಾಗುವುದಿಲ್ಲ.
2. aria-live ಅಟ್ರಿಬ್ಯೂಟ್
role ಅಟ್ರಿಬ್ಯೂಟ್ ಸಾಮಾನ್ಯವಾಗಿ ಒಂದು ನಿರ್ದಿಷ್ಟ aria-live ವರ್ತನೆಯನ್ನು ಸೂಚಿಸುತ್ತದೆಯಾದರೂ, ಹೆಚ್ಚು ನಿಯಂತ್ರಣಕ್ಕಾಗಿ ನೀವು ಅದನ್ನು ಸ್ಪಷ್ಟವಾಗಿ ಹೊಂದಿಸಬಹುದು. ಇದು ಬದಲಾವಣೆಯನ್ನು *ಹೇಗೆ* ಪ್ರಕಟಿಸಬೇಕೆಂದು ಸ್ಕ್ರೀನ್ ರೀಡರ್‌ಗೆ ಹೇಳುತ್ತದೆ.
aria-live="polite": ಬಳಕೆದಾರರು ನಿಷ್ಕ್ರಿಯರಾದಾಗ ಸ್ಕ್ರೀನ್ ರೀಡರ್ ಬದಲಾವಣೆಯನ್ನು ಪ್ರಕಟಿಸುತ್ತದೆ. ಇದುrole="status"ಗಾಗಿ ಡೀಫಾಲ್ಟ್ ಮತ್ತು ಹೆಚ್ಚಿನ ಟೋಸ್ಟ್‌ಗಳಿಗೆ ಆದ್ಯತೆಯ ಸೆಟ್ಟಿಂಗ್ ಆಗಿದೆ.aria-live="assertive": ಸ್ಕ್ರೀನ್ ರೀಡರ್ ತಾನು ಮಾಡುತ್ತಿರುವ ಕೆಲಸವನ್ನು ಅಡ್ಡಿಪಡಿಸಿ ತಕ್ಷಣವೇ ಬದಲಾವಣೆಯನ್ನು ಪ್ರಕಟಿಸುತ್ತದೆ. ಇದುrole="alert"ಗಾಗಿ ಡೀಫಾಲ್ಟ್ ಆಗಿದೆ.aria-live="off": ಸ್ಕ್ರೀನ್ ರೀಡರ್ ಬದಲಾವಣೆಗಳನ್ನು ಪ್ರಕಟಿಸುವುದಿಲ್ಲ. ಇದು ಹೆಚ್ಚಿನ ಅಂಶಗಳಿಗೆ ಡೀಫಾಲ್ಟ್ ಆಗಿದೆ.
3. aria-atomic ಅಟ್ರಿಬ್ಯೂಟ್
ಈ ಅಟ್ರಿಬ್ಯೂಟ್ ಸ್ಕ್ರೀನ್ ರೀಡರ್‌ಗೆ ಲೈವ್ ರೀಜನ್‌ನ ಸಂಪೂರ್ಣ ವಿಷಯವನ್ನು ಪ್ರಕಟಿಸಬೇಕೇ ಅಥವಾ ಬದಲಾದ ಭಾಗಗಳನ್ನು ಮಾತ್ರ ಪ್ರಕಟಿಸಬೇಕೇ ಎಂದು ಹೇಳುತ್ತದೆ.
aria-atomic="true": ಲೈವ್ ರೀಜನ್‌ನೊಳಗಿನ ವಿಷಯದ ಯಾವುದೇ ಭಾಗವು ಬದಲಾದಾಗ, ಸ್ಕ್ರೀನ್ ರೀಡರ್ ಅಂಶದ ಸಂಪೂರ್ಣ ವಿಷಯವನ್ನು ಓದುತ್ತದೆ. ಇದು ಟೋಸ್ಟ್ ನೋಟಿಫಿಕೇಶನ್‌ಗೆ ಯಾವಾಗಲೂ ನಿಮಗೆ ಬೇಕಾಗಿರುವುದು, ಪೂರ್ಣ ಸಂದೇಶವನ್ನು ಸಂದರ್ಭದಲ್ಲಿ ಓದಲಾಗಿದೆಯೆಂದು ಖಚಿತಪಡಿಸುತ್ತದೆ.aria-atomic="false": ಸ್ಕ್ರೀನ್ ರೀಡರ್ ಸೇರಿಸಲಾದ ಅಥವಾ ಬದಲಾದ ನೋಡ್ ಅನ್ನು ಮಾತ್ರ ಪ್ರಕಟಿಸುತ್ತದೆ. ಇದು ಟೋಸ್ಟ್‌ಗಳಿಗೆ ತುಣುಕಾದ ಮತ್ತು ಗೊಂದಲಮಯ ಪ್ರಕಟಣೆಗಳಿಗೆ ಕಾರಣವಾಗಬಹುದು.
ಎಲ್ಲವನ್ನೂ ಒಟ್ಟಿಗೆ ಸೇರಿಸುವುದು: ಕೋಡ್ ಉದಾಹರಣೆಗಳು
ಇದನ್ನು ಹೇಗೆ ಕಾರ್ಯಗತಗೊಳಿಸುವುದು ಎಂದು ನೋಡೋಣ. ಪುಟ ಲೋಡ್ ಆದಾಗ DOM ನಲ್ಲಿ ಮೀಸಲಾದ ಟೋಸ್ಟ್ ಕಂಟೇನರ್ ಅಂಶವನ್ನು ಹೊಂದಿರುವುದು ಉತ್ತಮ ಅಭ್ಯಾಸವಾಗಿದೆ. ನಂತರ ನೀವು ಈ ಕಂಟೇನರ್ ಒಳಗೆ ವೈಯಕ್ತಿಕ ಟೋಸ್ಟ್ ಸಂದೇಶಗಳನ್ನು ಡೈನಾಮಿಕ್ ಆಗಿ ಸೇರಿಸುತ್ತೀರಿ ಮತ್ತು ತೆಗೆದುಹಾಕುತ್ತೀರಿ.
HTML ರಚನೆ
ಈ ಕಂಟೇನರ್ ಅನ್ನು ನಿಮ್ಮ `
` ಟ್ಯಾಗ್‌ನ ಕೊನೆಯಲ್ಲಿ ಇರಿಸಿ. ಇದನ್ನು CSS ನೊಂದಿಗೆ ದೃಷ್ಟಿಗೋಚರವಾಗಿ ಇರಿಸಲಾಗುತ್ತದೆ, ಆದರೆ ಸ್ಕ್ರೀನ್ ರೀಡರ್ ಪ್ರಕಟಣೆಗಳಿಗೆ DOM ನಲ್ಲಿ ಅದರ ಸ್ಥಳವು ಮುಖ್ಯವಲ್ಲ.<!-- ಸಾಮಾನ್ಯ ನೋಟಿಫಿಕೇಶನ್‌ಗಳಿಗಾಗಿ ಒಂದು ಪೊಲೈಟ್ ಲೈವ್ ರೀಜನ್ -->
<div id="toast-container-polite"
role="status"
aria-live="polite"
aria-atomic="true">
<!-- ಟೋಸ್ಟ್‌ಗಳನ್ನು ಇಲ್ಲಿ ಡೈನಾಮಿಕ್ ಆಗಿ ಸೇರಿಸಲಾಗುತ್ತದೆ -->
</div>
<!-- ತುರ್ತು ಎಚ್ಚರಿಕೆಗಳಿಗಾಗಿ ಒಂದು ಅಸರ್ಟಿವ್ ಲೈವ್ ರೀಜನ್ -->
<div id="toast-container-assertive"
role="alert"
aria-live="assertive"
aria-atomic="true">
<!-- ತುರ್ತು ಟೋಸ್ಟ್‌ಗಳನ್ನು ಇಲ್ಲಿ ಡೈನಾಮಿಕ್ ಆಗಿ ಸೇರಿಸಲಾಗುತ್ತದೆ -->
</div>ಪೊಲೈಟ್ ನೋಟಿಫಿಕೇಶನ್‌ಗಾಗಿ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್
ಪೊಲೈಟ್ ಟೋಸ್ಟ್ ಸಂದೇಶವನ್ನು ತೋರಿಸಲು ಇಲ್ಲಿ ಒಂದು ವೆನಿಲ್ಲಾ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಫಂಕ್ಷನ್ ಇದೆ. ಇದು ಟೋಸ್ಟ್ ಅಂಶವನ್ನು ರಚಿಸುತ್ತದೆ, ಅದನ್ನು ಪೊಲೈಟ್ ಕಂಟೇನರ್‌ಗೆ ಸೇರಿಸುತ್ತದೆ, ಮತ್ತು ಅದನ್ನು ತೆಗೆದುಹಾಕಲು ಒಂದು ಟೈಮ್‌ಔಟ್ ಅನ್ನು ಹೊಂದಿಸುತ್ತದೆ.
function showPoliteToast(message, duration = 5000) {
const container = document.getElementById('toast-container-polite');
// ಟೋಸ್ಟ್ ಅಂಶವನ್ನು ರಚಿಸಿ
const toast = document.createElement('div');
toast.className = 'toast';
toast.textContent = message;
// ಟೋಸ್ಟ್ ಅನ್ನು ಕಂಟೇನರ್‌ಗೆ ಸೇರಿಸಿ
container.appendChild(toast);
// ಟೋಸ್ಟ್ ಅನ್ನು ತೆಗೆದುಹಾಕಲು ಟೈಮ್‌ಔಟ್ ಅನ್ನು ಹೊಂದಿಸಿ
setTimeout(() => {
container.removeChild(toast);
}, duration);
}
// ಬಳಕೆಯ ಉದಾಹರಣೆ:
document.getElementById('save-button').addEventListener('click', () => {
// ... ಉಳಿಸುವ ತರ್ಕ ...
showPoliteToast('ನಿಮ್ಮ ಸೆಟ್ಟಿಂಗ್‌ಗಳನ್ನು ಯಶಸ್ವಿಯಾಗಿ ಉಳಿಸಲಾಗಿದೆ.');
});ಈ ಕೋಡ್ ರನ್ ಆದಾಗ, `role="status"` ಹೊಂದಿರುವ `div` ಅಪ್‌ಡೇಟ್ ಆಗುತ್ತದೆ. ಪುಟವನ್ನು ಮೇಲ್ವಿಚಾರಣೆ ಮಾಡುವ ಸ್ಕ್ರೀನ್ ರೀಡರ್ ಈ ಬದಲಾವಣೆಯನ್ನು ಪತ್ತೆಹಚ್ಚುತ್ತದೆ ಮತ್ತು ಬಳಕೆದಾರರ ಕೆಲಸದ ಹರಿವನ್ನು ಅಡ್ಡಿಪಡಿಸದೆಯೇ "ನಿಮ್ಮ ಸೆಟ್ಟಿಂಗ್‌ಗಳನ್ನು ಯಶಸ್ವಿಯಾಗಿ ಉಳಿಸಲಾಗಿದೆ," ಎಂದು ಪ್ರಕಟಿಸುತ್ತದೆ.
ನಿಜವಾಗಿಯೂ ಒಳಗೊಳ್ಳುವ ಟೋಸ್ಟ್‌ಗಳಿಗಾಗಿ ವಿನ್ಯಾಸ ಮತ್ತು UX ಉತ್ತಮ ಅಭ್ಯಾಸಗಳು
ARIA ನೊಂದಿಗೆ ತಾಂತ್ರಿಕ ಅನುಷ್ಠಾನವು ಅಡಿಪಾಯವಾಗಿದೆ, ಆದರೆ ಅತ್ಯುತ್ತಮ ಬಳಕೆದಾರ ಅನುಭವಕ್ಕೆ ಚಿಂತನಶೀಲ ವಿನ್ಯಾಸದ ಅಗತ್ಯವಿದೆ. ಪ್ರವೇಶಿಸಬಹುದಾದ ಟೋಸ್ಟ್ ಎಲ್ಲರಿಗೂ ಹೆಚ್ಚು ಉಪಯುಕ್ತವಾದ ಟೋಸ್ಟ್ ಆಗಿದೆ.
1. ಸಮಯವೇ ಎಲ್ಲವೂ: ಬಳಕೆದಾರರಿಗೆ ನಿಯಂತ್ರಣ ನೀಡಿ
3-ಸೆಕೆಂಡ್ ಟೋಸ್ಟ್ ಕೆಲವರಿಗೆ ಸರಿಯಾಗಿರಬಹುದು, ಆದರೆ ಓದಲು ಹೆಚ್ಚು ಸಮಯ ಬೇಕಾಗಿರುವ ಕಡಿಮೆ ದೃಷ್ಟಿ ಹೊಂದಿರುವ ಬಳಕೆದಾರರಿಗೆ, ಅಥವಾ ಮಾಹಿತಿಯನ್ನು ಪ್ರಕ್ರಿಯೆಗೊಳಿಸಲು ಹೆಚ್ಚು ಸಮಯ ಬೇಕಾಗಿರುವ ಅರಿವಿನ ಅಸಾಮರ್ಥ್ಯವಿರುವ ಬಳಕೆದಾರರಿಗೆ ಇದು ತುಂಬಾ ಚಿಕ್ಕದಾಗಿದೆ.
- ದೀರ್ಘ ಡೀಫಾಲ್ಟ್ ಅವಧಿ: ಕನಿಷ್ಠ 5-7 ಸೆಕೆಂಡುಗಳ ಅವಧಿಯನ್ನು ಗುರಿಯಾಗಿರಿಸಿ. ಇದು ವ್ಯಾಪಕ ಶ್ರೇಣಿಯ ಬಳಕೆದಾರರಿಗೆ ಹೆಚ್ಚು ಆರಾಮದಾಯಕ ಓದುವ ಅವಕಾಶವನ್ನು ಒದಗಿಸುತ್ತದೆ.
- 'ಮುಚ್ಚು' ಬಟನ್ ಸೇರಿಸಿ: ಟೋಸ್ಟ್ ಅನ್ನು ಹಸ್ತಚಾಲಿತವಾಗಿ ವಜಾಗೊಳಿಸಲು ಯಾವಾಗಲೂ ಸ್ಪಷ್ಟವಾಗಿ ಗೋಚರಿಸುವ ಮತ್ತು ಕೀಬೋರ್ಡ್-ಪ್ರವೇಶಿಸಬಹುದಾದ ಬಟನ್ ಅನ್ನು ಒದಗಿಸಿ. ಇದು ಬಳಕೆದಾರರಿಗೆ ಅಂತಿಮ ನಿಯಂತ್ರಣವನ್ನು ನೀಡುತ್ತದೆ ಮತ್ತು ಅವರು ಅದನ್ನು ಓದಿ ಮುಗಿಸುವ ಮೊದಲು ಸಂದೇಶವು ಕಣ್ಮರೆಯಾಗುವುದನ್ನು ತಡೆಯುತ್ತದೆ. ಈ ಬಟನ್ `<button aria-label="ನೋಟಿಫಿಕೇಶನ್‌ ಮುಚ್ಚಿ">X</button>` ನಂತಹ ಪ್ರವೇಶಿಸಬಹುದಾದ ಲೇಬಲ್ ಹೊಂದಿರಬೇಕು.
- ಹೋವರ್/ಫೋಕಸ್ ಮೇಲೆ ವಿರಾಮ: ಬಳಕೆದಾರರು ತಮ್ಮ ಮೌಸ್ ಅನ್ನು ಟೋಸ್ಟ್ ಮೇಲೆ ಹೋವರ್ ಮಾಡಿದಾಗ ಅಥವಾ ಕೀಬೋರ್ಡ್‌ನೊಂದಿಗೆ ಅದರ ಮೇಲೆ ಫೋಕಸ್ ಮಾಡಿದಾಗ ವಜಾಗೊಳಿಸುವ ಟೈಮರ್ ವಿರಾಮಗೊಳಿಸಬೇಕು. ಇದು WCAG ಯ ಸಮಯ ಹೊಂದಾಣಿಕೆ ಮಾನದಂಡದ ನಿರ್ಣಾಯಕ ಅಂಶವಾಗಿದೆ.
2. ದೃಶ್ಯ ಸ್ಪಷ್ಟತೆ ಮತ್ತು ಸ್ಥಾನ
ಟೋಸ್ಟ್ ಹೇಗೆ ಕಾಣುತ್ತದೆ ಮತ್ತು ಎಲ್ಲಿ ಕಾಣಿಸಿಕೊಳ್ಳುತ್ತದೆ ಎಂಬುದು ಅದರ ಪರಿಣಾಮಕಾರಿತ್ವದ ಮೇಲೆ ಗಮನಾರ್ಹವಾಗಿ ಪರಿಣಾಮ ಬೀರುತ್ತದೆ.
- ಹೆಚ್ಚಿನ ಕಾಂಟ್ರಾಸ್ಟ್: ಟೋಸ್ಟ್‌ನ ಪಠ್ಯ ಮತ್ತು ಹಿನ್ನೆಲೆಯು WCAG AA ಮಾನದಂಡಗಳನ್ನು (ಸಾಮಾನ್ಯ ಪಠ್ಯಕ್ಕಾಗಿ 4.5:1) ಪೂರೈಸಲು ಸಾಕಷ್ಟು ಬಣ್ಣದ ಕಾಂಟ್ರಾಸ್ಟ್ ಅನುಪಾತವನ್ನು ಹೊಂದಿದೆಯെന്ന് ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಿ. ನಿಮ್ಮ ಬಣ್ಣ ಸಂಯೋಜನೆಗಳನ್ನು ಪರೀಕ್ಷಿಸಲು ಉಪಕರಣಗಳನ್ನು ಬಳಸಿ.
- ಸ್ಪಷ್ಟ ಐಕಾನ್‌ಗಳು: ಪಠ್ಯದ ಜೊತೆಗೆ ಸಾರ್ವತ್ರಿಕವಾಗಿ ಅರ್ಥವಾಗುವ ಐಕಾನ್‌ಗಳನ್ನು (ಯಶಸ್ಸಿಗೆ ಚೆಕ್‌ಮಾರ್ಕ್, ಮಾಹಿತಿಗಾಗಿ 'i', ಅಥವಾ ಎಚ್ಚರಿಕೆಗಾಗಿ ಆಶ್ಚರ್ಯಸೂಚಕ ಚಿಹ್ನೆ) ಬಳಸಿ. ಈ ಐಕಾನ್‌ಗಳು ತ್ವರಿತ ದೃಶ್ಯ ಸೂಚನೆಯನ್ನು ಒದಗಿಸುತ್ತವೆ, ಆದರೆ ಅವುಗಳ ಮೇಲೆ ಮಾತ್ರ ಅವಲಂಬಿಸಬೇಡಿ. ಯಾವಾಗಲೂ ಪಠ್ಯವನ್ನು ಸೇರಿಸಿ.
- ಸ್ಥಿರ ಸ್ಥಾನೀಕರಣ: ನಿಮ್ಮ ಟೋಸ್ಟ್‌ಗಳಿಗಾಗಿ ಒಂದು ಸ್ಥಿರ ಸ್ಥಳವನ್ನು (ಉದಾ. ಮೇಲಿನ-ಬಲ) ಆಯ್ಕೆಮಾಡಿ ಮತ್ತು ನಿಮ್ಮ ಸಂಪೂರ್ಣ ಅಪ್ಲಿಕೇಶನ್‌ನಾದ್ಯಂತ ಅದಕ್ಕೆ ಅಂಟಿಕೊಳ್ಳಿ. ಇದು ಬಳಕೆದಾರರಿಗೆ ಊಹಿಸುವಿಕೆಯನ್ನು ಸೃಷ್ಟಿಸುತ್ತದೆ. ಪ್ರಮುಖ UI ಅಂಶಗಳನ್ನು ಮರೆಮಾಡಬಹುದಾದ ಸ್ಥಳಗಳಲ್ಲಿ ಟೋಸ್ಟ್‌ಗಳನ್ನು ಇಡುವುದನ್ನು ತಪ್ಪಿಸಿ.
3. ಸ್ಪಷ್ಟ ಮತ್ತು ಸಂಕ್ಷಿಪ್ತ ಮೈಕ್ರೋಕಾಪಿಯನ್ನು ಬರೆಯಿರಿ
ಸಂದೇಶವೇ ನೋಟಿಫಿಕೇಶನ್‌ನ ತಿರುಳು. ಅದನ್ನು ಪರಿಣಾಮಕಾರಿಯಾಗಿ ಮಾಡಿ.
- ನೇರವಾಗಿರಿ: ನೇರವಾಗಿ ವಿಷಯಕ್ಕೆ ಬನ್ನಿ. "ಕಾರ್ಯಾಚರಣೆಯು ಯಶಸ್ವಿಯಾಗಿ ಪೂರ್ಣಗೊಂಡಿದೆ," ಬದಲು "ಪ್ರೊಫೈಲ್ ಅಪ್‌ಡೇಟ್ ಮಾಡಲಾಗಿದೆ" ಬಳಸಿ.
- ಪಾರಿಭಾಷಿಕ ಶಬ್ದಗಳನ್ನು ತಪ್ಪಿಸಿ: ಜಾಗತಿಕ ಪ್ರೇಕ್ಷಕರು ಸುಲಭವಾಗಿ ಅರ್ಥಮಾಡಿಕೊಳ್ಳಬಲ್ಲ ಸರಳ, ಸುಲಭ ಭಾಷೆಯನ್ನು ಬಳಸಿ. ವಿಷಯವನ್ನು ಅನುವಾದಿಸಲಾಗುವ ಅಂತರರಾಷ್ಟ್ರೀಯ ಅಪ್ಲಿಕೇಶನ್‌ಗಳಿಗೆ ಇದು ವಿಶೇಷವಾಗಿ ಮುಖ್ಯವಾಗಿದೆ. ಸಂಕೀರ್ಣ ನುಡಿಗಟ್ಟುಗಳು ಅಥವಾ ತಾಂತ್ರಿಕ ಪದಗಳು ಅನುವಾದದಲ್ಲಿ ಕಳೆದುಹೋಗಬಹುದು.
- ಮಾನವ-ಸ್ನೇಹಿ ಧ್ವನಿ: ಸಹಾಯಕ, ಸಂಭಾಷಣಾತ್ಮಕ ಧ್ವನಿಯಲ್ಲಿ ಬರೆಯಿರಿ. ಸಂದೇಶವು ತಣ್ಣನೆಯ ಯಂತ್ರದಿಂದ ಬರುವ ಬದಲು ಸಹಾಯಕ ಸಹಾಯಕನಿಂದ ಬರುತ್ತಿರುವಂತೆ ಧ್ವನಿಸಬೇಕು.
4. ನಿರ್ಣಾಯಕ ಮಾಹಿತಿಗಾಗಿ ಟೋಸ್ಟ್‌ಗಳನ್ನು ಬಳಸಬೇಡಿ
ಇದು ಸುವರ್ಣ ನಿಯಮ. ಬಳಕೆದಾರರು ಸಂದೇಶವನ್ನು ನೋಡಲೇಬೇಕಾದರೆ ಅಥವಾ ಅದರೊಂದಿಗೆ ಸಂವಹನ ನಡೆಸಲೇಬೇಕಾದರೆ, ಟೋಸ್ಟ್ ಅನ್ನು ಬಳಸಬೇಡಿ. ಟೋಸ್ಟ್‌ಗಳು ಪೂರಕ, ನಿರ್ಣಾಯಕವಲ್ಲದ ಪ್ರತಿಕ್ರಿಯೆಗಾಗಿ. ನಿರ್ಣಾಯಕ ದೋಷಗಳು, ಬಳಕೆದಾರರ ಕ್ರಿಯೆಯ ಅಗತ್ಯವಿರುವ ಮೌಲ್ಯೀಕರಣ ಸಂದೇಶಗಳು, ಅಥವಾ ವಿನಾಶಕಾರಿ ಕ್ರಿಯೆಗಳಿಗೆ (ಫೈಲ್ ಅಳಿಸುವಿಕೆ) ದೃಢೀಕರಣಗಳಿಗಾಗಿ, ಮೋಡಲ್ ಡೈಲಾಗ್ ಅಥವಾ ಫೋಕಸ್ ಪಡೆಯುವ ಇನ್‌ಲೈನ್ ಅಲರ್ಟ್‌ನಂತಹ ಹೆಚ್ಚು ದೃಢವಾದ ಮಾದರಿಯನ್ನು ಬಳಸಿ.
ನಿಮ್ಮ ಪ್ರವೇಶಿಸಬಹುದಾದ ಟೋಸ್ಟ್ ನೋಟಿಫಿಕೇಶನ್‌ಗಳನ್ನು ಪರೀಕ್ಷಿಸುವುದು
ನಿಮ್ಮ ಬಳಕೆದಾರರು ನಿಜವಾಗಿ ಬಳಸುವ ಉಪಕರಣಗಳೊಂದಿಗೆ ಪರೀಕ್ಷಿಸದೆ ನಿಮ್ಮ ಅನುಷ್ಠಾನವು ಪ್ರವೇಶಿಸಬಹುದೆಂದು ನೀವು ಖಚಿತವಾಗಿ ಹೇಳಲು ಸಾಧ್ಯವಿಲ್ಲ. ಟೋಸ್ಟ್‌ಗಳಂತಹ ಡೈನಾಮಿಕ್ ಘಟಕಗಳಿಗೆ ಹಸ್ತಚಾಲಿತ ಪರೀಕ್ಷೆಯು ಕಡ್ಡಾಯವಾಗಿದೆ.
1. ಸ್ಕ್ರೀನ್ ರೀಡರ್ ಪರೀಕ್ಷೆ
ಅತ್ಯಂತ ಸಾಮಾನ್ಯ ಸ್ಕ್ರೀನ್ ರೀಡರ್‌ಗಳೊಂದಿಗೆ ಪರಿಚಿತರಾಗಿ: NVDA (ಉಚಿತ, ವಿಂಡೋಸ್‌ಗಾಗಿ), JAWS (ಪಾವತಿಸಿದ, ವಿಂಡೋಸ್‌ಗಾಗಿ), ಮತ್ತು VoiceOver (ಅಂತರ್ನಿರ್ಮಿತ, macOS ಮತ್ತು iOS ಗಾಗಿ). ಸ್ಕ್ರೀನ್ ರೀಡರ್ ಅನ್ನು ಆನ್ ಮಾಡಿ ಮತ್ತು ನಿಮ್ಮ ಟೋಸ್ಟ್‌ಗಳನ್ನು ಪ್ರಚೋದಿಸುವ ಕ್ರಿಯೆಗಳನ್ನು ನಿರ್ವಹಿಸಿ.
ನಿಮ್ಮನ್ನು ಕೇಳಿಕೊಳ್ಳಿ:
- ಸಂದೇಶವನ್ನು ಪ್ರಕಟಿಸಲಾಯಿತೇ? ಇದು ಅತ್ಯಂತ ಮೂಲಭೂತ ಪರೀಕ್ಷೆ.
- ಅದನ್ನು ಸರಿಯಾಗಿ ಪ್ರಕಟಿಸಲಾಯಿತೇ? ಪೂರ್ಣ ಸಂದೇಶವನ್ನು ಓದಲಾಯಿತೇ?
- ಸಮಯ ಸರಿಯಾಗಿತ್ತೇ? ಪೊಲೈಟ್ ಟೋಸ್ಟ್‌ಗಾಗಿ, ಅದು ನೈಸರ್ಗಿಕ ವಿರಾಮಕ್ಕಾಗಿ ಕಾಯಿತೇ? ಅಸರ್ಟಿವ್ ಅಲರ್ಟ್‌ಗಾಗಿ, ಅದು ತಕ್ಷಣವೇ ಅಡ್ಡಿಪಡಿಸಿತೇ?
- ಅನುಭವವು ಅಡ್ಡಿಪಡಿಸುವಂತಿತ್ತೇ?
role="alert"ಬಳಸುವುದು ಸಮರ್ಥನೀಯವೇ, ಅಥವಾ ಅದು ಕೇವಲ ಕಿರಿಕಿರಿಯೇ?
2. ಕೀಬೋರ್ಡ್-ಮಾತ್ರ ಪರೀಕ್ಷೆ
ನಿಮ್ಮ ಮೌಸ್ ಅನ್ನು ಅನ್‌ಪ್ಲಗ್ ಮಾಡಿ ಮತ್ತು ಕೇವಲ ಕೀಬೋರ್ಡ್ (Tab, Shift+Tab, Enter, Spacebar) ಬಳಸಿ ನಿಮ್ಮ ಸೈಟ್ ಅನ್ನು ನ್ಯಾವಿಗೇಟ್ ಮಾಡಿ.
- ನಿಮ್ಮ ಟೋಸ್ಟ್‌ನಲ್ಲಿ 'ಮುಚ್ಚು' ಬಟನ್ ಅಥವಾ ಯಾವುದೇ ಇತರ ಸಂವಾದಾತ್ಮಕ ಅಂಶವಿದ್ದರೆ, ನೀವು Tab ಕೀಲಿಯನ್ನು ಬಳಸಿ ಅದಕ್ಕೆ ನ್ಯಾವಿಗೇಟ್ ಮಾಡಬಹುದೇ?
- ನೀವು Enter ಅಥವಾ Spacebar ಬಳಸಿ ಬಟನ್ ಅನ್ನು ಸಕ್ರಿಯಗೊಳಿಸಬಹುದೇ?
- ಟೋಸ್ಟ್ ವಜಾಗೊಳಿಸಿದ ನಂತರ ಫೋಕಸ್ ಅಪ್ಲಿಕೇಶನ್‌ನಲ್ಲಿ ತಾರ್ಕಿಕ ಸ್ಥಳಕ್ಕೆ ಹಿಂತಿರುಗುತ್ತದೆಯೇ?
3. ದೃಶ್ಯ ಮತ್ತು ಉಪಯುಕ್ತತೆ ಪರಿಶೀಲನೆಗಳು
- ಬ್ರೌಸರ್ ಎಕ್ಸ್‌ಟೆನ್ಶನ್ ಅಥವಾ ಆನ್‌ಲೈನ್ ಉಪಕರಣದೊಂದಿಗೆ ಬಣ್ಣದ ಕಾಂಟ್ರಾಸ್ಟ್ ಅನ್ನು ಪರಿಶೀಲಿಸಿ.
- ನಿಮ್ಮ ಬ್ರೌಸರ್ ವಿಂಡೋವನ್ನು ಮರುಗಾತ್ರಗೊಳಿಸಲು ಅಥವಾ ವಿವಿಧ ಸಾಧನಗಳಲ್ಲಿ ವೀಕ್ಷಿಸಲು ಪ್ರಯತ್ನಿಸಿ. ಟೋಸ್ಟ್ ಇನ್ನೂ ಇತರ ವಿಷಯವನ್ನು ಮರೆಮಾಡದೆ ಸಮಂಜಸವಾದ ಸ್ಥಳದಲ್ಲಿ ಕಾಣಿಸಿಕೊಳ್ಳುತ್ತದೆಯೇ?
- ಅಪ್ಲಿಕೇಶನ್‌ನೊಂದಿಗೆ ಪರಿಚಯವಿಲ್ಲದ ಯಾರಿಗಾದರೂ ಅದನ್ನು ಬಳಸಲು ಕೇಳಿ. ಅವರು ಟೋಸ್ಟ್ ನೋಟಿಫಿಕೇಶನ್‌ಗಳ ಅರ್ಥವನ್ನು ಅರ್ಥಮಾಡಿಕೊಳ್ಳುತ್ತಾರೆಯೇ?
ತೀರ್ಮಾನ: ಒಂದು ಸಮಯದಲ್ಲಿ ಒಂದು ನೋಟಿಫಿಕೇಶನ್‌ನಂತೆ, ಹೆಚ್ಚು ಒಳಗೊಳ್ಳುವ ವೆಬ್ ಅನ್ನು ನಿರ್ಮಿಸುವುದು
ಟೋಸ್ಟ್ ನೋಟಿಫಿಕೇಶನ್‌ಗಳು ಬಳಕೆದಾರ ಅನುಭವದ ಒಂದು ಸಣ್ಣ ಆದರೆ ಮಹತ್ವದ ಭಾಗವಾಗಿದೆ. ವರ್ಷಗಳಿಂದ, ಅವು ವೆಬ್ ಪ್ರವೇಶಿಸುವಿಕೆಯಲ್ಲಿ ಒಂದು ಸಾಮಾನ್ಯ ಕುರುಡು ತಾಣವಾಗಿದ್ದು, ಸಹಾಯಕ ತಂತ್ರಜ್ಞಾನಗಳ ಬಳಕೆದಾರರಿಗೆ ಹತಾಶೆಯ ಅನುಭವವನ್ನು ಸೃಷ್ಟಿಸುತ್ತವೆ. ಆದರೆ ಇದು ಹೀಗಿರಬೇಕಾಗಿಲ್ಲ.
ARIA ಲೈವ್ ರೀಜನ್‌ಗಳ ಶಕ್ತಿಯನ್ನು ಬಳಸಿಕೊಂಡು ಮತ್ತು ಚಿಂತನಶೀಲ ವಿನ್ಯಾಸ ತತ್ವಗಳಿಗೆ ಬದ್ಧರಾಗಿ, ನಾವು ಈ ಕ್ಷಣಿಕ ಸಂದೇಶಗಳನ್ನು ಅಡೆತಡೆಗಳಿಂದ ಸೇತುವೆಗಳಾಗಿ ಪರಿವರ್ತಿಸಬಹುದು. ಪ್ರವೇಶಿಸಬಹುದಾದ ಟೋಸ್ಟ್ ಕೇವಲ ತಾಂತ್ರಿಕ ಚೆಕ್‌ಬಾಕ್ಸ್ ಅಲ್ಲ; ಇದು *ಎಲ್ಲಾ* ಬಳಕೆದಾರರೊಂದಿಗೆ ಸ್ಪಷ್ಟ ಸಂವಹನಕ್ಕೆ ಒಂದು ಬದ್ಧತೆಯಾಗಿದೆ. ಇದು ಪ್ರತಿಯೊಬ್ಬರೂ, ಅವರ ಸಾಮರ್ಥ್ಯವನ್ನು ಲೆಕ್ಕಿಸದೆ, ಒಂದೇ ರೀತಿಯ ನಿರ್ಣಾಯಕ ಪ್ರತಿಕ್ರಿಯೆಯನ್ನು ಪಡೆಯುತ್ತಾರೆ ಮತ್ತು ನಮ್ಮ ಅಪ್ಲಿಕೇಶನ್‌ಗಳನ್ನು ಆತ್ಮವಿಶ್ವಾಸ ಮತ್ತು ದಕ್ಷತೆಯಿಂದ ಬಳಸಬಹುದು ಎಂದು ಖಚಿತಪಡಿಸುತ್ತದೆ.
ಪ್ರವೇಶಿಸಬಹುದಾದ ನೋಟಿಫಿಕೇಶನ್‌ಗಳನ್ನು ಉದ್ಯಮದ ಮಾನದಂಡವನ್ನಾಗಿ ಮಾಡೋಣ. ಈ ಅಭ್ಯಾಸಗಳನ್ನು ನಮ್ಮ ವಿನ್ಯಾಸ ವ್ಯವಸ್ಥೆಗಳು ಮತ್ತು ಅಭಿವೃದ್ಧಿ ಕೆಲಸದ ಹರಿವುಗಳಲ್ಲಿ ಅಳವಡಿಸಿಕೊಳ್ಳುವ ಮೂಲಕ, ನಾವು ನಿಜವಾಗಿಯೂ ಜಾಗತಿಕ ಪ್ರೇಕ್ಷಕರಿಗಾಗಿ ಹೆಚ್ಚು ಒಳಗೊಳ್ಳುವ, ದೃಢವಾದ ಮತ್ತು ಬಳಕೆದಾರ-ಸ್ನೇಹಿ ವೆಬ್ ಅನ್ನು ನಿರ್ಮಿಸಬಹುದು.