आपके ब्रांड के रंगों का गहरा भावनात्मक प्रभाव होता है, लेकिन वे उन साइट विज़िटरों को कैसे दिखाई देते हैं जो आंशिक रूप से दृष्टिहीन हैं, रंग-अंध हैं, या ऐसे पर्यावरणीय कारकों का सामना करते हैं जो दृश्यता को कठिन बनाते हैं?
रंग और कंट्रास्ट स्तर संचार के लिए महत्वपूर्ण हैं, और इन विवरणों को सही ढंग से प्राप्त करना पहुंच-योग्यता-दिमाग वाले डिजाइनर के लिए महत्वपूर्ण है।'
रंग बोध संबंधी विकार जितना आप सोच सकते हैं उससे कहीं अधिक सामान्य हैं। तो, इस पोस्ट में, हम इस बारे में बात करेंगे कि कम दृष्टि, डिस्लेक्सिया और कलर ब्लाइंडनेस जैसे विकलांग लोग वेब के साथ कैसे इंटरैक्ट करते हैं।
विषय - सूची
मैं अपनी वेबसाइट की पहुंच को बेहतर बनाने के लिए कलर चेकर का उपयोग कैसे करूं?
यह अनुभाग वास्तव में काफी सरल है, हालाँकि इसमें कुछ प्रयास की आवश्यकता है। आपको WebAIM के ऑनलाइन कंट्रास्ट चेकर टूल का उपयोग करना होगा। WebAIM दुनिया भर में वेब पहुंच बढ़ाने के मिशन के साथ यूटा स्टेट यूनिवर्सिटी पर आधारित एक गैर-लाभकारी संगठन है।
बस अपना अग्रभूमि रंग (उदाहरण के लिए, आपके टेक्स्ट या आइकन का रंग) और पृष्ठभूमि रंग को हेक्साडेसिमल मान (जिसे हेक्स मान भी कहा जाता है) के रूप में दर्ज करें, जैसा कि इसमें निर्दिष्ट है एचटीएमएल या सीएसएस, और कंट्रास्ट अनुपात चेकर आपको सूचित करेगा कि अनुपात पर्याप्त है या नहीं। याद रखें कि आपको जो न्यूनतम कंट्रास्ट अनुपात चाहिए वह 4.5 से 1 है। सफेद पृष्ठभूमि पर काले टेक्स्ट का कंट्रास्ट अनुपात 21 से 1 है, इसलिए आपके पास काफी छूट है।
वेब कलर पैलेट बनाने के लिए 5 उपकरण जिन्हें हर कोई देख सकता है
1. WebAIM कलर कंट्रास्ट चेकर
अग्रभूमि और पृष्ठभूमि के लिए हेक्स रंग दर्ज करें। आउटपुट नमूना वाक्य के साथ सामान्य और बड़े पाठ के लिए एए और एएए अनुपालन दिखाता है। स्लाइडर आपको तब तक चीज़ें बदलने देते हैं जब तक आपको एक अच्छा संयोजन नहीं मिल जाता।
ताकत
- इंटरफ़ेस वाला सरल टूल जो आंखों के लिए आसान है।
- यह शुरुआती लोगों के लिए एक अच्छा, सरल उपकरण है, न कि केवल डिजाइनरों के लिए।
कमजोरियों
- दो से अधिक रंगों की तुलना नहीं कर सकते, केवल दो।
- हल्कापन स्लाइडर रंग चुनने का बहुत अच्छा तरीका नहीं है। यह बताना मुश्किल है कि इस साधारण डिस्प्ले में कितने आकर्षक रंग हैं।
2. WCAG के लिए कंट्रास्ट चेकर
अग्रभूमि और पृष्ठभूमि के लिए हेक्स रंग दर्ज करें। लोरेम इप्सम पाठ के नमूने के बगल में सामान्य और बड़े पाठ के लिए एए और एएए अनुपालन दिखाता है। आप एक तस्वीर भी अपलोड कर सकते हैं. आपके लिए 9-रंग का पैलेट स्वचालित रूप से चुना जाता है। फिर, आप प्रत्येक रंग की तुलना अग्रभूमि या पृष्ठभूमि रंग के रूप में कर सकते हैं।
ताकत
- उपयोगकर्ता के अनुकूल इंटरफेस के साथ सरल उपकरण।
- छवियों से पैलेट बनाने की क्षमता होना।
कमजोरियों
- पैलेट स्वचालित रूप से चुना जाता है, और आप इसे रंग पिकर के साथ आगे बदल सकते हैं, लेकिन वे परिवर्तन पैलेट में वापस सहेजे नहीं जाते हैं। किसी को जानकारी को कॉपी करके एक नए दस्तावेज़ में पेस्ट करना होगा।
3. रंग घन
पैलेट के लिए रंग दर्ज करें, प्रत्येक अपनी लाइन पर। आउटपुट छोटे और बड़े फ़ॉन्ट के लिए AA मानकों की तुलना में कंट्रास्ट अनुपात के साथ नमूना अक्षर दिखाता है। तीन कॉलम एक सफेद पृष्ठभूमि, एक काली पृष्ठभूमि और ब्रांड रंगों के एक सेट के साथ कंट्रास्ट दिखाते हैं जो "उपलब्ध से सबसे अधिक सुपाठ्य" हैं।
ताकत
- आंखों पर आसान उपयोगकर्ता इंटरफ़ेस (यूआई) सुव्यवस्थित है, और पास/असफल/एज स्थिति देखना आसान है।
कमजोरियों
- एएए द्वारा निर्धारित मानकों को पूरा नहीं करता.
- हर संभव रंग संयोजन नहीं करता है, और पहली बार में यह स्पष्ट नहीं है कि मामला यही है।
4.) आठ आकृतियाँ कंट्रास्ट ग्रिड
पैलेट रंग दर्ज करें. इसके अलावा, आप प्रत्येक रंग को एक नाम भी दे सकते हैं। ऐप रंगों के हर संभव संयोजन के साथ एक तालिका बनाता है। टाइल्स के तीन आकार हैं. एए और एएए पास/फेल/एज और प्रभावी कंट्रास्ट अनुपात के लिए दृश्य संकेत हैं। कॉलम और पंक्तियों को खींचकर और छोड़ कर ऐप में इधर-उधर ले जाया जा सकता है। सारणीबद्ध डेटा को सहेजा, निर्यात और साझा किया जा सकता है।
ताकत
- ऐसी कई उपयोगी सुविधाएं हैं जो संपूर्ण पैलेट के विश्लेषण में मदद करती हैं।
कमजोरियों
- उपयोग में आसान अन्य उपकरणों की तुलना में इसे सीखना कठिन है।
- केवल दो रंगों की तुलना करना सही तरीका नहीं है.
- यह पता लगाने के लिए अच्छा नहीं है कि रंग एक साथ कैसे चलते हैं।
- देखने में थोड़ा अटपटा है, लेकिन इसमें बहुत सारी जानकारी दिखाई जा रही है।
5. रंग सुरक्षित
पृष्ठभूमि रंग टाइप करें. फ़ॉन्ट का परिवार, आकार और वजन चुनें। मानक के रूप में AA या AAA चुनें। चयनित रंग और उसका हेक्स कोड, साथ ही एक नमूना और प्रभावी कंट्रास्ट अनुपात दिखाता है। पर्याप्त कंट्रास्ट के साथ संभावित अग्रभूमि रंगों के बड़े थंबनेल सबसे अच्छा हिस्सा हैं। आप उन सभी को या केवल कुछ विशेष रंग समूहों (हरा, नीला, बैंगनी, आदि) को देखना चुन सकते हैं।
ताकत
- आंखों के लिए आसान इंटरफ़ेस के साथ, रंगों का ऐसा संयोजन ढूंढना आसान है जो अच्छा दिखता हो और अच्छा काम करता हो।
- यदि आपके पास पहले से कोई ब्रांड रंग पैलेट नहीं है या यदि आप वेब के लिए पहले से मौजूद किसी ब्रांड रंग पैलेट में जोड़ना चाहते हैं तो यह एक उपयोगी उपकरण है।
कमजोरियों
- आप एक समय में केवल अग्रभूमि और पृष्ठभूमि रंगों की तुलना कर सकते हैं।
- यदि आप रंगों को सहेजना चाहते हैं तो आपको रंगों को कॉपी करके एक अलग दस्तावेज़ में पेस्ट करना होगा।
- बाहर जाओ और सबके लिए चीज़ें बनाओ!
एक बार जब आप जान जाएंगे कि इन उपकरणों का उपयोग कैसे करना है, तो आप पाएंगे कि आपको एक परियोजना के लिए एक से अधिक की आवश्यकता है। हो सकता है कि कलर क्यूब क्लाइंट को यह दिखाने का सबसे अच्छा तरीका है कि आपने एक्सेसिबिलिटी के बारे में क्या सीखा है। हो सकता है कि आप त्वरित स्पॉट जांच करने के लिए हर समय WebAIM के टूल का उपयोग करेंगे।
निष्कर्ष
जिन युक्तियों, दिशानिर्देशों और उपकरणों के बारे में हमने अभी बात की है, उनका उपयोग करके आप अपनी वेबसाइट को उच्च-विपरीत रंग और लेबल दे सकते हैं। इससे कम दृष्टि, डिस्लेक्सिया और रंग अंधापन वाले लोगों के लिए आपकी वेबसाइट और सामग्री को पढ़ना आसान हो जाएगा। यदि आपके सामान्य दर्शकों को भी आपकी वेबसाइट का उपयोग करना आसान लगता है तो आश्चर्यचकित न हों।
