पैटर्न, कॉम्पोनेंट, और डिज़ाइन सिस्टम

कई लोग अपने डेवलपमेंट वर्कफ़्लो प्रोसेस में, पैटर्न स्टाइल गाइड, कॉम्पोनेंट लाइब्रेरी या पूरे डिज़ाइन सिस्टम का इस्तेमाल करके, कॉम्पोनेंट-ड्रिवन डेवलपमेंट का इस्तेमाल करते हैं. भले ही, आपने इन टूल का औपचारिक तौर पर इस्तेमाल न किया हो, लेकिन हो सकता है कि आपने वेबसाइट, ऐप्लिकेशन या किसी दूसरे डिजिटल प्रॉडक्ट के बड़े डिज़ाइन को मैनेज किए जा सकने वाले हिस्सों में बांटने के लिए, मिलती-जुलती प्रोसेस का इस्तेमाल किया हो.

किसी भौतिक स्ट्रक्चर को बनाने की तरह, एक बार में एक ही चीज़ बनाना ज़रूरी है. सबसे पहले, फ़ाउंडेशन, स्ट्रक्चर, दीवारें, खिड़कियां, छत वगैरह. कॉम्पोनेंट पर आधारित डेवलपमेंट टूल की मदद से, हम वेबसाइटों, ऐप्लिकेशन, और अन्य डिजिटल प्रॉडक्ट के लिए ऐसा कर सकते हैं.

कॉम्पोनेंट-ड्रिवन डेवलपमेंट के कुछ फ़ायदों में, चीज़ों को मैनेज किए जा सकने वाले हिस्सों में बांटना शामिल है. इसलिए, इन फिर से इस्तेमाल किए जा सकने वाले कॉम्पोनेंट के साथ, डेवलपमेंट में कम समय लगता है. इससे डिज़ाइनर, फ़्रंटएंड और बैकएंड डेवलपर, और क्यूए एक साथ काम कर सकते हैं. क्लाइंट, डिज़ाइनर, पीएम वगैरह को यह पसंद है, क्योंकि वे वेबसाइट लॉन्च होने के बाद, बिल्ड करने की प्रोसेस की झलक देख सकते हैं और लाइव स्टाइल गाइड का रेफ़रंस के तौर पर इस्तेमाल कर सकते हैं.

हालांकि, जब हम ऐक्सेस करने की सुविधा को ध्यान में रखकर पैटर्न, कॉम्पोनेंट, और डिज़ाइन सिस्टम देखते हैं, तो कुछ सवाल उठते हैं. आपको कैसे पता चलता है कि सुलभता के लिहाज़ से कौनसे पैटर्न सबसे सही हैं? क्या आपको किसी पहले से मौजूद पैटर्न या लाइब्रेरी का इस्तेमाल करना चाहिए या नई लाइब्रेरी बनानी चाहिए? आपको कैसे पता चलेगा कि ये पैटर्न, आपके उपयोगकर्ताओं के लिए वाकई मददगार होंगे या नहीं?

कई विकल्पों के उपलब्ध होने पर, पैटर्न, कॉम्पोनेंट, और डिज़ाइन सिस्टम के बारे में आसानी से भ्रम हो सकता है. इस मॉड्यूल का मकसद, आपको ऐक्सेस करने के लिए पैटर्न, कॉम्पोनेंट, और डिज़ाइन सिस्टम का आकलन करने के तरीके के बारे में सामान्य जानकारी देना है. साथ ही, आपको ऐक्सेस करने के लिए ज़्यादा विकल्प चुनने में मदद करने के लिए, एक शुरुआती पॉइंट भी देना है.

गंभीरता से सोचना

सुलभ पैटर्न, कॉम्पोनेंट या डिज़ाइन सिस्टम चुनना कोई मुश्किल काम नहीं है. हालांकि, इसमें समय और अच्छी तरह से सोच-विचार करने की ज़रूरत होती है. असल में, "एकदम सही पैटर्न" जैसी कोई चीज़ नहीं होती. हालांकि, ऐसे कई विकल्प हो सकते हैं जो काम कर सकते हैं. यह अपनी खास स्थिति के लिए सबसे अच्छा विकल्प चुनने का तरीका है.

जांच से जुड़े अगले मॉड्यूल में, आपको ऐक्सेस करने के लिए पैटर्न, कॉम्पोनेंट, और डिज़ाइन सिस्टम का आकलन करने के तरीकों और तकनीकों के बारे में ज़्यादा जानकारी मिलेगी. ऐसा करने से पहले, आपको खुद से कुछ बुनियादी सवाल पूछने होंगे. जैसे:

  • क्या ऐक्सेस करने लायक कोई पैटर्न, कॉम्पोनेंट या डिज़ाइन सिस्टम पहले से मौजूद है?
  • किन ब्राउज़र और सहायक टेक्नोलॉजी (AT) के साथ काम करता है?
  • क्या कोड या फ़्रेमवर्क से जुड़ी कोई पाबंदी है? क्या ऐसे अन्य इंटिग्रेशन, फ़ैक्टर या उपयोगकर्ता की ज़रूरतें हैं जिन पर मुझे ध्यान देना चाहिए?

