Κατανόηση του sRGB στον Υπολογισμό Αντίθεσης

1. Τι είναι το sRGB;

Το sRGB (Standard Red Green Blue) είναι ο προεπιλεγμένος χρωματικός χώρος για τον ιστό, ορισμένος από το διεθνές πρότυπο IEC 61966-2-1. Δημιουργήθηκε το 1996 από τις HP και Microsoft, σχεδιασμένο να παρέχει συνεπή εμπειρία χρωμάτων σε οθόνες, εκτυπωτές και ψηφιακές κάμερες. Το WCAG 2.2 ορίζει το sRGB ως τον χρωματικό χώρο αναφοράς για τον υπολογισμό σχετικής φωτεινότητας και αναλογιών αντίθεσης. Αυτό σημαίνει ότι κάθε υπολογισμός αντίθεσης πρέπει να χρησιμοποιεί τη συνάρτηση μεταφοράς sRGB για συγκρίσιμα αποτελέσματα. Η επιλογή του sRGB εξασφαλίζει ότι οι μετρήσεις προσβασιμότητας είναι συνεπείς ανεξάρτητα από το εργαλείο.

2. Η Συνάρτηση Μεταφοράς sRGB

Οι οθόνες δεν εκπέμπουν φως αναλογικά με τις αποθηκευμένες τιμές χρώματος. Μια τιμή pixel 128 (από 255) δεν παράγει το μισό φως ενός pixel στο 255. Αυτή η μη γραμμική σχέση ονομάζεται κωδικοποίηση gamma, και η συνάρτηση μεταφοράς sRGB είναι η συγκεκριμένη καμπύλη που την αντιστρέφει. Για ακριβή υπολογισμό αντίθεσης, κάθε κανάλι χρώματος (R, G, B) πρέπει πρώτα να γραμμικοποιηθεί. Η προδιαγραφή sRGB ορίζει μια τμηματική συνάρτηση: τιμές ίσες ή κάτω από 0,04045 διαιρούνται με 12,92, ενώ υψηλότερες τιμές χρησιμοποιούν τον τύπο ((τιμή + 0,055) / 1,055) υψωμένο στη δύναμη 2,4. Αυτό το βήμα γραμμικοποίησης είναι κρίσιμο. Χωρίς αυτό, τα μεσαία χρώματα θα παρήγαγαν σημαντικά λανθασμένες τιμές φωτεινότητας.

3. sRGB vs Άλλοι Χρωματικοί Χώροι

Οι σύγχρονες οθόνες υποστηρίζουν ολοένα και περισσότερο ευρύτερους χρωματικούς χώρους όπως Display P3 (συσκευές Apple) και Adobe RGB (επαγγελματική φωτογραφία). Αυτοί οι χώροι μπορούν να αναπαραστήσουν πιο ζωντανά χρώματα από το sRGB. Ωστόσο, οι υπολογισμοί αντίθεσης WCAG χρησιμοποιούν πάντα sRGB, ακόμη και όταν η οθόνη υποστηρίζει ευρύτερο gamut. Τα χρώματα που ορίζονται σε CSS με P3 ή άλλους χώρους αντιστοιχίζονται στα ισοδύναμά τους sRGB για τη μέτρηση αντίθεσης. Στην πράξη, ένα ζεύγος χρωμάτων που περνά τον έλεγχο WCAG σε sRGB θα είναι επίσης αναγνώσιμο σε οθόνες ευρύτερου gamut. Αν σχεδιάζετε σε Display P3 ή Adobe RGB, πάντα επαληθεύετε τις αναλογίες αντίθεσης με τον τύπο WCAG βασισμένο σε sRGB.

4. Πρακτι��ές Επιπτώσεις για Σχεδιαστές

Η κατανόηση του sRGB είναι σημαντική για την καθημερινή σχεδιαστική εργασία. Πρώτον, πάντα ορίζετε τα χρώματα σχεδιασμού σε δεκαεξαδικές τιμές sRGB (#RRGGBB) για έργα web �� αυτό αποδίδουν τα προγράμματα περιήγησης από προεπιλογή. Δεύτερον, λάβετε υπόψη ότι οι τιμές χρωμάτων από εργαλεία σχεδιασμού όπως Figma ή Sketch μπορεί να χρησιμοποιούν διαφορετικά προφίλ χρωμάτων. Κατά την εξαγωγή για web, βεβαιωθείτε ότι εργάζεστε στο προφίλ sRGB. Τρίτον, η καμπύλη gamma sRGB σημαίνει ότι οι αλλαγές αντίθεσης δεν είναι γραμμικές. Μικρές προσαρμογές σε πολύ σκούρα ή πολύ ανοιχτά χρώματα έχουν μεγαλύτερη επίδραση στην αναλογία. Εργαστείτε με ανοιχτό τον ελεγκτή αντίθεσης.

Δοκιμάστε αυτό το παράδειγμα →