मिरियम सुज़ैन, कोलोराडो के डेनवर शहर में एक लेखक, कलाकार, और वेब डेवलपर हैं. वे फ़िलहाल, कंटेनर क्वेरी और कैसकेड लेयर जैसी सीएसएस से जुड़ी दिलचस्प जानकारी पर काम कर रही हैं.
यह पोस्ट Designcember का हिस्सा है. वेब डिज़ाइन का जश्न, जिसे web.dev ने आपके लिए लाया है.
मिरियम सुज़ैन डेनवर, कोलोराडो में लेखिका, कलाकार, और वेब डेवलपर हैं. ये OddBird (एक वेब एजेंसी) की को-फ़ाउंडर हैं. वे CSSTricks में स्टाफ़ के तौर पर लेखक, Sass की कोर टीम की सदस्य हैं. इसके अलावा, वे सीएसएस वर्किंग ग्रुप में W3C न्योता पाने वाले विशेषज्ञ भी हैं. हाल ही में, उन्होंने कैस्केड लेयर, कंटेनर क्वेरी, और दायरे जैसी सीएसएस की नई सुविधाएं डेवलप करने पर ध्यान दिया है. ऑफ़लाइन, मिरियम एक प्रकाशित उपन्यासकार, नाटककार, और संगीतकार है. हमने नैस और सीएसएस के साथ उनके काम के बारे में बात की.
रेचल: मुझे पहली बार आपके काम के बारे में, आपके ग्रिड फ़्रेमवर्क Susy की वजह से पता चला. आपने ऐसा क्यों किया?
मिरियम: साल 2008 में, वेब पर लेआउट इस्तेमाल करने का अनुभव काफ़ी अलग था. डेवलपर, टेबल लेआउट को छोड़कर ज़्यादा सिमेंटिक (लेकिन अब भी हैकी) फ़्लोट किए गए ग्रिड का इस्तेमाल कर रहे हैं. 12 कॉलम वाले एक ही साइज़ के "ग्रिड फ़्रेमवर्क" में भारी उछाल आया. इससे, पहले से तय सीएसएस क्लास के सेट के साथ पहले से तय (आम तौर पर स्टैटिक) ग्रिड मिलती थी. अगर आपको अपनी पसंद के मुताबिक कुछ भी बनाना था, तो वह भी आपके पास था. यह साफ़ था कि वेबसाइटों को ज़्यादा रिस्पॉन्सिव होने की ज़रूरत है. हालांकि, अभी तक मीडिया से जुड़ी क्वेरी उपलब्ध नहीं थीं. साथ ही, फ़्लूइड फ़्लोट में ब्राउज़र के साथ काम करने से जुड़ी ढेर सारी समस्याएं थीं.
मैं नैटली डाउन के सीएसएस सिस्टम का इस्तेमाल कर रही थी. यह तरीका फ़ॉन्ट और व्यूपोर्ट साइज़, दोनों के हिसाब से काम करने के लिए अच्छा था, लेकिन गणित और ब्राउज़र को बार-बार आज़माने से मैं परेशान थी. इसके साथ ही, Sass चैनल पर लोगों का ध्यान आने लगा और यह उनकी ज़रूरत के हिसाब से बिलकुल सही था. सुसी का पहला ड्राफ़्ट बहुत आसान था. इसमें उन्हें हिसाब लगाना था और ज़रूरत के हिसाब से नुस्खे जोड़ना था. हमारा लक्ष्य कम से कम ज़रूरी कोड डालना था और सिर्फ़ ज़रूरी कोड जनरेट करना था. पहले से तय क्लास के बिना, पूरी तरह से पसंद के मुताबिक बनाए जा सकने वाले ग्रिड.
रेचल: आपने सीएसएस प्रीप्रोसेसर पर काम करने के बजाय, सीएसएस की खास बातों पर काम करने के तरीके को कैसे बदला? क्या आपको लगता है कि स्पेसिफ़िकेशन लिखने के लिए प्रीप्रोसेसर पर काम करना एक अच्छा बैकग्राउंड था?
मिरियम: मेरे अनुभव के हिसाब से, बहुत सारी चीज़ें एक जैसी हैं. साथ ही, मैं अब भी दोनों तरफ़ से बहुत ज़्यादा सक्रिय हूं. हालांकि, मुझे लगता है कि इसके लिए खास तौर पर Sass टीम की वजह से, Nataley Viizenbaum की टीम काफ़ी लंबे समय तक काम करती है. यह टीम ऐसे टूल बनाने की कोशिश करती है जो वेब के मानकों को बनाने के साथ आसानी से इंटिग्रेट हो सकें. एक जैसी सोच वाले लोगों की "राय" करना जब आप मुख्य वेब मानकों के भविष्य के बारे में सोचते हैं, तो समाधान और लंबे समय तक चलने वाला लचीला होना ज़रूरी है.
हम सुलभता और अन्य ज़रूरी पहलुओं को ध्यान में रखते हुए, ऐसे टूल कैसे बना सकते हैं जो डेवलपर की अलग-अलग ज़रूरतों और तरीकों को ध्यान में रखकर बनाए गए हों?
रेचल: ऐसी कई चीज़ें हैं जो सीएसएस में आ रही हैं. ये ऐसी सुविधाएं हैं जो पारंपरिक रूप से Sass का हिस्सा थीं. क्या अब भी Sass जैसा कुछ इस्तेमाल करने की कोई ठोस वजह है?
मिरियम: हां, कुछ लोगों के लिए—लेकिन हर जगह इसका कोई जवाब नहीं है. वैरिएबल का उदाहरण लें. Sass वैरिएबल, लेक्सी स्कोप वाले होते हैं और सूचियों और ऑब्जेक्ट, रंग में बदलाव जैसे डेटा स्ट्रक्चर के साथ, सर्वर पर कंपाइल किए जाते हैं. यह डिज़ाइन सिस्टम लॉजिक के लिए बढ़िया है, जिसे ब्राउज़र में चलाने की ज़रूरत नहीं होती.
सीएसएस वैरिएबल में कुछ ओवरलैप होते हैं, वे वैल्यू को भी स्टोर कर सकते हैं, लेकिन वे कैस्केड पर आधारित खूबियों और कमियों का पूरी तरह से अलग सेट देते हैं. Sass, कस्टम प्रॉपर्टी को और सीएसएस में स्ट्रक्चर्ड डेटा को हैंडल नहीं कर सकता. दोनों ही उपयोगी हैं और असरदार भी हैं—लेकिन आपकी खास ज़रूरतें अलग-अलग हो सकती हैं.
मुझे लगता है कि जब लोग उन टूल को खत्म कर देते हैं जिनकी अब उन्हें ज़रूरत नहीं होती, तो यह बहुत अच्छा विकल्प होता है. ऐसा भी हो सकता है कि कुछ प्रोजेक्ट में सर्वर और क्लाइंट-साइड, दोनों वैरिएबल की ज़रूरत न पड़े. शानदार! हालांकि, यह मानना बहुत आसान है कि वे एक जैसी हैं और एक बस दूसरे की जगह ले लेती है. कुछ डिज़ाइन लॉजिक के लिए हमेशा सर्वर-साइड और कुछ क्लाइंट-साइड के इस्तेमाल के उदाहरण होंगे. भले ही, हम उस सीमा में पहुंच जाएं जहां भाषाएं एक जैसी सुविधाएं उपलब्ध कराती हैं. प्री-प्रोसेसर लंबे समय तक हमारे साथ रहते हैं.
रेचल: क्या कोई ऐसी चीज़ है जिसने आपको हैरान किया हो क्योंकि मानक बनाने में आप ज़्यादा शामिल हो गए हैं या ऐसा कुछ है जिसके बारे में लोग शायद आम तौर पर इस प्रोसेस के बारे में नहीं जानते?
मिरियम: इसमें शामिल होने से पहले, मानक प्रोसेस एक रहस्यमयी और जादुई काले बॉक्स की तरह लग रही थी. मुझे नहीं पता था कि इसके लिए क्या उम्मीद करनी चाहिए. मुझे यह डर लग रहा था कि योगदान देने के लिए, शायद मुझे ब्राउज़र के इंटरनल वर्शन की पूरी जानकारी नहीं है. हालांकि, हकीकत यह है कि मुझे ब्राउज़र के लिए और इंजीनियर की ज़रूरत नहीं है. उन्हें और ज़्यादा डेवलपर और डिज़ाइनर की ज़रूरत है, जो जंगल में वेबसाइटें और ऐप्लिकेशन बना रहे हैं.
मुझे यह जानकर हैरानी हुई कि इसमें बहुत कम लोग मुख्य रूप से मानकों पर ध्यान दे रहे हैं, लेकिन उनमें से बहुत कम लोग, मुख्य रूप से वेबसाइटें डेवलप या डिज़ाइन कर रहे हैं. W3C बना है 'वॉलंटियर' से सदस्य संगठनों से ली गई हों (अक्सर संगठन पैसे देते हैं, लेकिन उनके मुख्य काम के रूप में नहीं) और सदस्यता सस्ती नहीं है. इस वजह से, हिस्सा लेने वाले लोगों को रोज़मर्रा के डिज़ाइनर और डेवलपर से अलग दिखाया जा सकता है. खास तौर पर, हम में से वे लोग जो छोटी एजेंसियों या फ़्रीलांसर में क्लाइंट से काम करते हैं. न्योता पाने वाले विशेषज्ञ के तौर पर मेरी भूमिका पूरी तरह से वॉलंटियर होती. यह एक महंगा शौक होता, अगर मुझे इस काम के लिए बाहर से फ़ंड नहीं मिलता.
असल में, यह प्रोसेस काफ़ी खुली और सार्वजनिक है और इसमें डेवलपर की भागीदारी की ज़रूरत होती है. हालांकि, एक साथ बहुत सारी बातें हो जाती हैं, इसलिए किसी जगह को ढूंढना मुश्किल हो सकता है. खासकर तब, जब यह आपका काम नहीं हो.
रेचल: कंटेनर क्वेरी कई सालों से कई वेब डेवलपर के लिए सबसे अहम रही हैं. मैं इस बात से बहुत उत्साहित हूं कि ये हमें मिल रहे हैं. मुझे लगता है कि बहुत सारे लोग कंटेनर क्वेरी की उपयोगिता के बारे में सोच रहे हैं—क्या आपको लगता है कि उनमें भी ज़्यादा क्रिएटिविटी दिखाई देने की संभावना है?
मिरियम: बिलकुल, हालांकि, मुझे वे पूरी तरह से अलग नहीं लगते. हम सभी के पास सीमित समय होता है और हम रखरखाव और परफ़ॉर्म करने वाले कोड लिखने की कोशिश कर रहे हैं. जब किसी चीज़ को व्यावहारिक रूप से करना मुश्किल होता है, तो हमारे लिए उस काम को क्रिएटिव बनाने की कम संभावना होती है.
अब भी, वेब उद्योग पर बड़े कॉर्पोरेट हितों का दबदबा है. इसलिए, कारोबारी चिंताओं को हमेशा वेब कलाकारों की तुलना में ज़्यादा एयरटाइम मिलता है. साथ ही, मुझे लगता है कि सुविधाओं के मुख्य इस्तेमाल के तौर पर, वेब क्रिएटिविटी पर ध्यान न देने पर, हम बहुत कुछ खो देते हैं. मुझे यह देखकर बहुत खुशी हो रही है कि कुछ सीएसएस आर्ट वाले लोग कंटेनर क्वेरी प्रोटोटाइप के साथ काम कर रहे हैं. जे टॉम्पकिंस ने पुराने एंटी-सीएसएस मीम की कमेंट्री के तौर पर, सीएसएस विनेशियन ब्लाइंड्स का एक स्मार्ट और इंटरैक्टिव डेमो तैयार किया था. मुझे लगता है कि उस जगह पर एक्सप्लोर करने के लिए और भी बहुत कुछ है. मुझे इस बात का बेसब्री से इंतज़ार है कि लोग और भी बहुत कुछ लेकर आते हैं.
इस बातचीत में इस्तेमाल के मूल उदाहरण के तौर पर, साइज़ पर आधारित क्वेरी पर भी फ़ोकस किया गया है. हालांकि, मुझे यह देखने में खुशी हो रही है कि लोग स्टाइल क्वेरी का इस्तेमाल कैसे करते हैं. इसमें सीएसएस प्रॉपर्टी या वैरिएबल की वैल्यू के आधार पर, कंडिशनल स्टाइल में लिखने की सुविधा शामिल है. यह एक बेहद असरदार सुविधा है और अब तक बहुत कम लोगों ने इसका पता लगाया है. मुझे लगता है कि इससे और भी ज़्यादा क्रिएटिव अवसर पैदा होते हैं!
रेचल: क्या ऐसा कुछ है जो हम सीएसएस में नहीं कर सकते (या आने वाले समय में करने का कोई ऐसा तरीका है) जो आपको लगता है कि काम का होगा?
मिरियम: मैं कुछ दूसरी चीज़ों को लेकर काफ़ी उत्साहित हूं, जिन पर मैं काम कर रही हूं. कैस्केड लेयर की मदद से, लेखकों को खास समस्याओं पर ज़्यादा कंट्रोल मिल पाएगा. साथ ही, स्कोप से सिलेक्टर को ज़्यादा सटीक तरीके से टारगेट करने में मदद मिलेगी. हालांकि, ये दोनों ही आर्किटेक्चर से जुड़ी गंभीर समस्याएं हैं. सीएसएस टॉगल, इंटरैक्टिव स्टाइल बनाने का एलान वाला तरीका या कंटेनर 'टाइमलाइन' जैसी चीज़ों को लेकर मुझे ज़्यादा दिलचस्पी है. इससे हमें मीडिया या कंटेनर ब्रेकपॉइंट के बीच वैल्यू को आसानी से ट्रांज़िशन करने में मदद मिलती है. यह रिस्पॉन्सिव टाइपोग्राफ़ी के लिए बहुत काम का है, लेकिन इससे रिस्पॉन्सिव आर्ट और ऐनिमेशन के लिए कई क्रिएटिव अवसर भी मिलेंगे.
रेचल: अभी और कौन वेब पर वाकई दिलचस्प, मज़ेदार या क्रिएटिव काम कर रहा है?
मिरियम: ओह, मुझे यह भी नहीं पता कि इसका जवाब कैसे दूं, ऐसे अलग-अलग क्षेत्रों में बहुत से लोग क्रिएटिव काम कर रहे हैं. CSSWG और Open-UI, दोनों ही अभी बहुत से रोमांचक स्टैंडर्ड पर काम कर रहे हैं. इनमें फ़्रैगमेंटेशन पर किए गए आपके कुछ काम भी शामिल हैं. हालांकि, मुझे अक्सर वेब कलाकारों से प्रेरणा मिलती है. साथ ही, यह भी पता चलता है कि लोग कैसे इन टूल को प्रोडक्शन में इस्तेमाल कर रहे हैं. ये ऐसे तरीके हैं जो कॉमर्स से सीधे तौर पर नहीं जुड़े हैं. जेई या लिन फ़िशर या युआन चुआन जैसे लोग या ऐसे कई लोग जो उस सीमा को पार कर रहे हैं कि वेब टेक्नोलॉजी विज़ुअल और इंटरैक्टिव तरीके से क्या-क्या कर सकती हैं. यहां तक कि कारोबार को ध्यान में रखकर काम करने वाले लोग भी अपनी कला से जुड़ी तकनीकों से बहुत कुछ सीख सकते हैं.
मैं बेन ग्रॉसर जैसे लोगों की वैचारिक वेब आर्ट की भी सराहना करता हूं, जो वेब और खास तौर पर सोशल मीडिया से अपनी मनचाही जानकारी पर विचार करने के लिए हमें हमेशा प्रेरित करते रहते हैं. उदाहरण के लिए, उनका नया minus.social देखें.
रेचल: सीएसएस के लिए css.oddbird.net पर मिरियम के काम की जानकारी पाएं और miriam.codes और Twitter @TerribleMia पर जाकर, यह जानें कि वे और क्या-क्या कर रही हैं.