आपके डेवलपर एनवायरमेंट और उपयोगकर्ता की ज़रूरतों के आधार पर, आपके पास इनके अलावा और भी सवाल हो सकते हैं. सुलभता के आकलन के लिए, इन सवालों को शुरुआती सवालों के तौर पर इस्तेमाल करें.

पहले से मौजूद संसाधन

कोई नया कॉन्टेंट बनाने से पहले, पूरी जांच-पड़ताल करें और देखें कि ऐक्सेस किए जा सकने वाले पैटर्न, कॉम्पोनेंट, और डिज़ाइन सिस्टम के मामले में पहले से क्या मौजूद है. थोड़ी सी रिसर्च करने पर, आपको अपनी ज़रूरतों के हिसाब से एक या उससे ज़्यादा समाधान मिल सकते हैं.

ऐक्सेस किए जा सकने वाले पैटर्न, कॉम्पोनेंट, और डिज़ाइन सिस्टम के लिए कुछ बेहतरीन संसाधनों में ये शामिल हैं:

JavaScript फ़्रेमवर्क के लिए, नीचे दिए गए संसाधन डिफ़ॉल्ट रूप से ऐक्सेस किए जा सकते हैं या उन्हें ऐक्सेस करने के लिए पसंद के मुताबिक बनाया जा सकता है:

हालांकि, आपको कभी भी कोड को कॉपी/चिपकाकर यह नहीं मानना चाहिए कि वह आपके एनवायरमेंट में काम करेगा और उपयोगकर्ता की ज़रूरतों को अपने-आप पूरा कर देगा. यह सभी पैटर्न, कॉम्पोनेंट, और डिज़ाइन सिस्टम के लिए सही है. भले ही, उन्हें पूरी तरह से ऐक्सेस करने लायक के तौर पर लेबल किया गया हो.

सभी संसाधनों को शुरुआती बिंदु के तौर पर देखा जाना चाहिए. सभी चीज़ों की जांच करना न भूलें!

ब्राउज़र और सहायक टेक्नोलॉजी (AT) के लिए सहायता

कुछ बुनियादी पैटर्न, कॉम्पोनेंट या पूरे डिज़ाइन सिस्टम के बारे में रिसर्च करने के बाद, जो आपके डेवलपर एनवायरमेंट के लिए काम कर सकता है, सहायक टेक्नोलॉजी के लिए सहायता पर जाएं. पैटर्न, कॉम्पोनेंट, और डिज़ाइन सिस्टम का आकलन करते समय, आपको स्क्रीन रीडर जैसे एटी पर फ़ोकस करना होगा.

स्क्रीन रीडर को खास ब्राउज़र के हिसाब से बनाया गया है. ये इन ब्राउज़र के साथ सबसे अच्छी तरह काम करते हैं. हम एटी टेस्टिंग वाले मॉड्यूल में इस विषय के बारे में ज़्यादा जानकारी देंगे. हालांकि, पैटर्न का आकलन करने के लिए, यह समझना ज़रूरी है कि ये कॉम्बिनेशन मौजूद हैं, ताकि आपको यह पता चल सके कि सहायता के लिए आपको क्या चाहिए.

स्क्रीन रीडर ओएस ब्राउज़र के साथ काम करना लागत
Job Access with Speech (JAWS) Windows Chrome, Firefox, Edge लाइसेंस की ज़रूरत है (40 मिनट का एक मुफ़्त वर्शन उपलब्ध है)
नॉन-विज़ुअल डेस्कटॉप ऐक्सेस (NVDA) Windows Chrome और Firefox मुफ़्त (डाउनलोड करना ज़रूरी है)
Narrator Windows Edge मुफ़्त (Windows मशीनों में पहले से मौजूद)
VoiceOver macOS Safari मुफ़्त (macOS मशीनों में पहले से मौजूद)
Orca Linux Firefox मुफ़्त (Gnome-based डिस्ट्रिब्यूशन में पहले से मौजूद)
TalkBack Android Chrome और Firefox मुफ़्त (Android OS के कुछ वर्शन में पहले से मौजूद)
VoiceOver iOS Safari मुफ़्त (iOS डिवाइसों में पहले से मौजूद)

आम तौर पर, ब्राउज़र के साथ काम करना मुश्किल होता है. इसमें AT डिवाइसों और ARIA स्पेसिफ़िकेशन को जोड़ने पर, चीज़ें और भी मुश्किल हो जाती हैं.

