Τι ελέγχεται;
Ένα μήνυμα κατάστασης είναι ένα μήνυμα που προστίθεται δυναμικά σε μια σελίδα. Ενημερώνει τους χρήστες, για παράδειγμα, για την επιτυχία ή το αποτέλεσμα μιας ενέργειας. Δηλαδή, για την πρόοδο μιας διαδικασίας ή για την εμφάνιση σφαλμάτων.
Όταν οι ιστότοποι δημιουργούν μηνύματα κατάστασης, τα οπτικά εμφανιζόμενα μηνύματα κατάστασης θα πρέπει να επισημαίνονται με κατάλληλους ρόλους και ιδιότητες. Επίσης, να μπορούν να προσδιοριστούν μέσω προγραμματισμού. Για παράδειγμα, τα μηνύματα κατάστασης παρουσιάζονται σε χρήστες υποστηρικτικών τεχνολογιών (π.χ. αναγνώστες οθόνης) χωρίς αυτοί να εστιάζονται. Αυτό είναι αντικείμενο από το Σημείο ελέγχου 4.1.3 Μηνύματα κατάστασης (Επίπεδο ΑΑ). Ανοίγει σελίδα με παράδειγμα για πλαίσιο επιλογής (checkbox).
Παραδείγματα για μηνύματα κατάστασης.- Τα προϊόντα προστέθηκαν στο καλάθι αγορών ενός ηλεκτρονικού καταστήματος.
- Προστέθηκαν 3 βιβλία στη λίστα παρακολούθησης.
- Η φόρμα αποστάλθηκε με επιτυχία.
- 5 αποτελέσματα αναζήτησης. Για παράδειγμα, μετά το φιλτράρισμα των αποτελεσμάτων.
- 3 σφάλματα στη φόρμα. Κατά τον έλεγχο από την πλευρά του πελάτη χωρίς να ξαναφορτώνεται η σελίδα.
- Η βαθμολογία άλλαξε.
- Η σελίδα φορτώνεται, με οπτική ένδειξη φόρτωσης (progressbar).
Γιατί ελέγχεται;
Σε πολλά περιβάλλοντα χρήσης, οι βλέποντες χρήστες λαμβάνουν μηνύματα κατάστασης που παρέχουν πληροφορίες σχετικά με το αποτέλεσμα των αλληλεπιδράσεων. Για παράδειγμα, τον αριθμό των καταχωρήσεων που επιστρέφονται κατά το φιλτράρισμα μιας λίστας αποτελεσμάτων αναζήτησης. Αλλά και την επιτυχία ή την αποτυχία των συναλλαγών.
Αυτά τα μηνύματα είναι εξίσου σημαντικά για μη βλέποντες χρήστες. Πρέπει να είναι διαθέσιμα και για υποστηρικτικές τεχνολογίες. Έτσι ώστε οι χρήστες να τα αντιλαμβάνονται χωρίς να χρειάζεται να αλλάξουν την τρέχουσα εστίαση ή άποψή τους.
Πώς ελέγχεται;
1. Εφαρμογή του σημείου ελέγχου
Το σημείο ελέγχου ισχύει εάν το περιεχόμενο δημιουργεί μηνύματα κατάστασης που δε λαμβάνουν εστίαση. Δεν ισχύει όταν εμφανίζονται μηνύματα που σχετίζονται με αλλαγές περιβάλλοντος. Για παράδειγμα, όταν μετά την υποβολή μιας φόρμας η σελίδα ξαναφορτώνεται και μετά εμφανίζεται ένα μήνυμα σφάλματος πριν από τη φόρμα.
2. Έλεγχος
- Προσδιορίστε μηνύματα κατάστασης. Λόγο αυτού κάνετε καταχωρήσεις που οδηγούν στη δημιουργία μηνυμάτων κατάστασης.
- Χρησιμοποιήστε την ανάλυση πηγαίου κώδικα για να ελέγξετε εάν το στοιχείο με το μήνυμα κατάστασης έχει επισημανθεί ως
ARIA Live
. Υπάρχουν διαθέσιμα αντίστοιχα χαρακτηριστικάARIA Live
; - Επίσης, ελέγξτε την έξοδο του μηνύματος κατάστασης χρησιμοποιώντας το πρόγραμμα ανάγνωσης οθόνης.
- Πραγματοποιήστε καταχωρήσεις που οδηγούν στη δημιουργία μηνυμάτων κατάστασης. Δημιουργεί η σελίδα από μόνη της μηνύματα κατάστασης; Για παράδειγμα, όταν ενημερώνεται το περιεχόμενο, περιμένετε αυτά τα μηνύματα.
- Ελέγξτε εάν τα μηνύματα κατάστασης ανακοινώνονται από το πρόγραμμα ανάγνωσης οθόνης. Βέβαια, χωρίς να μετακινήσετε την εστίαση στο μήνυμα όταν εμφανίζεται.
3. Σημειώσεις
Δε θεωρείται ως μήνυμα κατάστασης.- Μήνυμα σφάλματος μέσω διαλόγου (αλλαγή περιβάλλοντος λόγω μετατροπής εστίασης).
- Η προσθήκη στοιχείων ελέγχου όπως: πρόσθετα πεδία φόρμας.
Εάν το μήνυμα κατάστασης εξάγεται όντως από το πρόγραμμα ανάγνωσης οθόνης μπορεί να διαφέρει ανάλογα με το πρόγραμμα περιήγησης και το πρόγραμμα ανάγνωσης οθόνης που χρησιμοποιείται. Η επιτυχία μπορεί να εξαρτάται από το εάν το μήνυμα κατάστασης έχει εισαχθεί σε ένα ήδη υπάρχον στοιχείο. Επίσης, εάν έχει οριστεί μια μικρή χρονική καθυστέρηση πριν από τη δημιουργία του μηνύματος. Για την καλύτερη δυνατή υποστήριξη σε διαφορετικά περιβάλλοντα.
- Όταν φορτώνεται η σελίδα, θα πρέπει να υπάρχει ένα (κενό) στοιχείο στο DOM και να επισημαίνεται ως
Live-Region
. - Μόνο όταν ενεργοποιηθεί η ενημέρωση, η αλλαγή κειμένου πρέπει να εισαχθεί ή να ενημερωθεί στο υπάρχον (κενό) στοιχείο.
role="status"
.
- Η τεχνική ARIA 22 από τις Οδηγίες προσβασιμότητας περιεχομένου Ιστού (WCAG 2.1) περιγράφει τη χρήση του
role="status"
για την ενημέρωση ενός καλαθιού αγορών. Δείτε το παράδειγμα 2. Προκειμένου η έξοδος να λειτουργεί με το πρόγραμμα ανάγνωσης οθόνης NVDA στον Firefox, πρέπει να προστεθεί τοaria-atomic="true"
.
4. Αξιολόγηση
Κριτήριο ικανοποιείται.- Όλα τα μηνύματα κατάστασης επισημαίνονται σωστά. Επομένως, είναι διαθέσιμα μέσω προγραμματισμού.
Ταξινόμηση του σημείου ελέγχου 4.1.3 Μηνύματα κατάστασης
Ταξινόμηση του σημείου ελέγχου σύμφωνα με το WCAG 2.1
Κατευθυντήρια γραμμή Κριτήριο επιτυχίας- 4.1.3 Status messages (Level AA)
Κατάσταση Α: Εάν ένα μήνυμα κατάστασης ενημερώνει για την επιτυχία ή τα αποτελέσματα μιας ενέργειας ή την κατάσταση μιας εφαρμογής:
- ARIA22: Using role=status to present status messages in combination with any of the following:
Κατάσταση Β: Εάν ένα μήνυμα κατάστασης μεταφέρει μια πρόταση ή μια προειδοποίηση σχετικά με την ύπαρξη σφάλματος
- ARIA19: Using ARIA role=alert or Live Regions to Identify Errors in combination with any of the following:
- G83: Providing text descriptions to identify required fields that were not completed
- G84: Providing a text description when the user provides information that is not in the list of allowed values
- G85: Providing a text description when user input falls outside the required format or values
- G177: Providing suggested correction text
- G194: Providing spell checking and suggestions for text input
Κατάσταση Γ: Εάν ένα μήνυμα κατάστασης μεταφέρει πληροφορίες σχετικά με την πρόοδο μιας διαδικασίας:
- ARIA23: Using role=log to identify sequential information updates
- ARIA22: Using role=status to present status messages in combination with G193: Providing help by an assistant in the Web page
Πηγές
Understanding Success Criterion 4.1.3 Status Messages (πληροφορίες μόνο στα Αγγλικά διαθέσιμες).
Προσδιορισμός του W3C ενός μηνύματος κατάστασης: Προσδιορισμός του W3C ενός μηνύματος κατάστασης (στα Αγγλικά)
Προσδιορισμός του W3C του χαρακτηριστικού Live-Region: Προσδιορισμός του W3C του χαρακτηριστικού Live-Region (στα Αγγλικά)
Προσδιορισμός ARIA 1.1: Προσδιορισμός ARIA 1.1 (στα Αγγλικά)