वेब डिज़ाइन में अग्रभूमि और पृष्ठभूमि रंगों का कंट्रास्टिंग का उपयोग करना

पर्याप्त विपरीत के साथ अपनी वेबसाइट की पठनीयता और उपयोगकर्ता अनुभव में सुधार करें

किसी भी वेबसाइट के डिजाइन की सफलता में कंट्रास्ट एक महत्वपूर्ण भूमिका निभाता है। उस साइट की टाइपोग्राफी से , साइट पर उपयोग की जाने वाली छवियों के लिए, अग्रभूमि तत्वों और पृष्ठभूमि रंगों के बीच के विपरीत - एक अच्छी तरह से डिज़ाइन की गई साइट के पास इन सभी क्षेत्रों में गुणवत्ता के उपयोगकर्ता अनुभव और दीर्घकालिक साइट की सफलता सुनिश्चित करने के लिए पर्याप्त विपरीत होना चाहिए।

कम कंट्रास्ट एक गरीब पठन अनुभव के बराबर है

ऐसी वेबसाइटें जो कि बहुत कम हैं, पढ़ने और उपयोग करने में मुश्किल हो सकती हैं, जो किसी भी साइट की सफलता पर नकारात्मक प्रभाव डालती हैं। खराब रंग विपरीत मुद्दों को अक्सर पहचानना आसान होता है। आप आमतौर पर एक वेब ब्राउज़र में प्रस्तुत किए गए पृष्ठ को देखकर ऐसा कर सकते हैं और आप देख सकते हैं कि खराब रंग विकल्पों के कारण पाठ को पढ़ने में बहुत मुश्किल है या नहीं। फिर भी, यह निर्धारित करना आसान हो सकता है कि कौन से रंग अच्छी तरह से काम नहीं करते हैं, यह वास्तव में यह तय करना बहुत चुनौतीपूर्ण हो सकता है कि रंग दूसरों के विपरीत क्या काम करते हैं। हो सकता है कि आप काम न करें, लेकिन आप कैसे निर्धारित करेंगे कि काम क्या करता है? इस आलेख में छवि आपको विभिन्न रंगों और विभिन्न अग्रभूमि और पृष्ठभूमि रंगों के विपरीत कैसे दिखने में मदद करनी चाहिए। आप कुछ "अच्छी" जोड़ी और कुछ "खराब" जोड़ी देख सकते हैं, जो आपको अपनी परियोजनाओं में सही रंग विकल्प बनाने में मदद करेगा।

कंट्रास्ट के बारे में

एक चीज आपको ध्यान देनी चाहिए कि यह विपरीत है कि पृष्ठभूमि से रंग की तुलना कितनी उज्ज्वल है। जैसा कि आपको उपर्युक्त छवि में देखा जाना चाहिए, इनमें से कुछ रंग बहुत उज्ज्वल हैं और पृष्ठभूमि रंग पर चमकते दिखाई देते हैं - जैसे कि नीले रंग के नीले रंग के, लेकिन मैंने अभी भी इसे खराब कंट्रास्ट के रूप में लेबल किया है। मैंने ऐसा इसलिए किया क्योंकि, यह उज्ज्वल हो सकता है, रंग संयोजन अभी भी पाठ को पढ़ने में मुश्किल बनाता है। यदि आप काले रंग की पृष्ठभूमि पर सभी नीले रंग के पाठ में एक पृष्ठ बनाना चाहते थे, तो आपके पाठकों को बहुत जल्दी eyestrain होगा। यही कारण है कि विपरीत सिर्फ काले और सफेद नहीं है (हाँ, वह पन इरादा था)। इसके विपरीत नियम और सर्वोत्तम प्रथाएं हैं, लेकिन एक डिजाइनर के रूप में आपको यह सुनिश्चित करने के लिए हमेशा उन नियमों का मूल्यांकन करना होगा कि वे आपके विशेष उदाहरण में काम करते हैं।

रंग चुनना

कंट्रास्ट आपकी वेबसाइट के डिज़ाइन के लिए रंग चुनते समय विचार करने वाले कारकों में से एक है, लेकिन यह एक महत्वपूर्ण है। रंग चुनते समय, कंपनी के लिए ब्रांड मानकों से सावधान रहें, लेकिन रंगीन पट्टियों को संबोधित करने के लिए भी तैयार रहें, जबकि वे किसी संगठन के ब्रांड दिशानिर्देशों के अनुरूप हो, जबकि ऑनलाइन अच्छी तरह से काम न करें। उदाहरण के लिए, मैंने हमेशा वेबसाइटों पर प्रभावी ढंग से उपयोग करने के लिए पीले और चमकीले हिरणों को बहुत चुनौतीपूर्ण पाया है। यदि ये रंग किसी कंपनी के ब्रांड दिशानिर्देशों में हैं, तो उन्हें संभावित रूप से उच्चारण रंगों के रूप में उपयोग करने की आवश्यकता होगी, क्योंकि रंगों को ढूंढना मुश्किल है जो कि किसी के साथ अच्छी तरह से विपरीत हैं।

इसी प्रकार, यदि आपके ब्रांड रंग काले और सफेद हैं, तो इसका मतलब बहुत विपरीत है, लेकिन यदि आपके पास लंबी मात्रा में टेक्स्ट वाली साइट है, तो सफेद टेक्स्ट के साथ काली पृष्ठभूमि होने से बहुत मुश्किल पढ़ना पड़ेगा। काले और सफेद के बीच का अंतर भी बहुत अच्छा है, काले रंग की पृष्ठभूमि पर सफेद पाठ लंबे मार्गों के लिए आंखों के तनाव का कारण बनता है। इस मामले में, मैं रंगों को एक सफेद पृष्ठभूमि पर काले पाठ का उपयोग करने के लिए उलटा कर दूंगा। यह दृष्टि से रूचि नहीं हो सकता है, लेकिन आप इससे बेहतर विपरीत नहीं पाएंगे!

ऑनलाइन उपकरण

अपनी खुद की डिज़ाइन भावना के अतिरिक्त, कुछ ऑनलाइन टूल हैं जिनका उपयोग आप अपनी साइट की रंगीन पसंद का परीक्षण करने के लिए कर सकते हैं।

CheckMyColors.com आपकी सभी साइट के रंगों का परीक्षण करेगा और पृष्ठ पर तत्वों के बीच विपरीत अनुपात पर रिपोर्ट करेगा।

इसके अतिरिक्त, रंग विकल्पों के बारे में सोचते समय, आपको वेबसाइट पहुंच और उन लोगों के बारे में भी विचार करना चाहिए जिनके रंगहीनता के रूप हैं। WebAIM.org इसके साथ मदद कर सकता है, जैसे ContrastChecker.com, जो डब्ल्यूसीएजी दिशानिर्देशों के खिलाफ आपके विकल्पों का परीक्षण करेगा।