हालांकि, यह पूरी तरह से बुरी खबर नहीं है. शुक्र है कि एचटीएमएल5 के लिए सुलभता, सुलभता से जुड़ी सहायता, और WCAG की पसंद के मुताबिक कंट्रोल के लिए सुलभता से जुड़ी डेवलपमेंट चेकलिस्ट जैसे बेहतरीन संसाधनों की मदद से, हमें मौजूदा ब्राउज़र और एटी डिवाइस के लिए सहायता को बेहतर तरीके से समझने में मदद मिलती है. साथ ही, यह भी पता चलता है कि ARIA का इस्तेमाल कब करना चाहिए.

इन संसाधनों में, उपलब्ध एचटीएमएल और ARIA पैटर्न के अलग-अलग सब-एलिमेंट के बारे में बताया गया है. इनमें ओपन-सोर्स कम्यूनिटी टेस्ट भी शामिल हैं. डेस्कटॉप, मोबाइल ब्राउज़र, और एटी डिवाइसों के लिए, पैटर्न के कुछ उदाहरण भी देखे जा सकते हैं. इसलिए, इन संसाधनों की मदद से, आपको उन पैटर्न, कॉम्पोनेंट, और डिज़ाइन सिस्टम के बारे में बेहतर फ़ैसला लेने में मदद मिल सकती है जिनका इस्तेमाल आपको करना है.

दूसरी ज़रूरी बातें

ऐक्सेस किए जा सकने वाले कुछ बेस पैटर्न या कॉम्पोनेंट चुनने और ब्राउज़र और एटी डिवाइस के साथ काम करने के बारे में जानने के बाद, पैटर्न, कॉम्पोनेंट, डिज़ाइन सिस्टम, और डेवलपर एनवायरमेंट के बारे में ज़्यादा सटीक सवाल पूछे जा सकते हैं.

उदाहरण के लिए, अगर किसी मैनेजमेंट सिस्टम (सीएमएस) में काम किया जा रहा है या आपके पास लेगसी कोड है, तो हो सकता है कि आपके पास पैटर्न इस्तेमाल करने की कुछ सीमाएं हों. समीक्षा करने के बाद, कई पैटर्न विकल्पों को तुरंत एक या दो विकल्पों में बदला जा सकता है.

कई JavaScript फ़्रेमवर्क, डेवलपर को अपनी पसंद के हिसाब से किसी भी पैटर्न का इस्तेमाल करने की अनुमति देते हैं. ऐसे मामलों में, आपके पास कम पाबंदियां हो सकती हैं और सबसे आसान पैटर्न का विकल्प चुना जा सकता है.

पैटर्न, घटक या डिज़ाइन सिस्टम चुनते समय, इन बातों का भी ध्यान रखना चाहिए:

  • परफ़ॉर्मेंस
  • सुरक्षा
  • खोज इंजन ऑप्टिमाइज़ेशन
  • भाषा के अनुवाद से जुड़ी सहायता
  • तीसरे पक्ष के इंटिग्रेशन

इन बातों का असर, पैटर्न चुनने पर ज़रूर पड़ेगा. हालांकि, आपको कॉन्टेंट बनाने वाले लोगों और कोड के बारे में भी सोचना चाहिए. आपका चुना गया पैटर्न इतना मज़बूत होना चाहिए कि वह एडिटर जनरेटेड या यूज़र जनरेटेड कॉन्टेंट से जुड़ी किसी भी संभावित समस्या को हल कर सके. साथ ही, इसे इस तरह बनाया जाना चाहिए कि सभी ऐक्सेसबिलिटी के बारे में जानकारी रखने वाले डेवलपर इसका इस्तेमाल कर सकें.

देखें कि आपको क्या समझ आया

पैटर्न के बारे में अपनी जानकारी परखें

क्या ऐक्सेस किए जा सकने वाले कॉम्पोनेंट, उपयोगकर्ताओं के लिए हमेशा ऐक्सेस किए जा सकते हैं?

हां, इन कॉम्पोनेंट का इस्तेमाल बिना किसी अतिरिक्त काम के किया जा सकता है.
सुलभता के लिए बनाए गए संसाधन, अन्य संसाधनों की तुलना में अपने-आप काम करने की संभावना ज़्यादा होती है. हालांकि, यह ज़रूरी है कि आप सुलभता की जांच करें, ताकि यह पक्का किया जा सके कि ये कॉम्पोनेंट आपके उपयोगकर्ताओं के लिए काम करते हैं.
नहीं, आपको पहले अपने कॉम्पोनेंट की जांच करनी होगी.
सुलभता के लिए डिज़ाइन किए गए कॉम्पोनेंट और पैटर्न की भी जांच की जानी चाहिए. ऐसा हो सकता है कि इसे अन्य मौजूदा कॉम्पोनेंट के साथ ऐक्सेस न किया जा सके.