Σημείο ελέγχου 1.4.3(a) Αντίθεση (Ελάχιστη)

Όλο το κείμενο στη σελίδα πρέπει να έχει επαρκείς αντιθέσεις φωτεινότητας. Θα πρέπει επίσης να είναι αισθητά σε χρήστες με ανεπάρκεια χρωματικής όρασης. Για σελίδες που προσφέρουν μια έκδοση επαρκώς υψηλής αντίθεσης μέσω εναλλαγής στυλ, ελέγχεται επίσης εάν η αρχική κατάσταση πληροί τις ελάχιστες απαιτήσεις για αντίθεση γραμματοσειράς. Είναι αντικείμενο από το Σημείο ελέγχου 1.4.3(a) Αντίθεση (Ελάχιστη).

Εάν τα χρώματα του προσκηνίου και του φόντου είναι παρόμοια σε φωτεινότητα, ενδέχεται να έχουν πολύ μικρή αντίθεση όταν προβάλλονται σε ασπρόμαυρες οθόνες ή από άτομα με διάφορους τύπους χρωματικής ανεπάρκειας.

Η έξοδος μιας σελίδας υψηλότερης αντίθεσης από έναν εναλλάκτη στυλ δεν πρέπει να έχει ως αποτέλεσμα η τυπική σελίδα να μην ενδιαφέρεται πλέον για τις χρησιμοποιήσιμες αντιθέσεις. Πολλοί χρήστες δεν παρατηρούν το στοιχείο εναλλαγής Styleswitcher, δεν κατανοούν τη λειτουργία ή προτιμούν να χρησιμοποιούν τη σελίδα στην αρχική της κατάσταση.

1. Εφαρμογή του σημείου ελέγχου

Το σημείο ελέγχου δηλ. Κριτήριο επιτυχίας 1.4.3(a) Αντίθεση (Ελάχιστη), ισχύει εάν η σελίδα περιέχει κείμενο.

2. Έλεγχος

2.1. Έλεγχος των αντιθέσεων κειμένου της τυπικής έκδοσης

1. Οπτική επιθεώρηση. Οι αντιθέσεις των γραμματοσειρών είναι αρκετά ισχυρές;
2. Εάν έχετε αμφιβολίες, ανοίξτε το Contrast Analyzer. Βεβαιωθείτε ότι το Luminosity είναι επιλεγμένο στο μενού Options > Algorithm.
3. Ενεργοποιήστε το επιπρόσθετο Web Developer Toolbar και τη συνάρτηση Information > Show Elementinformation. στοιχείου στη γραμμή εργαλείων προγραμματιστή Ιστού.
4. Κάντε κλικ στο κείμενο που πρέπει να ελεγχθεί. Το κίτρινο παράθυρο "Πληροφορίες στοιχείων" στην επάνω αριστερή γωνία δείχνει τώρα το αντίστοιχο μέγεθος γραμματοσειράς σε pixel.
5. Στην περιοχή Προσκηνίου, χρησιμοποιήστε το σταγονόμετρο για να επιλέξετε το χρώμα του προσκηνίου και μετά το χρώμα του φόντου στην περιοχή του φόντου. Για μεγέθη γραμματοσειράς κάτω από 24 px (ή 18,7 px για έντονη γραμματοσειρά), ελέγξτε εάν η αναλογία αντίθεσης είναι 4,5:1 ή μεγαλύτερη. Για μεγάλες γραμματοσειρές, ελέγξτε αν η αναλογία αντίθεσης είναι 3:1 ή μεγαλύτερη.
6. Για την εκτέλεση συνδέσμων κειμένου διαφορετικών χρωμάτων χωρίς άλλες διαφορές στη σήμανση, όπως η υπογράμμιση, ελέγξτε εάν η αναλογία αντίθεσης προς το τυπικό κείμενο που εκτελείται είναι τουλάχιστον 3:1.

2.2. Έλεγχος Styleswitcher, έλεγχος των αντιθέσεων κειμένου της εναλλακτικής προβολής

Εάν οι αντιθέσεις της τυπικής έκδοσης δεν πληρούν τις στοχευόμενες τιμές και ο ιστότοπος προσφέρει προβολή υψηλότερης αντίθεσης μέσω εναλλαγής στυλ:

1. Ελέγξτε την αντίθεση κειμένου του στοιχείου εναλλαγής στιλ. Η αναλογία αντίθεσης πρέπει να είναι 4,5:1 ή καλύτερη και οι άλλες απαιτήσεις (π.χ. λειτουργικό με πληκτρολόγιο, χρήση χωρίς φύλλα στυλ) πρέπει επίσης να πληρούνται. Διαφορετικά ακυρώστε.
2. Καλέστε μια εναλλακτική προβολή υψηλότερης αντίθεσης χρησιμοποιώντας την εναλλαγή στυλ.
3. Ελέγξτε τις αντιθέσεις κειμένου της εναλλακτικής προβολής (όπως στο 2.1 Έλεγχος αντιθέσεων κειμένου της τυπικής έκδοσης).

3. Σημειώσεις

