Τι ελέγχεται;
Όλο το κείμενο στη σελίδα πρέπει να έχει επαρκείς αντιθέσεις φωτεινότητας. Θα πρέπει επίσης να είναι αισθητά σε χρήστες με ανεπάρκεια χρωματικής όρασης. Για σελίδες που προσφέρουν μια έκδοση επαρκώς υψηλής αντίθεσης μέσω εναλλαγής στυλ, ελέγχεται επίσης εάν η αρχική κατάσταση πληροί τις ελάχιστες απαιτήσεις για αντίθεση γραμματοσειράς. Είναι αντικείμενο από το Σημείο ελέγχου 1.4.3(a) Αντίθεση (Ελάχιστη επίπεδο ΑΑ).
Γιατί ελέγχεται;
Εάν τα χρώματα του προσκηνίου και του φόντου είναι παρόμοια σε φωτεινότητα, ενδέχεται να έχουν πολύ μικρή αντίθεση όταν προβάλλονται σε ασπρόμαυρες οθόνες ή από άτομα με διάφορους τύπους χρωματικής ανεπάρκειας.
Η έξοδος μιας σελίδας υψηλότερης αντίθεσης από έναν εναλλάκτη στυλ (Styleswitcher) δεν πρέπει να έχει ως αποτέλεσμα η τυπική σελίδα να μην πληροί τις ελάχιστες απαιτήσεις για αντίθεση γραμματοσειράς. Πολλοί χρήστες δεν παρατηρούν το στοιχείο εναλλαγής Styleswitcher, δεν κατανοούν τη λειτουργία ή προτιμούν να χρησιμοποιούν τη σελίδα στην αρχική της κατάσταση.
Πώς ελέγχεται;
1. Εφαρμογή του σημείου ελέγχου
Το σημείο ελέγχου δηλαδή Κριτήριο επιτυχίας 1.4.3(a) Αντίθεση (Ελάχιστη), ισχύει εάν η σελίδα περιέχει κείμενο.2. Έλεγχος
2.1. Έλεγχος των αντιθέσεων κειμένου της τυπικής έκδοσης- Οπτική επιθεώρηση. Οι αντιθέσεις των γραμματοσειρών είναι αρκετά ισχυρές;
- Εάν έχετε αμφιβολίες, ανοίξτε το Contrast Analyzer. Βεβαιωθείτε ότι το Luminosity είναι επιλεγμένο στο μενού Options > Algorithm.
- Ενεργοποιήστε το επιπρόσθετο Web Developer Toolbar και τη συνάρτηση Information > Show Elementinformation στη γραμμή εργαλείων προγραμματιστή Ιστού.
- Κάντε κλικ στο κείμενο που πρέπει να ελεγχθεί. Το κίτρινο παράθυρο "Πληροφορίες στοιχείων" στην επάνω αριστερή γωνία δείχνει τώρα το αντίστοιχο μέγεθος γραμματοσειράς σε pixel.
- Στην περιοχή Προσκηνίου, χρησιμοποιήστε τη πιπέτα (σταγονόμετρο) για να επιλέξετε το χρώμα του προσκηνίου και μετά το χρώμα του φόντου στην περιοχή του φόντου. Για μεγέθη γραμματοσειράς κάτω από 24 px (ή 18,7 px για έντονη γραμματοσειρά), ελέγξτε εάν η αναλογία αντίθεσης είναι 4,5:1 ή μεγαλύτερη. Για μεγάλες γραμματοσειρές, ελέγξτε αν η αναλογία αντίθεσης είναι 3:1 ή μεγαλύτερη.
- Για την εκτέλεση συνδέσμων κειμένου διαφορετικών χρωμάτων χωρίς άλλες διαφορές στη σήμανση, όπως η υπογράμμιση, ελέγξτε εάν η αναλογία αντίθεσης προς το τυπικό κείμενο που εκτελείται είναι τουλάχιστον 3:1.
Εάν οι αντιθέσεις της τυπικής έκδοσης δεν πληρούν τις στοχευόμενες τιμές και ο ιστότοπος προσφέρει προβολή υψηλότερης αντίθεσης μέσω εναλλαγής στυλ:
- Ελέγξτε την αντίθεση κειμένου του στοιχείου εναλλαγής στυλ. Η αναλογία αντίθεσης πρέπει να είναι 4,5:1 ή καλύτερη και οι άλλες απαιτήσεις πρέπει επίσης να πληρούνται. Για παράδειγμα, λειτουργικό με πληκτρολόγιο, χρήση χωρίς φύλλα στυλ. Διαφορετικά ακυρώστε.
- Καλέστε μια εναλλακτική προβολή υψηλότερης αντίθεσης χρησιμοποιώντας την εναλλαγή στυλ.
- Ελέγξτε τις αντιθέσεις κειμένου της εναλλακτικής προβολής (όπως στο 2.1 Έλεγχος αντιθέσεων κειμένου της τυπικής έκδοσης).
3. Σημειώσεις
3.1. Γενικές πληροφορίες- Τα στοιχεία που μπορεί να έχουν διαφορετικές καταστάσεις θα πρέπει πάντα να έχουν επαρκή αντίθεση. Έτσι, για παράδειγμα: επίσης το επιλεγμένο στοιχείο μενού με χρώμα. Οι σύνδεσμοι που επισκεφτήκατε εμφανίζονται επίσης με διαφορετικό χρώμα. Ο καθοριστικός παράγοντας για την αξιολόγηση είναι η λιγότερη αντίθεση φωτεινότητας.
- Η μόνη εξαίρεση είναι ότι η εναλλαγή μεταξύ των δύο καταστάσεων είναι σχετικά εύκολη. Επισήμανση της εστίασης του ποντικιού ή του πληκτρολογίου. Το πρώτο βήμα εδώ είναι να ελέγξετε σε ποια κατάσταση η αντίθεση φωτεινότητας είναι καλύτερη, ενός στοιχείου όταν εστιάζεται και αντίστροφα. Αυτή η καλύτερη συνθήκη όσον αφορά την αντίθεση φωτεινότητας πρέπει να πληροί το γενικό όριο των 4,5:1. Η χρωματική αντίθεση της δεύτερης κατάστασης πρέπει να είναι πάνω από 3:1.
- Οι αδύναμες αντιθέσεις μπορεί να είναι χρήσιμες. Μπορούν να κάνουν τη χρήση ενός ιστοτόπου πιο εύκολη. Για παράδειγμα, οι λειτουργίες που προορίζονται κατ' αρχήν αλλά δεν είναι διαθέσιμες αυτήν τη στιγμή εμφανίζονται με ασθενή αντίθεση. Αυτό είναι αποδεκτό εάν το κρυφό στοιχείο δεν είναι απαραίτητο για τον προσανατολισμό και τη λειτουργία. Επομένως, το σημείο ελέγχου γενικά δεν ισχύει για τις ετικέτες των κρυφών, απενεργοποιημένων κουμπιών.
- Για περιοχές που αντιδρούν στον κέρσορα του ποντικιού με αλλαγές χρώματος, ένα στιγμιότυπο οθόνης μπορεί να βοηθήσει στον προσδιορισμό της τιμής του χρώματος. Εναλλακτικά, μπορείτε να δημιουργήσετε την κατάσταση εστίασης χρησιμοποιώντας το πληκτρολόγιο και στη συνέχεια να μετρήσετε την αντίθεση με την πιπέτα (σταγονόμετρο) του Contrast Analyzer.
- Εάν πρέπει να ελεγχθεί η αντίθεση των λεπτών γραμματοσειρών, μεγεθύνετε τη γραμματοσειρά εάν χρειάζεται και απενεργοποιήστε την εξομάλυνση της γραμματοσειράς.
- Εάν θέλετε να προσδιορίσετε τις τιμές χρώματος πολύ μικρών περιοχών (λεπτές γραμματοσειρές ή μικρά εικονίδια), μπορεί να είναι ευκολότερο να κάνετε ένα στιγμιότυπο οθόνης και να χρησιμοποιήσετε τα πιο ισχυρά εργαλεία Zoom και πιπέτα (σταγονόμετρο) ενός προγράμματος επεξεργασίας εικόνας.
Ο έλεγχος αντίθεσης για προβολή υψηλότερης αντίθεσης που καλείται από τον εναλλάκτη στυλ (Styleswitcher) πραγματοποιείται μόνο υπό τις ακόλουθες συνθήκες:
- Το κουμπί εναλλάκτη στυλ (Styleswitcher) ή ο άμεσος σύνδεσμος σε μια σελίδα εναλλάκτη στυλ (Styleswitcher) είναι σαφώς ορατό στο επάνω μέρος της σελίδας.
- Το κουμπί ενεργοποιήσης του εναλλάκτη στύλ έχει τουλάχιστον 4,5:1 χρωματική αντίθεση και πληροί επίσης τις άλλες απαιτήσεις προσβασιμότητας. Για παράδειγμα, μπορεί να λειτουργήσει μέσω πληκτρολογίου και μπορεί να χρησιμοποιηθεί χωρίς φύλλα στυλ.
- Η εναλλακτική προβολή υψηλότερης αντίθεσης πρέπει να έχει τις ίδιες πληροφορίες και λειτουργικότητα με την αρχική προβολή.
- Η χρωματική αντίθεση (σχετική φωτεινότητα) μετράει για την αξιολόγηση σύμφωνα με έναν τύπο που ορίζεται στο WCAG 2.0.
- Ο έλεγχος αντίθεσης για κανονικό κείμενο και μεγάλο κείμενο βασίζεται στις μετρούμενες τιμές του μεγέθους γραμματοσειράς σε pixel. Ελέγξτε με το επιπρόσθετο Web Developer Toolbar, συνάρτηση Show Elementinformation. Γιατί η μέτρηση του πραγματικού μεγέθους dots που εμφανίζεται στην οθόνη με τυπόμετρο δεν είναι πρακτική. Με ανάλυση οθόνης 96 dpi, 18 dots αντιστοιχούν σε περίπου 24 pixel και 14 dots αντιστοιχούν σε περίπου 18,7 pixel.
- Η μέτρηση του ισοδύναμου εικονοστοιχείων δικαιολογείται από το γεγονός ότι οι πράκτορες χρήστη που έχουν δοκιμαστεί μέχρι στιγμής αντιμετωπίζουν τη σήμανση σε pixel και dots αναλόγως σε αναλογία 4:3. Δηλαδή ανεξάρτητα από την ανάλυση οθόνης κάτω από την οποία εμφανίζεται το κείμενο. Θα ήταν πιο σωστό εάν οι πράκτορες χρήστη αξιολογούσαν την ανάλυση οθόνης για να υπολογίσουν το μέγεθος εξόδου (δηλαδή περισσότερα pixel ανά dots σε οθόνες υψηλότερης ανάλυσης). Η τιμή αναφοράς των 96 dpi ανάλυσης οθόνης είναι καθοριστική για τον έλεγχο, για τον οποίο ισχύει οπωσδήποτε η αντιστοιχία.
4. Αξιολόγηση
Κριτήριο ικανοποιείται- Η αναλογία χρωματικής αντίθεσης μεταξύ των χρωμάτων προσκηνίου και φόντου είναι τουλάχιστον 4,5:1 για κείμενα κάτω των 18 dots (ή για έντονα κείμενα κάτω των 14 dots).
- Η αναλογία χρωματικής αντίθεσης μεταξύ των χρωμάτων του προσκηνίου και του φόντου είναι τουλάχιστον 3:1 για κείμενα σε μεγάλα μεγέθη γραμματοσειράς (18 dots και άνω, 14 dots και μεγαλύτερα για έντονες γραμματοσειρές). Η χρωματική αντίθεση της χειρότερης κατάστασης της εστίασης του ποντικιού και του πληκτρολογίου είναι πάνω από 3:1.
- Εάν η απαίτηση ικανοποιείται μόνο μέσω εναλλακτικής προβολής, η αρχική προβολή έχει επίσης επαρκή αντίθεση (3,5:1 για κανονικό κείμενο και 3:1 για μεγάλο κείμενο), το ίδιο το Styleswicher πληροί την απαίτηση αντίθεσης 4,5:1 και άλλες απαιτήσεις προσβασιμότητας.
Ταξινόμηση του σημείου ελέγχου
Διατύπωση A11y WCAG 2.0
1.4.3 ΑντίθεσηΚατά την οπτική παρουσίαση γραφικών κειμένου και γραμματοσειρών, η αναλογία χρωματικής αντίθεσης μεταξύ των χρωμάτων προσκηνίου και φόντου είναι τουλάχιστον 4,5:1. Για γραφικά μεγάλου μεγέθους γραμματοσειράς και γραμματοσειράς με μεγάλο μέγεθος, ισχύει αναλογία χρωματικής αντίθεσης τουλάχιστον 3:1.
Δεν απαιτείται ελάχιστη χρωματική αντίθεση για μη σημαντικά κείμενα και γραφικά κειμένου,- που αποτελούν μέρος ενός ανενεργού στοιχείου της διεπαφής χρήστη,
- που είναι καθαρά διακοσμητικά,
- που είναι τυχαίο κείμενο σε μια εικόνα ή
- τα οποία δεν είναι ορατά στον χρήστη.
Επίσης, δεν υπάρχουν ελάχιστες χρωματικής αντίθεσης για κείμενο που αποτελεί μέρος ενός λογότυπου ή επωνυμίας.
Ταξινόμηση του σημείου ελέγχου σύμφωνα με το WCAG 2.0
Κατευθυντήρια γραμμή Κριτήρια επιτυχίας- 1.4.3 Contrast (Minimum) (Level A)
- 2.4.7 Focus Visible (Level AA)
- G18: Ensuring that a contrast ratio of at least 4.5:1 exists between text (and images of text) and background behind the text
- G145: Ensuring that a contrast ratio of at least 3:1 exists between text (and images of text) and background behind the text
- G148: Not specifying background color, not specifying text color, and not using technology features that change those defaults
- G174: Providing a control with a sufficient contrast ratio that allows users to switch to a presentation that uses sufficient contrast
- G183: Using a contrast ratio of 3:1 with surrounding text and providing additional visual cues on focus for links or controls where color alone is used to identify them
Πηγές
Δείτε το σημείο ελέγχου 1.4.3c "Ορατό περιεχόμενο με προσαρμοσμένα χρώματα".Ερωτήσεις σχετικά του σημείου ελέγχου
Ερώτηση: Το αποτέλεσμα του τύπου WCAG 2.0 για τη μέτρηση της χρωματικής αντίθεσης συχνά δεν αντιστοιχεί στην υποκειμενική εντύπωση. Πόσο αξιόπιστο είναι;
Απάντηση: Υπάρχουν δύο σημεία που πρέπει να σημειωθούν εδώ:Η αντίθεση φωτεινότητας είναι μόνο ένας από τους τρεις παράγοντες που επηρεάζουν τη συνολική χρωματική αντίθεση. Από αυτή την άποψη, είναι σαφές ότι το αποτέλεσμα για την αντίθεση φωτεινότητας δεν αντιστοιχεί στην υποκειμενική εντύπωση. Δεν πρέπει να ανταποκρίνεται στην υποκειμενική γενική εντύπωση, γιατί τελικά πρόκειται για το αν οι διαφορές στη φωτεινότητα των χρωμάτων έρχονται σε επαρκή αντίθεση από μόνες τους. Εάν έχετε κανονική όραση, η υποκειμενική εντύπωση της προβολής σε κλίμακα του γκρι μοιάζει περισσότερο με το αποτέλεσμα του υπολογισμού.
Τα χρώματα των γειτονικών περιοχών επηρεάζουν την αντίληψη, οι μικρές και λεπτές γραμματοσειρές φαίνεται να έχουν λιγότερη αντίθεση. Έχει ως αποτέλεσμα το spillover εφέ και οι αντιθέσεις μπορεί να εξασθενήσουν από την εξομάλυνση της γραμματοσειράς. Ο υπολογισμός δε λαμβάνει υπόψη όλους αυτούς τους παράγοντες. Τουλάχιστον όσον αφορά τα κείμενα, αυτό είναι επίσης κατάλληλο. Οι επιρροές που αναφέρονται δεν είναι σταθερές, εξαρτώνται, για παράδειγμα, από το επιλεγμένο μέγεθος γραμματοσειράς.
Για τον έλεγχο, σημαίνει το ακόλουθο: Όποιος δεν έχει εμπειρία με την αξιολόγηση των αντιθέσεων φωτεινότητας βάσει υπολογισμών δεν μπορεί να βασιστεί στην υποκειμενική του εντύπωση. Πρέπει να εφαρμόσει τους κανόνες σε όλους σχεδόν τους χρωματικούς συνδυασμούς.