Έλεγχος Αντίθεσης Χρωμάτων
Ελέγξτε τις αναλογίες αντίθεσης χρωμάτων για συμμόρφωση WCAG 2.1. Επαληθεύστε άμεσα τα πρότυπα AA και AAA.
Τι είναι η αναλογία αντίθεσης WCAG;
Η αναλογία αντίθεσης WCAG μετρά τη διαφορά φωτεινότητας μεταξύ χρωμάτων προσκηνίου και φόντου. Από 1:1 έως 21:1.
Ποιες είναι οι απαιτήσεις WCAG AA και AAA;
Το WCAG AA απαιτεί ελάχιστο 4.5:1 για κανονικό κείμενο και 3:1 για μεγάλο κείμενο. Το AAA απαιτεί 7:1 και 4.5:1.
Τι μετράει ως μεγάλο κείμενο;
Μεγάλο κείμενο ορίζεται ως 18pt (24px) ή μεγαλύτερο, ή 14pt (18.66px) έντονο ή μεγαλύτερο.
Γιατί είναι σημαντική η αντίθεση χρωμάτων;
Η σωστή αντίθεση διασφαλίζει την αναγνωσιμότητα του κειμένου για άτομα με προβλήματα όρασης και βελτιώνει την αναγνωσιμότητα για όλους.
Πώς υπολογίζω την αναλογία αντίθεσης;
Υπολογίζεται χρησιμοποιώντας τις τιμές σχετικής φωτεινότητας. Ο τύπος είναι (L1 + 0.05) / (L2 + 0.05).
Ποια είναι η ελάχιστη αντίθεση για στοιχεία UI;
Το WCAG απαιτεί ελάχιστο 3:1 για στοιχεία UI και γραφικά αντικείμενα.
Μπορώ να χρησιμοποιήσω οποιονδήποτε συνδυασμό χρωμάτων;
Δεν πληρούν όλοι οι συνδυασμοί τα πρότυπα προσβασιμότητας. Χρησιμοποιήστε αυτόν τον έλεγχο για επαλήθευση.
Τι είναι η σχετική φωτεινότητα;
Είναι η αντιληπτή φωτεινότητα ενός χρώματος, από 0 (μαύρο) έως 1 (λευκό). Υπολογίζεται με το χρωματικό χώρο sRGB.
Πρέπει να ελέγξω την αντίθεση εικόνων;
Το κείμενο στις εικόνες πρέπει να πληροί τις ίδιες απαιτήσεις. Για διακοσμητικές εικόνες δεν ισχύει.
Ποια εργαλεία βοηθούν με την αντίθεση;
Χρησιμοποιήστε εργαλεία προγραμματιστή περιήγηση, πρόσθετα σχεδίασης ή online ελέγχους όπως αυτόν.
Πώς να χρησιμοποιήσετε το Έλεγχος Αντίθεσης Χρωμάτων
Ελέγξτε άμεσα αν η αντίθεση κειμένου και UI πληροί τα όρια AA και AAA του WCAG 2.1 — εξ ολοκλήρου στον browser σας. Δώστε δύο χρώματα και ο λόγος υπολογίζεται τοπικά, χωρίς να φεύγει τίποτα από τη συσκευή.
- Πληκτρολογήστε ή επικολλήστε το χρώμα του κειμένου στο πεδίο Foreground Color, σε οποιαδήποτε υποστηριζόμενη μορφή όπως HEX ή RGB.
- Συμπληρώστε το πεδίο Background Color με το χρώμα πίσω από το κείμενο για να υπολογιστεί ο λόγος αντίθεσης.
- Διαβάστε τον προκύπτοντα λόγο και τα σήματα επιτυχίας AA και AAA για κανονικό και μεγάλο μέγεθος κειμένου.
- Ρυθμίστε ένα από τα δύο χρώματα ώστε ο λόγος να ξεπερνά 4,5:1 για το κείμενο ροής ή 3:1 για μεγάλο κείμενο και στοιχεία UI.
- Εναλλάξτε τις τιμές Foreground Color και Background Color για να δοκιμάσετε τον αντίστροφο συνδυασμό, π.χ. ανοιχτό κείμενο σε σκούρο θέμα.
Το AAA (7:1) είναι αξιοζήλευτος στόχος για μεγάλα κείμενα, αλλά 4,5:1 (AA) είναι το ελάχιστο που ζητούν οι περισσότερες οδηγίες προσβασιμότητας.
Σχετικά εργαλεία
- Επιλογέας χρωμάτων Επιλέξτε οποιοδήποτε χρώμα από την οθόνη με το σταγονόμετρο. Αντιγράψτε κωδικούς HEX, RGB, HSL άμεσα. Δωρεάν εργαλείο online.
- Γεννήτρια παλέτας χρωμάτων Δημιουργήστε όμορφες, αρμονικές παλέτες χρωμάτων άμεσα με τη δωρεάν online γεννήτριά μας. Υποστηρίζει μονοχρωματικές, ανάλογες, συμπληρωματικές, τριαδικές, split-συμπληρωματικές και τετραδικές λειτουργίες. Ρυθμίστε χρώματα με sliders HSL, κλειδώστε αγαπημένα και εξάγετε ως CSS, Tailwind, JSON ή SVG. 100% βασισμένο σε πρόγραμμα περιήγησης, τα δεδομένα σας δεν φεύγουν ποτέ από τη συσκευή σας.
- Προσομοιωτής Αχρωματοψίας Δωρεάν διαδικτυακός προσομοιωτής αχρωματοψίας. Δοκιμάστε σχέδια για Πρωτανοπία, Δευτερανοπία, Τριτανοπία και άλλους τύπους. 100% ιδιωτικό, λειτουργεί στο πρόγραμμα περιήγησης.
- GIF Διαχωρισμός Καρέ Εξάγετε και κατεβάστε μεμονωμένα καρέ από κινούμενα GIF ως PNG ή sprite sheet. Δωρεάν διαδικτυακό εργαλείο με προεπισκόπηση και εξαγωγή ZIP.
- GIF Ανάστροφο Αντιστρέψτε τη σειρά αναπαραγωγής κινούμενων GIF δωρεάν online. Ανεβάστε, προεπισκοπήστε και κατεβάστε αμέσως.
- Αλλάκτης Ταχύτητας GIF Αλλάξτε την ταχύτητα κίνησης GIF online. Επιταχύνετε ή επιβραδύνετε αρχεία GIF άμεσα.
- Βίντεο σε GIF Μετατρέψτε βίντεο σε κινούμενο GIF online. Ρυθμίστε ποιότητα, ρυθμό καρέ και ανάλυση απευθείας στον browser χωρίς ανέβασμα.
- Δημιουργός Memes Δωρεάν δημιουργός memes online. Προσθέστε κλασικές λεζάντες πάνω και κάτω σε οποιαδήποτε εικόνα, σύρετέ τις ελεύθερα και κατεβάστε το meme σας άμεσα σε PNG ή JPEG.