3.1. Γενικές πληροφορίες

• Τα στοιχεία που μπορεί να έχουν διαφορετικές καταστάσεις θα πρέπει πάντα να έχουν επαρκή αντίθεση. Έτσι, για παράδειγμα: επίσης η επιλεγμένη επιλογή μενού με χρώμα. Οι σύνδεσμοι που επισκεφτήκατε εμφανίζονται επίσης με διαφορετικό χρώμα. Ο καθοριστικός παράγοντας για την αξιολόγηση είναι η λιγότερη αντίθεση φωτεινότητας.
• Η μόνη εξαίρεση είναι ότι η εναλλαγή μεταξύ των δύο καταστάσεων είναι σχετικά εύκολη. Επισήμανση της εστίασης του ποντικιού ή του πληκτρολογίου. Το πρώτο βήμα εδώ είναι να ελέγξετε σε ποια κατάσταση (εστίαση/μη εστίαση ενός στοιχείου) η αντίθεση φωτεινότητας είναι καλύτερη. Αυτή η καλύτερη συνθήκη όσον αφορά την αντίθεση φωτεινότητας πρέπει να πληροί το γενικό όριο των 4,5:1. Η χρωματική αντίθεση της δεύτερης κατάστασης πρέπει να είναι πάνω από 3:1.
• Οι αδύναμες αντιθέσεις μπορεί να είναι χρήσιμες. Μπορούν να κάνουν τη χρήση ενός ιστότοπου πιο εύκολη. Για παράδειγμα, οι λειτουργίες που προορίζονται κατ' αρχήν αλλά δεν είναι διαθέσιμες αυτήν τη στιγμή εμφανίζονται με ασθενή αντίθεση. Αυτό είναι αποδεκτό εάν το κρυφό στοιχείο δεν είναι απαραίτητο για τον προσανατολισμό και τη λειτουργία. Επομένως, το σημείο ελέγχου γενικά δεν ισχύει για τις ετικέτες των κρυφών, απενεργοποιημένων κουμπιών.
• Για περιοχές που αντιδρούν στον κέρσορα του ποντικιού με αλλαγές χρώματος, ένα στιγμιότυπο οθόνης μπορεί να βοηθήσει στον προσδιορισμό της τιμής του χρώματος σε "κατάσταση ηρεμίας". Εναλλακτικά, μπορείτε να δημιουργήσετε την κατάσταση εστίασης χρησιμοποιώντας το πληκτρολόγιο και στη συνέχεια να μετρήσετε την αντίθεση με την πιπέτα του Contrast Analyzer.
• Εάν πρέπει να ελεγχθεί η αντίθεση των λεπτών γραμματοσειρών, μεγεθύνετε τη γραμματοσειρά εάν χρειάζεται και απενεργοποιήστε την εξομάλυνση της γραμματοσειράς.
• Εάν θέλετε να προσδιορίσετε τις τιμές χρώματος πολύ μικρών περιοχών (λεπτές γραμματοσειρές ή μικρά εικονίδια), μπορεί να είναι ευκολότερο να τραβήξετε ένα στιγμιότυπο οθόνης και να χρησιμοποιήσετε τα πιο ισχυρά εργαλεία Zoom και σταγονόμετρου ενός προγράμματος επεξεργασίας εικόνας.

3.2. Σημειώσεις σχετικά με τον έλεγχο σελίδων με το Styleswitcher

Ο έλεγχος αντίθεσης για προβολή υψηλότερης αντίθεσης που καλείται από τον εναλλάκτη στυλ πραγματοποιείται μόνο υπό τις ακόλουθες συνθήκες:

• Το κουμπί Styleswitcher (ή ο άμεσος σύνδεσμος σε μια σελίδα Styleswitcher) είναι σαφώς ορατό στο επάνω μέρος της σελίδας.
• Το στοιχείο μεταγωγής έχει τουλάχιστον 4,5:1 χρωματική αντίθεση και πληροί επίσης τις άλλες απαιτήσεις προσβασιμότητας. Για παράδειγμα, μπορεί να λειτουργήσει μέσω πληκτρολογίου και μπορεί να χρησιμοποιηθεί χωρίς φύλλα στυλ.
• Η εναλλακτική προβολή υψηλότερης αντίθεσης πρέπει να έχει τις ίδιες πληροφορίες και λειτουργικότητα με την αρχική προβολή.

3.3. Σημειώσεις για τη μέτρηση του χρωματικής αντίθεσης

