कॉन्ट्रास्ट चेकर – Contrast Checker

हा कॉन्ट्रास्ट चेकर ADA अनुपालनासाठी WCAG आणि APCA रंगाचा कॉन्ट्रास्ट तपासतो - कोणत्याही वेबसाइटसाठी रंगाची प्रवेशयोग्यता चाचणी.

✅ या कॉन्ट्रास्ट चेकरमधून तुम्हाला काय मिळेल: - WCAG 2.2 कॉन्ट्रास्ट गुणोत्तर आणि APCA Lc, - पृष्ठावर समस्यांसह घटक हायलाइट केलेले, - रंग तयार करणारे CSS नियम, स्रोत नकाशाद्वारे ट्रेस केलेले (जर उपलब्ध असेल), - कॉन्ट्रास्ट विश्लेषक आणि सुचवलेले पर्यायांसह अंतर्निर्मित रंग निवडक साधन, - दुरुस्त्यांचा थेट पूर्वावलोकन, - CSS मध्ये दुरुस्त्या निर्यात करणे (स्रोत-स्थानिक टिप्पण्या सह). 🔍 पृष्ठ रंग कॉन्ट्रास्ट चेकर म्हणून तयार केलेले, जे पॅस्यूडो-स्टेट्स, शॅडो DOM, समान-उत्पत्ति iframe, आणि प्रतिमांवर व ग्रेडियंट्सवर मजकूर यांना चालवते — फक्त सपाट पार्श्वभूमी नाही. ⚠️ डिबगर परवानगी आवश्यक आहे. या कॉन्ट्रास्ट चेकरचे कव्हरेज फक्त Chrome DevTools प्रोटोकॉलद्वारे शक्य आहे, ज्याला 'डिबगर' परवानगी आवश्यक आहे. एकदा संलग्न झाल्यावर, Chrome सर्व टॅबमध्ये एक इन्फोबार दर्शवतो आणि तो वेगळा केल्यावर लपवत नाही. ⚡ अत्यंत ऑप्टिमाइझ केलेला कार्यप्रवाह: • रंग प्रवेशयोग्यता समस्यांसह सर्व घटक एक नजरेत हायलाइट केलेले पहा. • त्वरित बदलांचे पूर्वावलोकन करा, कॉन्ट्रास्ट गुणोत्तर आणि निकाल पुन्हा गणना केले जातात. • स्टाईलशीट टॅबवर कस्टम CSS लागू करा; प्रभावित समस्यांना यादीत चिन्हांकित केले जाते. • रंग कॉन्ट्रास्ट मॅन्युअली तपासण्यासाठी, अंतर्निर्मित रंग निवडक साधन वापरा: अग्रभूमी सेट करण्यासाठी डावे-क्लिक करा, पार्श्वभूमीसाठी उजवे-क्लिक करा, आणि गुणोत्तर त्वरित अद्यतनित होते. • दुरुस्त करत असलेल्या घटकांशिवाय सर्व काही लपवण्यासाठी अपवाद टॅब वापरा. 📐 निकालांच्या मागील निकष. हा कॉन्ट्रास्ट गुणोत्तर चेकर रंग प्रवेशयोग्यता WCAG आणि APCA आवश्यकता विरुद्ध चाचणी करतो. APCA Lc ब्रिज-PCA थ्रेशोल्ड्स विरुद्ध ग्रेड केले जाते, जे जुळणाऱ्या WCAG गुणोत्तरांपेक्षा कठोर आहेत — त्यामुळे ब्रिज-PCA पास नेहमी WCAG पास दर्शवतो. 🔬 APCA काय आहे? APCA (Accessible Perceptual Contrast Algorithm) हा एक मॉडेल आहे जो लोक स्क्रीनवर मजकूर कसा वाचतात हे ट्रॅक करतो. समान WCAG गुणोत्तर असलेल्या दोन रंगांच्या जोड्या स्पष्टपणे भिन्न दिसू शकतात, आणि त्यांचा APCA Lc (ल्यूमिनन्स कॉन्ट्रास्ट) ते दर्शवतो: एक जोड WCAG पास करू शकते तरी वाचायला कठीण वाटू शकते. हा वेबसाइट रंग प्रवेशयोग्यता चेकर दोन्ही संख्या गणना करतो. 🚧 मर्यादा: 1. इतर वेबसाइट प्रवेशयोग्यता चेकर्सप्रमाणेच, हा सर्वोत्तम प्रयत्नांचे अंदाज देतो, अनुपालन प्रमाणपत्र नाही. 2. कव्हरेज फक्त मजकूर-आधारित आहे; गैर-मजकूर घटकांची तपासणी (WCAG 1.4.11) रोडमॅपवर आहे. 3. क्रॉस-उत्पत्ति iframe मध्ये प्रवेश केला जात नाही. 4. जटिल पार्श्वभूमी आणि अॅनिमेशन्स निश्चित संख्येच्या स्थानिक आणि कालिक बिंदूंवर नमुने घेतले जातात; सर्वात वाईट नमुन्याचे गुणोत्तर अहवालित केले जाते पण ते अजूनही आशावादी असू शकते; सॅम्पलर रेंडरिंग आर्टिफॅक्ट्सने देखील गोंधळात टाकले जाऊ शकते. 5. अत्यंत गतिशील साइट्स खोटी समस्या निर्माण करू शकतात. 6. हा रंग कॉन्ट्रास्ट चेकर प्रतिमांवर स्वयंचलितपणे OCR चालवत नाही; समाविष्ट रंग निवडक साधनाद्वारे अर्थपूर्ण मजकूर असलेल्या प्रतिमा चाचणी करा. 🔒 गोपनीयता आणि परवानग्या. ▸ स्थानिकपणे चालवतो; कोणतीही वेबपृष्ठ डेटा तुमच्या मशीनवरून बाहेर जात नाही. ▸ 'activeTab' फक्त: विश्लेषण स्क्रिप्ट तुम्ही टूलबार आयकॉनवर क्लिक केल्यावर समाविष्ट केली जाते. ▸ शॅडो DOM आणि iframe मध्ये प्रवेश करण्यासाठी, CSS स्रोतांचे ट्रेसिंग करण्यासाठी, आणि जटिल पार्श्वभूमीचे नमुने घेण्यासाठी 'डिबगर' परवानगी आवश्यक आहे. 🧮 अचूकता तपशील. अर्ध-पारदर्शक मजकूर आणि पूर्वजांची पारदर्शकता योग्यरित्या हाताळली जाते: अग्रभूमी ल्यूमिनन्स मोजण्यापूर्वी त्याच्या वास्तविक पार्श्वभूमीवर समाकलित केली जाते, त्यामुळे अहवालित गुणोत्तर वापरकर्ते प्रत्यक्षात काय पाहतात त्यास जुळते. विस्तृत-गॅमट रंग कार्ये — oklch, lab, lch, color(display-p3) — देखील समर्थित आहेत, गॅमटच्या बाहेर असताना sRGB वर क्लॅम्प केले जाते. 🎨 प्रतिमांवर आणि ग्रेडियंट्सवर मजकूर. सामान्यतः समान साधनांपेक्षा, हे साधन सपाट पार्श्वभूमीवर हार मानत नाही किंवा 'getComputedStyle' / 'CSS.getBackgroundColors' काय अहवाल देतात यावर विश्वास ठेवत नाही. हे ब्राउझरच्या पेंट ऑर्डरला चालवते जेणेकरून वास्तविक पार्श्वभूमी समाकलित होईल — पारदर्शकता, मिश्रण मोड, रेखीय ग्रेडियंट, पार्श्वभूमी-फिल्टर — आणि जेव्हा ते पुरेसे नसते, तेव्हा हा रंग कॉन्ट्रास्ट साधन मजकूराच्या स्थानावर रेंडर केलेले पिक्सेल नमुने घेतो. ❓ प्रश्न आणि उत्तरे 📌 समान रंग जोड्यांना कधी कधी WCAG आणि APCA अंतर्गत भिन्न निकाल का मिळतात? ↳ WCAG ल्यूमिनन्स मोजतो; APCA धारणा कॉन्ट्रास्ट मोजतो. एक जोड 4.5:1 पास करू शकते तरीही ब्रिज-PCA Lc थ्रेशोल्डच्या खाली राहू शकते — एक कठोर मॉडेल. 📌 APCA WCAG ची जागा घेतो का? ↳ नाही — APCA एक जागा घेत नाही, परंतु एक उपयुक्त दुसरे मत आहे. हा कॉन्ट्रास्ट चेकर दोन्ही अहवाल करतो. 📌 मी या प्रवेशयोग्यता चेकर्ससह स्थानिक फाइल किंवा माझ्या डेव्ह सर्व्हरची स्कॅन करू शकतो का? ↳ होय. विस्तार सेटिंग्जमध्ये "फाइल URL वर प्रवेशाची परवानगी द्या" सक्षम करा. file:// किंवा localhost URL उघडा आणि टूलबार आयकॉनवर क्लिक करा. फक्त chrome://, Chrome वेब स्टोअर, आणि इतर प्रतिबंधित योजना वगळल्या जातात. 📌 हे साधन ADA अनुपालन प्रमाणित करते का? ↳ नाही. हे फक्त रंग कॉन्ट्रास्ट तपासते — प्रवेशयोग्यतेचा एक पैलू. ADA अनुपालन अनेक मानक आणि निकष (सेमांटिक्स, कीबोर्ड प्रवेश, अल्ट टेक्स्ट, कॅप्शन, आणि अधिक) समाविष्ट करणारा एक कायदेशीर निर्णय आहे आणि याचे मूल्यांकन एक पात्र व्यावसायिकाने करणे आवश्यक आहे.