• Η χρωματική αντίθεση (σχετική φωτεινότητα) μετράει για την αξιολόγηση σύμφωνα με έναν τύπο που ορίζεται στο WCAG 2.0. Αυτός ο τύπος αντικαθιστά τον τύπο που χρησιμοποιήθηκε προηγουμένως στο A11y τεστ για τον προσδιορισμό της αντίθεσης φωτεινότητας.
• Ο έλεγχος αντίθεσης για κανονικό κείμενο και μεγάλο κείμενο βασίζεται στις μετρούμενες τιμές του μεγέθους γραμματοσειράς σε pixel. Ελέγξτε με το επιπρόσθετο Web Developer Toolbar , συνάρτηση Show Elementinformation). Γιατί η μέτρηση του πραγματικού μεγέθους σημείου που εμφανίζεται στην οθόνη με τυπόμετρο δεν είναι πρακτική. Με ανάλυση οθόνης 96 dpi, 18 points αντιστοιχούν σε περίπου 24 pixel, 14 στιγμών αντιστοιχούν σε περίπου 18,7 pixel.
• Η μέτρηση του ισοδύναμου εικονοστοιχείων δικαιολογείται από το γεγονός ότι οι πράκτορες χρήστη που έχουν δοκιμαστεί μέχρι στιγμής αντιμετωπίζουν τη σήμανση σε εικονοστοιχεία και στιγμών αναλόγως (σε αναλογία 4:3., Δηλαδή ανεξάρτητα από την ανάλυση οθόνης κάτω από την οποία εμφανίζεται το κείμενο. Θα ήταν πιο σωστό εάν οι πράκτορες χρήστη αξιολογούσαν την ανάλυση οθόνης για να υπολογίσουν το μέγεθος εξόδου (δηλαδή περισσότερα pixel ανά σημείο σε οθόνες υψηλότερης ανάλυσης). Η τιμή αναφοράς των 96 dpi ανάλυσης οθόνης είναι καθοριστική για τον έλεγχο, για τον οποίο ισχύει οπωσδήποτε η αντιστοιχία.

4. Αξιολόγηση

Ικανοποιείται

• Η αναλογία χρωματικής αντίθεσης μεταξύ των χρωμάτων προσκηνίου και φόντου είναι τουλάχιστον 4,5:1 για κείμενα κάτω των 18 στιγμών (ή για έντονα κείμενα κάτω των 14 στιγμών).
• Η αναλογία χρωματικής αντίθεσης μεταξύ των χρωμάτων του προσκηνίου και του φόντου είναι τουλάχιστον 3:1 για κείμενα σε μεγάλα μεγέθη γραμματοσειράς (18 στιγμών και άνω, 14 στιγμών και μεγαλύτερα για έντονες γραμματοσειρές). Η χρωματική αντίθεση της χειρότερης κατάστασης της εστίασης του ποντικιού και του πληκτρολογίου είναι πάνω από 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

Κατευθυντήρια γραμμή

• Guideline 1.4 Distinguishable: Make it easier for users to see and hear content including separating foreground from background

Κριτήρια επιτυχίας

• 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

Αποτυχίες

• F83: Failure of Success Criterion 1.4.3 and 1.4.6 due to using background images that do not provide sufficient contrast with foreground text (or images of text)

Πηγές

Δείτε το σημείο ελέγχου 1.4.3c "Ορατό περιεχόμενο με προσαρμοσμένα χρώματα".

Το αποτέλεσμα του τύπου WCAG 2.0 για τη μέτρηση της χρωματικής αντίθεσης συχνά δεν αντιστοιχεί στην υποκειμενική εντύπωση. Πόσο αξιόπιστο είναι;

Υπάρχουν δύο σημεία που πρέπει να σημειωθούν εδώ:

1. Η αντίθεση φωτεινότητας είναι μόνο ένας από τους τρεις παράγοντες που επηρεάζουν τη συνολική χρωματική αντίθεση. Από αυτή την άποψη, είναι σαφές ότι το αποτέλεσμα για την αντίθεση φωτεινότητας δεν αντιστοιχεί στην υποκειμενική εντύπωση. Δεν πρέπει να ανταποκρίνεται στην υποκειμενική γενική εντύπωση, γιατί τελικά πρόκειται για το αν οι διαφορές στη φωτεινότητα των χρωμάτων έρχονται σε επαρκή αντίθεση από μόνες τους. Εάν έχετε κανονική όραση, η υποκειμενική εντύπωση της προβολής σε κλίμακα του γκρι μοιάζει περισσότερο με το αποτέλεσμα της φόρμουλας.

2. Τα χρώματα των γειτονικών περιοχών επηρεάζουν την αντίληψη, οι μικρές και λεπτές γραμματοσειρές φαίνεται να έχουν λιγότερη αντίθεση, υπάρχουν spillover εφέ, οι αντιθέσεις μπορεί να εξασθενήσουν από την εξομάλυνση της γραμματοσειράς. Ο τύπος δε λαμβάνει υπόψη όλους αυτούς τους παράγοντες. Τουλάχιστον όσον αφορά τα κείμενα, αυτό είναι επίσης κατάλληλο. Οι επιρροές που αναφέρονται δεν είναι σταθερές, εξαρτώνται, για παράδειγμα, από το επιλεγμένο μέγεθος γραμματοσειράς.

Για τον έλεγχο, σημαίνει το ακόλουθο: Όποιος δεν έχει εμπειρία με την αξιολόγηση των αντιθέσεων φωτεινότητας βάσει τύπων δεν μπορεί να βασιστεί στην υποκειμενική του εντύπωση. Πρέπει να εφαρμόσει τους κανόνες σε όλους σχεδόν τους χρωματικούς συνδυασμούς.